Create global loader

aleksis/core/assets/App.vue

@@ -79,7 +79,7 @@
           </div>
         </template>
       </v-navigation-drawer>
-      <v-app-bar app color="primary white--text">
+      <v-app-bar app :color="$vuetify.theme.dark ? undefined : 'primary white--text'">
         <v-app-bar-nav-icon @click="drawer = !drawer" color="white" />
 
         <v-toolbar-title
@@ -90,6 +90,14 @@
           {{ systemProperties.sitePreferences.generalTitle }}
         </v-toolbar-title>
 
+        <v-progress-linear
+          :active="$root.contentLoading"
+          :indeterminate="$root.contentLoading"
+          absolute
+          bottom
+          :color="$vuetify.theme.dark ? 'primary' : 'grey lighten-3'"
+        ></v-progress-linear>
+
         <v-spacer />
         <div v-if="currentUser.isAuthenticated" class="d-flex">
           <notification-list />

aleksis/core/assets/app.js

@@ -174,6 +174,7 @@ const app = new Vue({
   render: (h) => h(App),
   data: () => ({
     showCacheAlert: false,
+    contentLoading: false,
   }),
   router,
   i18n,