From f985ca0576228c5df3bd72263be7ac29167dc0c4 Mon Sep 17 00:00:00 2001
From: Joel Bradshaw <cincodenada@gmail.com>
Date: Wed, 13 Jan 2021 19:14:01 -0800
Subject: [PATCH] Make login form wrap nicely on mobile

Changing to columns from a grouped form item isn't my favorite, but I
think it's okay, and it gets us better mobile behavior for free
---
 bookwyrm/templates/layout.html | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/bookwyrm/templates/layout.html b/bookwyrm/templates/layout.html
index fe448585d..f2db8521d 100644
--- a/bookwyrm/templates/layout.html
+++ b/bookwyrm/templates/layout.html
@@ -127,17 +127,19 @@
                     <div class="column">
                         <form name="login" method="post" action="/user-login">
                             {% csrf_token %}
-                            <div class="field is-grouped">
-                                <div class="control">
+                            <div class="columns is-variable is-1">
+                                <div class="column">
                                     <label class="is-sr-only" for="id_localname">Username:</label>
                                     <input type="text" name="localname" maxlength="150" class="input" required="" id="id_localname" placeholder="username">
                                 </div>
-                                <div class="control">
+                                <div class="column">
                                     <label class="is-sr-only" for="id_password">Username:</label>
                                     <input type="password" name="password" maxlength="128" class="input" required="" id="id_password" placeholder="password">
                                     <p class="help"><a href="/password-reset">Forgot your password?</a></p>
                                 </div>
-                                <button class="button is-primary" type="submit">Log in</button>
+                                <div class="column is-narrow">
+                                    <button class="button is-primary" type="submit">Log in</button>
+                                </div>
                             </div>
                         </form>
                     </div>