feat: content rendering improvements + save fix

client/components/common/nav-footer.vue

@@ -1,72 +0,0 @@
-<template lang="pug">
-  v-footer.justify-center(:color='bgColor', inset)
-    .caption.grey--text.text--darken-1
-      span(v-if='company && company.length > 0') {{ $t('common:footer.copyright', { company: company, year: currentYear, interpolation: { escapeValue: false } }) }} |&nbsp;
-      span {{ $t('common:footer.poweredBy') }} #[a(href='https://wiki.js.org', ref='nofollow') Wiki.js]
-
-    v-snackbar(
-      :color='notification.style'
-      bottom
-      right
-      multi-line
-      v-model='notificationState'
-    )
-      .text-xs-left
-        v-icon.mr-3(dark) {{ notification.icon }}
-        span {{ notification.message }}
-</template>
-
-<script>
-import { get, sync } from 'vuex-pathify'
-
-export default {
-  props: {
-    color: {
-      type: String,
-      default: 'grey lighten-3'
-    },
-    darkColor: {
-      type: String,
-      default: 'grey darken-3'
-    }
-  },
-  data() {
-    return {
-      currentYear: (new Date()).getFullYear()
-    }
-  },
-  computed: {
-    company: get('site/company'),
-    notification: get('notification'),
-    darkMode: get('site/dark'),
-    notificationState: sync('notification@isActive'),
-    bgColor() {
-      if (!this.darkMode) {
-        return this.color
-      } else {
-        return this.darkColor
-      }
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-  .v-footer {
-    a {
-      text-decoration: none;
-    }
-
-    &.altbg {
-      background: mc('theme', 'primary');
-
-      span {
-        color: mc('blue', '300');
-      }
-
-      a {
-        color: mc('blue', '200');
-      }
-    }
-  }
-</style>

client/components/common/nav-header.vue

@@ -17,7 +17,7 @@
         @keyup.enter='searchEnter'
       )
     v-menu(open-on-hover, offset-y, bottom, left, min-width='250')
-      v-toolbar-side-icon(slot='activator')
+      v-toolbar-side-icon.btn-animate-app(slot='activator')
         v-icon view_module
       v-list(dense, :light='!$vuetify.dark').py-0
         v-list-tile(avatar, href='/')
@@ -84,12 +84,12 @@
       )
       v-icon(color='grey') search
     v-tooltip(bottom)
-      v-btn(icon, href='/a', slot='activator')
+      v-btn.btn-animate-rotate(icon, href='/a', slot='activator')
         v-icon(color='grey') settings
       span Admin
     v-menu(offset-y, min-width='300')
       v-tooltip(bottom, slot='activator')
-        v-btn(icon, slot='activator')
+        v-btn.btn-animate-grow(icon, slot='activator', outline, color='grey darken-3')
           v-icon(color='grey') account_circle
         span Account
       v-list.py-0(:light='!$vuetify.dark')
@@ -212,4 +212,5 @@ export default {
 .navHeaderLoading { // To avoid search bar jumping
   width: 22px;
 }
+
 </style>

client/components/common/nav-sidebar.vue

@@ -1,35 +0,0 @@
-<template lang="pug">
-  v-list(dense, :class='color', :dark='dark')
-    v-list-tile.pt-2(href='/')
-      v-list-tile-avatar: v-icon home
-      v-list-tile-title Home
-    v-divider.my-2
-    v-subheader.pl-4 Navigation
-    v-list-tile
-      v-list-tile-avatar: v-icon stars
-      v-list-tile-title The Universe
-    v-list-tile
-      v-list-tile-avatar: v-icon directions_boat
-      v-list-tile-title Ships
-    v-list-tile
-      v-list-tile-avatar: v-icon local_airport
-      v-list-tile-title Airports
-</template>
-
-<script>
-export default {
-  props: {
-    color: {
-      type: String,
-      default: 'primary'
-    },
-    dark: {
-      type: Boolean,
-      default: true
-    }
-  },
-  data() {
-    return {}
-  }
-}
-</script>