feat: themes foundation + editors load improvements

client/components/common/nav-footer.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  v-footer.py-2.justify-center(app, absolute, :color='darkMode ? "" : "grey lighten-3"', inset, height='auto')
+  v-footer.justify-center(:color='darkMode ? "" : "grey lighten-3"', inset)
     .caption.grey--text.text--darken-1
       span(v-if='company && company.length > 0') {{ $t('common:footer.copyright', { company: company, year: currentYear }) }} |&nbsp;
       span {{ $t('common:footer.poweredBy') }} Wiki.js

client/components/common/nav-header.vue

@@ -1,30 +1,30 @@
 <template lang='pug'>
-  v-toolbar(color='black', dark, app, clipped-left, fixed, flat, :dense='dense')
-    v-menu(open-on-hover, offset-y, bottom, left, nudge-top='-18', min-width='250')
+  v-toolbar(color='black', dark, app, clipped-left, fixed, flat)
+    v-menu(open-on-hover, offset-y, bottom, left, min-width='250')
       v-toolbar-side-icon(slot='activator')
         v-icon view_module
       v-list(dense).py-0
         v-list-tile(avatar, href='/')
           v-list-tile-avatar: v-icon(color='blue') home
           v-list-tile-content Home
-        v-list-tile(avatar, @click='')
+        v-list-tile(avatar, @click='pageNew')
           v-list-tile-avatar: v-icon(color='green') add_box
           v-list-tile-content New Page
         v-divider.my-0
         v-subheader Current Page
-        v-list-tile(avatar, @click='')
+        v-list-tile(avatar, @click='pageEdit')
           v-list-tile-avatar: v-icon(color='indigo') edit
           v-list-tile-content Edit
-        v-list-tile(avatar, @click='')
+        v-list-tile(avatar, @click='pageHistory')
           v-list-tile-avatar: v-icon(color='indigo') history
           v-list-tile-content History
-        v-list-tile(avatar, @click='')
+        v-list-tile(avatar, @click='pageSource')
           v-list-tile-avatar: v-icon(color='indigo') code
           v-list-tile-content View Source
-        v-list-tile(avatar, @click='')
+        v-list-tile(avatar, @click='pageMove')
           v-list-tile-avatar: v-icon(color='indigo') forward
           v-list-tile-content Move / Rename
-        v-list-tile(avatar, @click='')
+        v-list-tile(avatar, @click='pageDelete')
           v-list-tile-avatar: v-icon(color='red darken-2') delete
           v-list-tile-content Delete
         v-divider.my-0
@@ -61,11 +61,15 @@
     .navHeaderLoading.mr-3
       v-progress-circular(indeterminate, color='blue', :size='22', :width='2' v-show='isLoading')
     slot(name='actions')
-    v-btn(icon, href='/a')
-      v-icon(color='grey') settings
+    v-tooltip(bottom)
+      v-btn(icon, href='/a', slot='activator')
+        v-icon(color='grey') settings
+      span Admin
     v-menu(offset-y, min-width='300')
-      v-btn(icon, slot='activator')
-        v-icon(color='grey') account_circle
+      v-tooltip(bottom, slot='activator')
+        v-btn(icon, slot='activator')
+          v-icon(color='grey') account_circle
+        span Account
       v-list.py-0
         v-list-tile.py-3(avatar)
           v-list-tile-avatar
@@ -116,6 +120,24 @@ export default {
   methods: {
     searchEnter() {
       this.searchIsLoading = true
+    },
+    pageNew () {
+
+    },
+    pageEdit () {
+
+    },
+    pageHistory () {
+
+    },
+    pageSource () {
+
+    },
+    pageMove () {
+
+    },
+    pageDelete () {
+
     }
   }
 }

client/components/profile/preferences.vue

@@ -14,10 +14,18 @@
                       .subheading Display
                   v-card-text
                     v-subheader.pl-0 Locale
-                    v-select.grey.lighten-5(solo, flat)
-                    v-divider
+                    v-select(
+                      outline
+                      background-color='grey lighten-2'
+                      hide-details
+                      )
+                    v-divider.mt-3
                     v-subheader.pl-0 Timezone
-                    v-select.grey.lighten-5(solo, flat)
+                    v-select(
+                      outline
+                      background-color='grey lighten-2'
+                      hide-details
+                      )
                   v-card-chin
                     v-spacer
                     v-btn(color='primary')
@@ -30,7 +38,11 @@
                     .subheading Editing
                 v-card-text
                   v-subheader.pl-0 Default Editor
-                  v-select.grey.lighten-5(solo, flat)
+                  v-select(
+                    outline
+                    background-color='grey lighten-2'
+                    hide-details
+                    )
                 v-card-chin
                   v-spacer
                   v-btn(color='primary')

client/components/profile/profile.vue

@@ -36,12 +36,12 @@
               )
               v-icon(:color='darkMode ? "grey lighten-1" : "purple darken-4"') supervised_user_circle
               .subheading.ml-3 Local
-            v-divider
+            v-divider.mt-3
             v-subheader.pl-0 Two-Factor Authentication (2FA)
             .caption.mb-2 2FA adds an extra layer of security by requiring a unique code generated on your smartphone when signing in.
             v-btn(color='purple darken-4', dark, depressed).ml-0 Enable 2FA
             v-btn(color='purple darken-4', dark, depressed, disabled).ml-0 Disable 2FA
-            v-divider
+            v-divider.mt-3
             v-subheader.pl-0 Change Password
             v-text-field(label='Current Password', prepend-icon='last_page')
             v-text-field(label='New Password', prepend-icon='last_page')
@@ -68,7 +68,7 @@
             .body-1: strong January 1st, 2018 at 12:00 AM
             .body-2.grey--text.mt-3 Last login on
             .body-1: strong January 1st, 2018 at 12:00 AM
-            v-divider
+            v-divider.mt-3
             .body-2.grey--text.mt-3 Pages created
             .body-1: strong 0
             .body-2.grey--text.mt-3 Comments posted