add simple layout and eslint

frontend/assets/sass/app.scss

@@ -1,9 +0,0 @@
-@import 'variables';
-@import '~bootstrap/scss/bootstrap';
-@import '~sweetalert2/src/sweetalert2';
-@import '@fortawesome/fontawesome/styles.css';
-
-@import 'elements/card';
-@import 'elements/navbar';
-@import 'elements/buttons';
-@import 'elements/transitions';

frontend/components/FeedbackMessage.vue

@@ -1,38 +1,43 @@
 <template>
-    <v-layout row justify-center>
-        <v-dialog v-if="responseMessage.modal" :value.sync="responseMessage.show" persistent>
-            <v-card>
-                <v-card-title class="headline white--text" :class="responseMessage.type">{{ responseMessage.title }}
-                </v-card-title>
-                <v-divider></v-divider>
-                <v-card-text>{{ responseMessage.text }}</v-card-text>
-                <v-layout row justify-center>
-                    <v-btn :color="responseMessage.type" flat="flat" @click.native="close">{{ $t('ok') }}</v-btn>
-                </v-layout>
-            </v-card>
-        </v-dialog>
-        <v-snackbar v-else top v-model="responseMessage.show" :color="responseMessage.type">
-            {{ responseMessage.text }}
-            <v-btn dark flat @click.native="close">{{ $t('close') }}</v-btn>
-        </v-snackbar>
-    </v-layout>
+  <v-layout row justify-center>
+    <v-dialog v-if="responseMessage.modal" :value.sync="responseMessage.show" persistent>
+      <v-card>
+        <v-card-title class="headline white--text" :class="responseMessage.type">
+          {{ responseMessage.title }}
+        </v-card-title>
+        <v-divider />
+        <v-card-text>{{ responseMessage.text }}</v-card-text>
+        <v-layout row justify-center>
+          <v-btn :color="responseMessage.type" flat="flat" @click.native="close">
+            {{ $t('ok') }}
+          </v-btn>
+        </v-layout>
+      </v-card>
+    </v-dialog>
+    <v-snackbar v-else v-model="responseMessage.show" top :color="responseMessage.type">
+      {{ responseMessage.text }}
+      <v-btn dark flat @click.native="close">
+        {{ $t('close') }}
+      </v-btn>
+    </v-snackbar>
+  </v-layout>
 </template>
 
 <script>
-    import {mapGetters} from 'vuex'
+import { mapGetters } from 'vuex'
 
-    export default {
-        name: 'feedback-message',
-        computed: mapGetters({
-                responseMessage: 'message/responseMessage'
-            }
-        ),
-        methods: {
-            close() {
-                this.$store.dispatch('message/clearMessage')
-            }
-        }
+export default {
+  name: 'FeedbackMessage',
+  computed: mapGetters({
+    responseMessage: 'message/responseMessage'
+  }
+  ),
+  methods: {
+    close() {
+      this.$store.dispatch('message/clearMessage')
     }
+  }
+}
 </script>
 
 <style lang="stylus" scoped>

frontend/components/LocaleDropdown.vue

@@ -0,0 +1,35 @@
+<template>
+  <v-menu offset-y>
+    <v-btn slot="activator" flat>
+      {{ locales[locale] }}
+    </v-btn>
+
+    <v-list>
+      <v-list-tile v-for="(value, key) in locales" :key="key" @click.prevent="setLocale(key)">
+        {{ value }}
+      </v-list-tile>
+    </v-list>
+  </v-menu>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { loadMessages } from '~/plugins/i18n'
+
+export default {
+  computed: mapGetters({
+    locale: 'lang/locale',
+    locales: 'lang/locales'
+  }),
+
+  methods: {
+    setLocale(locale) {
+      if (this.$i18n.locale !== locale) {
+        loadMessages(locale)
+
+        this.$store.dispatch('lang/setLocale', { locale })
+      }
+    }
+  }
+}
+</script>

frontend/components/NavMenu.vue

@@ -9,19 +9,19 @@
         </v-list-tile>
       </v-list>
     </v-toolbar>
-    <v-divider></v-divider>
+    <v-divider />
     <v-list>
       <v-list-tile
-        value="true"
         v-for="(item, i) in items"
         :key="i"
+        value="true"
         :to="item.route"
       >
         <v-list-tile-action>
-          <v-icon light v-html="item.icon"></v-icon>
+          <v-icon>{{ item.icon }}</v-icon>
         </v-list-tile-action>
         <v-list-tile-content>
-          <v-list-tile-title v-text="item.title"></v-list-tile-title>
+          <v-list-tile-title v-text="item.title" />
         </v-list-tile-content>
       </v-list-tile>
     </v-list>
@@ -30,12 +30,13 @@
 
 <script>
 export default {
-  data () {
+  data() {
     return {
       name: this.$t('nav_menu_title'),
       items: [
         { title: 'Dashboard', icon: 'dashboard', route: { name: 'home' } },
-        { title: 'Account', icon: 'account_box', route: { name: 'settings.profile' } }
+        { title: 'Account', icon: 'account_box', route: { name: 'settings.profile' } },
+        { title: 'Welcome', icon: 'menu', route: { name: 'index' } }
       ]
     }
   }

frontend/components/PageFooter.vue

@@ -6,7 +6,7 @@
 
 <script>
 export default {
-  data () {
+  data() {
     return {
       fixed: false
     }

frontend/components/ProgressBar.vue

@@ -1,16 +1,15 @@
 <template>
-  <v-progress-linear 
-    :indeterminate="true" 
-    :color="color"
-    height="4" 
+  <v-progress-linear
     v-if="show"
-  >
-  </v-progress-linear>
+    :indeterminate="true"
+    :color="color"
+    height="4"
+  />
 </template>
 
 <script>
 export default {
-  name: 'progress-bar',
+  name: 'ProgressBar',
   props: {
     show: {
       type: [Boolean, String],