From 5877344c166e4ec38bc648cb37bb598e9a390910 Mon Sep 17 00:00:00 2001
From: Jason McBrayer <jmcbray@carcosa.net>
Date: Thu, 28 Feb 2019 12:15:04 -0500
Subject: [PATCH] Fix (again) overflowing attachment boxes

This time, it makes them multiline.
---
 brutaldon/static/css/brutaldon-dark.css    | 7 +++++++
 brutaldon/static/css/brutaldon.css         | 7 ++++---
 brutaldon/templates/main/toot_partial.html | 8 ++++----
 3 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/brutaldon/static/css/brutaldon-dark.css b/brutaldon/static/css/brutaldon-dark.css
index 1fb56f8..dc721b7 100644
--- a/brutaldon/static/css/brutaldon-dark.css
+++ b/brutaldon/static/css/brutaldon-dark.css
@@ -105,6 +105,13 @@ emoji-link
     font-size: 2em;
 }
 
+.content figure.attachment-image
+{
+    text-align:left;
+    margin-left: 0;
+    margin-right: 0;
+}
+
 
 @media screen and (max-width: 768px) {
     .media {
diff --git a/brutaldon/static/css/brutaldon.css b/brutaldon/static/css/brutaldon.css
index eb0de19..f4ac002 100644
--- a/brutaldon/static/css/brutaldon.css
+++ b/brutaldon/static/css/brutaldon.css
@@ -102,12 +102,13 @@ emoji-link
     font-size: 2em;
 }
 
-.level.attachments
+.content figure.attachment-image
 {
-    overflow-x: auto;
+    text-align:left;
+    margin-left: 0;
+    margin-right: 0;
 }
 
-
 @media screen and (max-width: 768px) {
     .media {
         display: block;
diff --git a/brutaldon/templates/main/toot_partial.html b/brutaldon/templates/main/toot_partial.html
index 87899fa..173a4f5 100644
--- a/brutaldon/templates/main/toot_partial.html
+++ b/brutaldon/templates/main/toot_partial.html
@@ -81,10 +81,10 @@
 
                 {% if toot.media_attachments %}
                 <br>
-                <div class="level attachments">
+                <div class="columns is-multiline attachments is-gapless">
                     {% for media in toot.media_attachments %}
                     {% if media.type == "image" %}
-                        <figure class="level-item attachment-image">
+                        <figure class="column attachment-image">
                             <a href="{{ media.url }}">
                                 {% if toot.sensitive %}
                                     <img src="{% static "images/sensitive.png" %}"
@@ -105,8 +105,8 @@
                             </a>
                         </figure>
                     {% else %}
-                        <figure class="level-item is-max-256">
-                            <video controls loop
+                        <figure class="column">
+                            <video controls loop class="is-max-256"
                                    poster="{{ media.preview_url }}">
                                 <source src="{{ media.url }}" type="video/mp4">
                                 <a href="{{ media.url }}">