From e0e7693fff08cc58c610a0a4a3d46a851fbc480b Mon Sep 17 00:00:00 2001
From: Stefan Zermatten <stefanzermatten@gmail.com>
Date: Fri, 13 Mar 2020 14:56:59 +0200
Subject: [PATCH] Improved app layout a bit

---
 app/imports/ui/layouts/AppLayout.vue     |  2 +-
 app/imports/ui/layouts/Sidebar.vue       | 30 ++++++++++++++----------
 app/imports/ui/layouts/ToolbarLayout.vue |  2 +-
 3 files changed, 19 insertions(+), 15 deletions(-)

diff --git a/app/imports/ui/layouts/AppLayout.vue b/app/imports/ui/layouts/AppLayout.vue
index 6b4acd27..4ddaee2b 100644
--- a/app/imports/ui/layouts/AppLayout.vue
+++ b/app/imports/ui/layouts/AppLayout.vue
@@ -1,6 +1,6 @@
 <template>
   <v-app :dark="darkMode" :light="!darkMode">
-    <v-navigation-drawer app v-model="drawer">
+    <v-navigation-drawer app v-model="drawer" clipped>
       <Sidebar/>
     </v-navigation-drawer>
 		<router-view></router-view>
diff --git a/app/imports/ui/layouts/Sidebar.vue b/app/imports/ui/layouts/Sidebar.vue
index 9aebc512..95fb9eef 100644
--- a/app/imports/ui/layouts/Sidebar.vue
+++ b/app/imports/ui/layouts/Sidebar.vue
@@ -1,18 +1,5 @@
 <template>
   <div class="sidebar">
-		<v-toolbar color="secondary" dark>
-			<v-layout row align-center v-if="signedIn">
-				{{userName}}
-				<v-spacer></v-spacer>
-				<v-tooltip bottom>
-					<v-btn flat icon slot="activator" to="/account"><v-icon>settings</v-icon></v-btn>
-					<span>Account Settings</span>
-				</v-tooltip>
-			</v-layout>
-			<v-layout row justify-center v-else="signedIn">
-				<v-btn flat to="/sign-in">Sign in</v-btn>
-			</v-layout>
-		</v-toolbar>
 		<v-alert
 			:value="showWarning"
 			type="warning"
@@ -25,7 +12,24 @@
 				<v-btn @click="showWarning = false">I won't</v-btn>
 			</div>
 		</v-alert>
+		<v-layout row justify-center v-if="!signedIn">
+			<v-btn flat to="/sign-in">Sign in</v-btn>
+		</v-layout>
     <v-list>
+			<v-list-tile v-if="signedIn">
+				<v-list-tile-content>
+					<v-list-tile-title>
+						{{userName}}
+					</v-list-tile-title>
+        </v-list-tile-content>
+				<v-list-tile-action>
+					<v-tooltip bottom>
+						<v-btn flat icon slot="activator" to="/account"><v-icon>settings</v-icon></v-btn>
+						<span>Account Settings</span>
+					</v-tooltip>
+        </v-list-tile-action>
+			</v-list-tile>
+
       <v-list-tile
         v-for="(link, i) in links"
 				v-if="link.vif || link.vif === undefined"
diff --git a/app/imports/ui/layouts/ToolbarLayout.vue b/app/imports/ui/layouts/ToolbarLayout.vue
index 550d3fd6..e8051b85 100644
--- a/app/imports/ui/layouts/ToolbarLayout.vue
+++ b/app/imports/ui/layouts/ToolbarLayout.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <v-toolbar app color="secondary" dark>
+    <v-toolbar app color="secondary" dark clipped-left>
       <v-btn flat icon @click="toggleDrawer">
         <v-icon>menu</v-icon>
       </v-btn>