fix: loading bar sticky on page top

mrjackwills · Apr 19, 2024 · 132cfb2 · 132cfb2
1 parent 8435239
commit 132cfb2
Showing 1 changed file with 8 additions and 5 deletions.
diff --git a/src/components/ThePage.vue b/src/components/ThePage.vue
@@ -1,13 +1,13 @@
 
 <template>
+
 	<v-container fluid class='ma-0 pa-0 no-gutters' :class='{"fill-height":fillHeight}'>
 		<v-progress-linear
 			:active='true'
 			:indeterminate='loading'
 			bg-opacity='0'
-			class='mb-n2'
+			class='mb-n2 sticky-loading'
 			color='primary'
-			top
 		/>
 
 		<v-row
@@ -43,9 +43,7 @@
 <script setup lang='ts'>
 import type { VRow } from 'vuetify/components/VGrid';
 
-const loading = computed((): boolean => {
-	return loadingModule().loading;
-});
+const loading = computed(() => loadingModule().loading);
 
 withDefaults(defineProps<{
 	fillHeight?: boolean,
@@ -85,4 +83,9 @@ withDefaults(defineProps<{
 	top: 0;
 	z-index: 100;
 }
+
+.sticky-loading{
+	position: fixed;
+	z-index: 101;
+}
 </style>