feat: content rendering improvements + save fix

client/themes/default/components/nav-footer.vue

@@ -0,0 +1,72 @@
+<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>