Fix formatting of replies

brutaldon/static/css/brutaldon.css

@@ -10,9 +10,6 @@ img.fav-avatar {
 
 }
 
-.box.active_context {
-    background-color: #FFF8DC;
-}
 
 div.card-header-title, div.card-header-icon {
     color: black;
@@ -37,6 +34,10 @@ figure.media-left p.image a img
     border-radius: 5px;
 }
 
+.active-context {
+    background-color: #FFF8DC;
+}
+
 @media screen and (max-width: 768px) {
     .media {
         display: block;

brutaldon/templates/main/thread.html

@@ -2,7 +2,7 @@
 {% load humanize %}
 
 {% block title %}
-Brutaldon - thread 
+Brutaldon - thread
 {% endblock %}
 
 {% comment %}
@@ -12,26 +12,20 @@ mastodon.status_context(<numerical id>)
     'ancestors': # A list of toot dicts
     'descendants': # A list of toot dicts
     }
-{% endcomment %}
+    {% endcomment %}
 
-{% block content %}
+    {% block content %}
     <h1 class="title">Thread</h1>
     {% for ancestor in context.ancestors %}
-        <div class="box">
-            {% include "main/toot_partial.html" with toot=ancestor %}
-        </div>
-        <hr class="is-hidden">
+    {% include "main/toot_partial.html" with toot=ancestor %}
+    <hr class="is-hidden">
     {% endfor %}
-    <div class="box active_context">
-        {% include "main/toot_partial.html" with toot=toot %}
-    </div>
+        {% include "main/toot_partial.html" with toot=toot active=True %}
     <hr class="is-hidden">
     {% for descendant in context.descendants %}
-        <div class="box">
-            {% include "main/toot_partial.html" with toot=descendant %}
-        </div>
-        <hr class="is-hidden">
+    {% include "main/toot_partial.html" with toot=descendant %}
+    <hr class="is-hidden">
     {% endfor %}
 
 
-{% endblock %}
+    {% endblock %}

brutaldon/templates/main/toot_partial.html

@@ -3,7 +3,12 @@
 {% load taglinks %}
 {% load static %}
 
-<article class="media">
+{% if active %}
+    <article class="media active-context">
+{% else %}
+    <article class="media">
+{% endif %}
+
     <figure class="media-left">
         <p class="image is-64x64">
             <a href="{% url "user" toot.account.acct %}">