start with nuxt

components/Nav.vue

@@ -0,0 +1,50 @@
+<template lang="pug">
+  b-navbar(type="dark" variant="dark" toggleable='md')
+    b-navbar-toggle(target='nav_collapse')
+    b-navbar-brand(to='/') <img id='logo' src='gancio_logo.svg'/>
+    b-collapse#nav_collapse(is-nav)
+      b-navbar-nav
+        b-nav-item(v-if='!logged' to='/login'  v-b-tooltip :title='$t("Login")') <v-icon color='lightgreen' name='lock' /> 
+          span.d-md-none  {{$t('User')}}
+        b-nav-item(to='/new_event' v-b-tooltip :title='$t("Add Event")' ) <v-icon color='lightgreen' name='plus'/> 
+          span.d-md-none  {{$t('Add Event')}}
+        b-nav-item(v-if='logged' to='/settings' v-b-tooltip :title='$t("Settings")') <v-icon color='orange' name='cog'/>
+          span.d-md-none  {{$t('Settings')}}
+        b-nav-item(v-if='user.is_admin' to='/admin' v-b-tooltip :title='$t("Admin")') <v-icon color='lightblue' name='tools'/>
+          span.d-md-none  {{$t('Admin')}}
+        b-nav-item(to='/export' v-b-tooltip :title='$t("Export")') <v-icon name='file-export' color='yellow'/>
+          span.d-md-none  {{$t('Export')}}
+        b-nav-item(v-if='logged' @click='logout' v-b-tooltip :title='$t("Logout")') <v-icon color='red' name='sign-out-alt'/>
+          span.d-md-none  {{$t('Logout')}}
+    b-navbar-nav.ml-auto
+        b-nav-item(to='/about')
+          span  {{$t('Info')}} <v-icon color='#ff9fc4' name='question-circle'/>
+
+</template>
+<script>
+import {mapState, mapActions} from 'vuex'
+export default {
+  name: 'Nav',
+  computed: {
+    ...mapState(['logged', 'user','filters']),
+    filters_tags: {
+      set (value) {
+        this.setSearchTags(value)
+      },
+      get () {
+        return this.filters.tags
+      }
+    },
+    filters_places: {
+      set (value) {
+        this.setSearchPlaces(value)
+      },
+      get () {
+        return this.filters.places
+      }
+    },
+  },
+  methods: mapActions(['logout']),
+}
+</script>
+