From 6cc1e241fe488b721b91cf7af6abeed807820007 Mon Sep 17 00:00:00 2001
From: Mouse Reeve <mousereeve@riseup.net>
Date: Tue, 24 Nov 2020 12:07:00 -0800
Subject: [PATCH] display images at a reasonable size

---
 bookwyrm/static/css/format.css                  |  3 +++
 bookwyrm/templates/snippets/status_content.html | 16 ++++++++++++----
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/bookwyrm/static/css/format.css b/bookwyrm/static/css/format.css
index db3c20ef3..9e8a24ba9 100644
--- a/bookwyrm/static/css/format.css
+++ b/bookwyrm/static/css/format.css
@@ -1,4 +1,7 @@
 /* --- --- */
+.image {
+    overflow: hidden;
+}
 .navbar .logo {
     max-height: 50px;
 }
diff --git a/bookwyrm/templates/snippets/status_content.html b/bookwyrm/templates/snippets/status_content.html
index 834549ea2..e71588ad1 100644
--- a/bookwyrm/templates/snippets/status_content.html
+++ b/bookwyrm/templates/snippets/status_content.html
@@ -19,10 +19,18 @@
     {% include 'snippets/trimmed_text.html' with full=status.content|safe %}
     {% endif %}
     {% if status.attachments %}
-    <div>
-        {% for attachment in status.attachments.all %}
-        <img src="/images/{{ attachment.image }}" alt="{{ attachment.caption }}">
-        {% endfor %}
+    <div class="block">
+        <div class="columns">
+            {% for attachment in status.attachments.all %}
+            <div class="column is-narrow">
+                <figure class="image is-128x128">
+                    <a href="/images/{{ attachment.image }}" target="_blank" aria-label="open image in new window">
+                        <img src="/images/{{ attachment.image }}" alt="{{ attachment.caption }}">
+                    </a>
+                </figure>
+            </div>
+            {% endfor %}
+        </div>
     </div>
     {% endif %}
 </div>