From 8034ed486ce3470a62f30f6d5f2be1509068f953 Mon Sep 17 00:00:00 2001
From: Henrik Hautakoski <henrik.hautakoski@gmail.com>
Date: Fri, 30 Mar 2018 01:06:12 +0200
Subject: [PATCH] app/views/_templates/navigation.volt: update to have user
 menu with dropdown.

---
 app/views/_templates/navigation.volt | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/app/views/_templates/navigation.volt b/app/views/_templates/navigation.volt
index 75940c1..2439195 100644
--- a/app/views/_templates/navigation.volt
+++ b/app/views/_templates/navigation.volt
@@ -5,14 +5,23 @@
         <i class="icon ion-navicon-round"></i>
     </button>
 
-    <ul class="navigation-user-menu">
+    <div class="navigation-user-menu">
     {% if auth.hasIdentity() %}
-        <li>{{ icon('android-person') }} Signed in as <strong>{{ auth.getUser().username }}</strong></li>
-        <li>{{ link_to(['for': 'logout'], '<i class="icon ion-log-out"></i> Log out') }}</li>
+        <div class="navigation-user-menu-dropdown">
+            <a id="user-dropdown-button" class="navigation-user-menu-dropdown-button"
+               data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
+
+                {{ icon('android-person') }} <strong>{{ auth.getUser().username }}</strong>
+            </a>
+
+            <ul aria-labelledby="user-dropdown" class="navigation-user-menu-dropdown-list">
+                <li>{{ link_to(['for': 'logout'], '<i class="icon ion-log-out"></i> Log out') }}</li>
+            </ul>
+        </div>
     {% else %}
-        <li>{{ link_to(['for': 'login'], '<i class="icon ion-log-in"></i> Login', 'class': 'login-button') }}</li>
+        <div class="navigation-user-menu-login">{{ link_to(['for': 'login'], '<i class="icon ion-log-in"></i> Login', 'class': 'login-button') }}</div>
     {% endif %}
-    </ul>
+    </div>
 
     <nav class="navigation-menu collapse" id="main-menu">
         {{ menu.render(0) }}