Set position absolute on loading spinner container to prevent cls (#2531

)
europeana · Dec 19, 2024 · b9474c8 · b9474c8
1 parent f7a60b0
commit b9474c8
Showing 1 changed file with 11 additions and 2 deletions.
diff --git a/packages/portal/src/components/media/MediaImageViewer.vue b/packages/portal/src/components/media/MediaImageViewer.vue
@@ -1,15 +1,15 @@
 <template>
   <div
     id="media-image-viewer"
-    class="h-100 w-100"
+    class="position-relative h-100 w-100"
     data-qa="media image viewer"
   >
     <MediaImageViewerKeyboardToggle
       id="media-image-viewer-keyboard-toggle"
     />
     <b-container
       v-if="imageLoading"
-      class="h-100 d-flex align-items-center justify-content-center"
+      class="loading-spinner position-absolute h-100 d-flex align-items-center justify-content-center"
       data-qa="loading spinner container"
     >
       <LoadingSpinner
@@ -478,3 +478,12 @@
     }
   };
 </script>
+
+<style lang="scss" scoped>
+  .loading-spinner {
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+  }
+</style>