From 44add2852de7801a2635e2040061a4dda9e7b59d Mon Sep 17 00:00:00 2001
From: Alice Gaudon <alice@gaudon.pro>
Date: Tue, 26 Jan 2021 12:59:50 +0100
Subject: [PATCH] Reorganize menu with a dropdown and shrink layout back to
 632px

---
 assets/sass/_vars.scss |  4 ++--
 views/layouts/base.njk | 20 ++++++++++++--------
 2 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/assets/sass/_vars.scss b/assets/sass/_vars.scss
index a088318..4c4b3ff 100644
--- a/assets/sass/_vars.scss
+++ b/assets/sass/_vars.scss
@@ -29,5 +29,5 @@ $errorText: darken($error, 30%);
 $errorColor: desaturate($errorText, 50%);
 
 // Responsivity
-$mobileThreshold: 720px;
-$desktopThreshold: 940px;
+$mobileThreshold: 632px;
+$desktopThreshold: 632px;
diff --git a/views/layouts/base.njk b/views/layouts/base.njk
index 0dbaa49..328cd51 100644
--- a/views/layouts/base.njk
+++ b/views/layouts/base.njk
@@ -22,14 +22,18 @@
                     <li><a href="{{ route('backend') }}"><i data-feather="settings"></i> <span class="tip">Backend</span></a></li>
                 {% endif %}
 
-                <li><a href="{{ route('account') }}"><i data-feather="user"></i>
-                        <span class="tip">{{ user.name }}</span></a></li>
-                <li><a href="{{ route('account-mailbox') }}"><i data-feather="mail"></i> <span class="tip">Mailbox settings</span></a></li>
-                <li>
-                    <form action="{{ route('logout') }}" method="POST">
-                        <button><i data-feather="log-out"></i> <span class="tip">Logout</span></button>
-                        {{ macros.csrf(getCsrfToken) }}
-                    </form>
+                <li><a href="{{ route('account') }}"><i data-feather="user"></i><span class="tip">{{ user.name }}</span></a>
+
+                    <ul class="dropdown">
+                        <li><a href="{{ route('account-mailbox') }}"><i data-feather="settings"></i> <span class="tip">Mailbox settings</span></a></li>
+                        <li>
+                            <hr>
+                            <form action="{{ route('logout') }}" method="POST">
+                                <button><i data-feather="log-out"></i> <span class="tip">Logout</span></button>
+                                {{ macros.csrf(getCsrfToken) }}
+                            </form>
+                        </li>
+                    </ul>
                 </li>
             {% else %}
                 <li><a href="{{ route('auth') }}"><i data-feather="log-in"></i> <span class="tip">Login / Register</span></a></li>