Merge pull request #496 from mouse-reeve/status-markup

Status markup

bookwyrm/static/css/format.css

@@ -5,6 +5,11 @@
 .navbar .logo {
     max-height: 50px;
 }
+
+.card {
+    overflow: visible;
+}
+
 /* --- TOGGLES --- */
 input.toggle-control {
     display: none;

bookwyrm/templates/snippets/status_body.html

@@ -2,9 +2,9 @@
 {% load humanize %}
 
 {% if not status.deleted %}
-<div class="card">
+<article class="card">
     <header class="card-header">
-        <div class="card-header-title">
+        <div class="card-header-title has-background-white-ter">
             <div class="columns">
                 <div class="column is-narrow">
                     {% include 'snippets/status_header.html' with status=status %}
@@ -13,12 +13,12 @@
         </div>
     </header>
 
-    <div class="card-content">
+    <section class="card-content">
         {% include 'snippets/status_content.html' with status=status %}
-    </div>
+    </section>
 
     <footer>
-        <div class="card-footer">
+        <div class="card-footer has-background-white-bis">
             <div class="card-footer-item">
                 {% if request.user.is_authenticated %}
                 <label class="button is-small" for="show-comment-{{ status.id }}">
@@ -57,7 +57,7 @@
             </div>
             {% if status.user == request.user %}
             <div class="card-footer-item">
-                <label class="button" for="more-info-{{ status.id }}">
+                <label class="button is-small" for="more-info-{{ status.id }}">
                     <div class="icon icon-dots-three">
                         <span class="is-sr-only">More options</span>
                     </div>
@@ -95,9 +95,9 @@
         </div>
         {% endif %}
     </footer>
-</div>
+</article>
 {% else %}
-<div class="card">
+<article class="card">
     <header class="card-header">
         <p>
         {% include 'snippets/avatar.html' with user=status.user %}
@@ -105,5 +105,5 @@
         deleted this status
         </p>
     </header>
-</div>
+</article>
 {% endif %}

bookwyrm/templates/snippets/status_content.html

@@ -56,7 +56,7 @@
 
 {% if not hide_book %}
 {% if status.book or status.mention_books.count %}
-<div class="{% if status.status_type != 'GeneratedNote' %}box{% endif %}">
+<div class="{% if status.status_type != 'GeneratedNote' %}box has-background-white-bis{% endif %}">
     {% if status.book %}
     {% include 'snippets/book_preview.html' with book=status.book %}
     {% elif status.mention_books.count %}