Merge pull request #637 from mouse-reeve/mobile-header-buttons

Fixes header wrap on mobile headers

bookwyrm/templates/author.html

@@ -2,7 +2,7 @@
 {% load bookwyrm_tags %}
 {% block content %}
 <div class="block">
-    <div class="columns">
+    <div class="columns is-mobile">
         <div class="column">
             <h1 class="title">{{ author.name }}</h1>
         </div>

bookwyrm/templates/book.html

@@ -4,7 +4,7 @@
 {% block content %}
 
 <div class="block">
-    <div class="columns">
+    <div class="columns is-mobile">
         <div class="column">
             <h1 class="title">
                 {{ book.title }}{% if book.subtitle %}:

bookwyrm/templates/lists/list_layout.html

@@ -2,7 +2,7 @@
 {% load bookwyrm_tags %}
 {% block content %}
 
-<header class="columns content">
+<header class="columns content is-mobile">
     <div class="column">
         <h1 class="title">{{ list.name }} <span class="subtitle">{% include 'snippets/privacy-icons.html' with item=list %}</span></h1>
         <p class="subtitle help">Created {% if list.curation != 'open' %} and curated{% endif %} by {% include 'snippets/username.html' with user=list.user %}</p>

bookwyrm/templates/lists/lists.html

@@ -5,7 +5,7 @@
     <h1 class="title">Lists</h1>
 </header>
 {% if request.user.is_authenticated and not lists.has_previous %}
-<header class="block columns">
+<header class="block columns is-mobile">
     <div class="column">
         <h2 class="title">Your lists</h2>
     </div>

bookwyrm/templates/snippets/shelf.html

@@ -1,6 +1,7 @@
 {% load humanize %}
 {% load bookwyrm_tags %}
 {% if books|length > 0 %}
+<div class="table-container">
 <table class="table is-striped is-fullwidth">
 
 <tr class="book-preview">
@@ -74,6 +75,7 @@
 </tr>
 {% endfor %}
 </table>
+</div>
 {% else %}
 <p>This shelf is empty.</p>
 {% if shelf.editable %}

bookwyrm/templates/user/followers.html

@@ -15,17 +15,13 @@
 <div class="block">
     <h2 class="title">Followers</h2>
     {% for followers in followers %}
-    <div class="block">
-        <div class="field is-grouped">
-            <div class="control">
-                {% include 'snippets/avatar.html' with user=followers %}
-            </div>
-            <div class="control">
-                {% include 'snippets/username.html' with user=followers show_full=True  %}
-            </div>
-            <div class="control">
-                {% include 'snippets/follow_button.html' with user=followers %}
-            </div>
+    <div class="block columns">
+        <div class="column">
+            {% include 'snippets/avatar.html' with user=followers %}
+            {% include 'snippets/username.html' with user=followers show_full=True  %}
+        </div>
+        <div class="column is-narrow">
+            {% include 'snippets/follow_button.html' with user=followers %}
         </div>
     </div>
     {% endfor %}

bookwyrm/templates/user/following.html

@@ -15,17 +15,13 @@
 <div class="block">
     <h2 class="title">Following</h2>
     {% for follower in user.following.all %}
-    <div class="block">
-        <div class="field is-grouped">
-            <div class="control">
-                {% include 'snippets/avatar.html' with user=follower %}
-            </div>
-            <div class="control">
-                {% include 'snippets/username.html' with user=follower show_full=True  %}
-            </div>
-            <div class="control">
-                {% include 'snippets/follow_button.html' with user=follower %}
-            </div>
+    <div class="block columns">
+        <div class="column">
+            {% include 'snippets/avatar.html' with user=follower %}
+            {% include 'snippets/username.html' with user=follower show_full=True  %}
+        </div>
+        <div class="column">
+            {% include 'snippets/follow_button.html' with user=follower %}
         </div>
     </div>
     {% endfor %}

bookwyrm/templates/user/lists.html

@@ -1,7 +1,7 @@
 {% extends 'user/user_layout.html' %}
 
 {% block header %}
-<div class="columns">
+<div class="columns is-mobile">
     <div class="column">
         <h1 class="title">
             {% if is_self %}Your

bookwyrm/templates/user/shelf.html

@@ -38,7 +38,7 @@
     {% include 'user/create_shelf_form.html' with controls_text='create-shelf-form' %}
 </div>
 
-<div class="block columns">
+<div class="block columns is-mobile">
     <div class="column">
         <h2 class="title is-3">
             {{ shelf.name }}

bookwyrm/templates/user/user.html

@@ -1,7 +1,7 @@
 {% extends 'user/user_layout.html' %}
 
 {% block header %}
-<div class="columns">
+<div class="columns is-mobile">
     <div class="column">
         <h1 class="title">User profile</h1>
     </div>
@@ -54,7 +54,7 @@
 {% endif %}
 
 <div>
-    <div class="columns">
+    <div class="columns is-mobile">
         <h2 class="title column">User Activity</h2>
         <div class="column is-narrow">
             <a class="icon icon-rss" target="_blank" href="{{ user.local_path }}/rss">