UserActions component and Snapshot stub

Author: ratron

vue/src/App.vue

@@ -2,15 +2,11 @@
 <i18n>
 {
   "de": {
-    "loginText": "Login",
-    "signupText": "Unverbindliche Anfrage",
     "mainnav.about": "Hintergrund",
     "mainnav.imprint": "Impressum",
     "mainnav.contact": "Kontakt"
 },
   "fr": {
-    "loginText": "Login",
-    "signupText": "Demande sans engagement",
     "mainnav.about": "Contexte",
     "mainnav.imprint": "Impressum",
     "mainnav.contact": "Contact"
@@ -35,14 +31,7 @@
       <v-spacer></v-spacer>
       <div class="d-none d-md-block"><language-switch/></div>
       <div class="useractions d-none d-sm-block">
-        <v-btn small text color="primary">
-          <router-link :to="'/' + $i18n.locale + '/login'">{{ $t('loginText') }}</router-link>
-        </v-btn>
-        <v-btn small outlined color="primary">
-          <router-link key="signup" :to="'/' + $i18n.locale + '/signup'">
-            {{ $t('signupText') }}
-          </router-link>
-        </v-btn>
+        <user-actions />
       </div>
       <v-app-bar-nav-icon @click="mobnav=!mobnav" class="d-md-none"></v-app-bar-nav-icon>
     </v-app-bar>
@@ -67,14 +56,7 @@
       </v-list>
       <v-flex class="useractions d-sm-none center">
         <v-divider></v-divider>
-        <v-btn small text color="white" class="mt-4">
-          <router-link :to="'/' + $i18n.locale + '/login'">{{ $t('loginText') }}</router-link>
-        </v-btn><br>
-        <v-btn small outlined color="white" class="mt-4">
-          <router-link key="signup" :to="'/' + $i18n.locale + '/signup'">
-            {{ $t('signupText') }}
-          </router-link>
-        </v-btn>
+        <user-actions vertical="1" />
       </v-flex>
     </v-navigation-drawer>
 

vue/src/components/LanguageSwitch.vue

@@ -13,7 +13,7 @@
 <div v-else>
   <v-speed-dial
     id="langnav"
-    open-on-hover="true"
+    open-on-hover
     direction="left"
     transition="slide-x-reverse-transition">
     <template v-slot:activator>

vue/src/main.js

@@ -8,6 +8,7 @@ import router from './router';
 import store from './store';
 import i18n from './trans';
 import LanguageSwitch from './components/LanguageSwitch.vue';
+import UserActions from './components/UserActions.vue';
 import App from './App.vue';
 
 require('@/assets/styles/main.css');
@@ -31,6 +32,7 @@ const apolloProvider = new VueApollo({
 });
 
 Vue.component('language-switch', LanguageSwitch);
+Vue.component('user-actions', UserActions);
 
 new Vue({
   router,

vue/src/views/Snapshot.vue

@@ -10,12 +10,28 @@
 <!-- eslint-enable -->
 
 <template>
-  <v-container my-12>
-  <v-layout >
-    <v-flex>
-      <h1>Snapshot</h1>
-    </v-flex>
-  </v-layout>
+  <v-container>
+    <v-navigation-drawer
+      :width="320"
+      left app >
+      <router-link id="logo" :to="'/' + $i18n.locale + '/'" class="px-4 py-1 d-block">
+        <img alt="gemeindescan logo" height="50" src="@/assets/images/gemeindescan-logo.svg">
+      </router-link>
+
+      <v-toolbar
+      :width="320"
+      absolute
+      bottom
+        class="useractions center">
+        <user-actions />
+      </v-toolbar>
+    </v-navigation-drawer>
+
+    <v-layout >
+      <v-flex>
+        <h1>Map</h1>
+      </v-flex>
+    </v-layout>
   </v-container>
 </template>