From d1873e3bd839aa8adfbaa452f8cf446031a4e9a5 Mon Sep 17 00:00:00 2001
From: Jason McBrayer <jmcbray@carcosa.net>
Date: Mon, 3 Dec 2018 08:29:59 -0500
Subject: [PATCH] Really fix card image formatting.

---
 brutaldon/static/css/brutaldon-dark.css    | 7 +++++--
 brutaldon/static/css/brutaldon.css         | 5 ++++-
 brutaldon/templates/main/toot_partial.html | 6 ++++--
 3 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/brutaldon/static/css/brutaldon-dark.css b/brutaldon/static/css/brutaldon-dark.css
index 5eed8c5..95957d1 100644
--- a/brutaldon/static/css/brutaldon-dark.css
+++ b/brutaldon/static/css/brutaldon-dark.css
@@ -208,15 +208,18 @@ input#id_poll_frequency
 .card
 {
     margin-top: 1em;
+    margin: 0, auto;
 }
 
 .card-image
 {
     padding: 1em;
-    margin 0, auto;
 }
+
 .card-image figure
 {
-    padding-top: 25%;
+    padding: 0;
+    max-height: 256px;
+    max-width: 256px;
 
 }
diff --git a/brutaldon/static/css/brutaldon.css b/brutaldon/static/css/brutaldon.css
index 8f4a8d3..c337445 100644
--- a/brutaldon/static/css/brutaldon.css
+++ b/brutaldon/static/css/brutaldon.css
@@ -191,6 +191,7 @@ body.has-navbar-fixed-top, html.has-navbar-fixed-top {
 .card
 {
     margin-top: 1em;
+    margin: 0, auto;
 }
 
 .card-image
@@ -200,6 +201,8 @@ body.has-navbar-fixed-top, html.has-navbar-fixed-top {
 
 .card-image figure
 {
-    padding-top: 25%;
+    padding: 0;
+    max-height: 256px;
+    max-width: 256px;
 
 }
diff --git a/brutaldon/templates/main/toot_partial.html b/brutaldon/templates/main/toot_partial.html
index 9ed4941..29a709b 100644
--- a/brutaldon/templates/main/toot_partial.html
+++ b/brutaldon/templates/main/toot_partial.html
@@ -61,16 +61,18 @@
                         </div>
                         {% if toot.card.image %}
                         <div class="card-image">
-                            <figure class="image is-max-256">
+                            <figure>
                                 <a href="{{ toot.card.url }}">
-                                    <img alt="{{ toot.card.title }}" src="{{ toot.card.image }}">
+                                    <img class="image is-max-256" alt="{{ toot.card.title }}" src="{{ toot.card.image }}">
                                 </a>
                             </figure>
                         </div>
                         {% endif %}
+                        {% if toot.card.description %}
                         <div class="card-content">
                             <p>{{ toot.card.description }}</p>
                         </div>
+                        {% endif %}
                     </div>
                 {% endif %}