fix(Z-indexes): Redifine z-indexes between 0 and 5

Author: SpliiT

app/components/Auth/AuthBackground.vue

@@ -9,7 +9,7 @@
 .auth-background {
   position: fixed;
   inset: 0;
-  z-index: -1;
+  z-index: 0;
   overflow: hidden;
   pointer-events: none;
 }

app/components/CreateTools.vue

@@ -127,7 +127,7 @@ watch(
 <style scoped>
 .back-btn {
   top: 0;
-  z-index: 10;
+  z-index: 2;
 }
 
 .custom-tool-card {

app/components/Extension.vue

@@ -433,7 +433,7 @@ function removeExtension() {
 }
 
 .remove-dialog {
-  z-index: 10000;
+  z-index: 4;
 }
 
 .extension-icon {

app/components/Layout/DrawerManager.vue

@@ -66,7 +66,7 @@ function handleFilesDropped(files) {
       elevation="0"
       :width="380"
       class="drawer-container left-0"
-      style="z-index: 9999"
+      style="z-index: 4;"
     >
       <GlassCard
         variant="panel"
@@ -88,7 +88,7 @@ function handleFilesDropped(files) {
   position: fixed;
   inset: 0;
   background-color: rgba(0, 0, 0, 0.5);
-  z-index: 98;
+  z-index: 2;
   will-change: backdrop-filter;
   transform: translateZ(0);
   isolation: isolate;
@@ -101,7 +101,7 @@ function handleFilesDropped(files) {
   height: calc(100vh - 100px) !important;
   margin-top: 84px;
   padding: 16px;
-  z-index: 99;
+  z-index: 3;
   isolation: isolate;
   backface-visibility: hidden;
   transform: translateZ(0);

app/layouts/default.vue

@@ -44,7 +44,7 @@ watch(
 
     <v-main class="custom-background dropzone">
       <GlassCard variant="ui" padding="pa-0" class="island-wrapper overflow-hidden">
-        <NuxtPage style="z-index: 1" class="fill-height" />
+        <NuxtPage z-index="1" class="fill-height" />
       </GlassCard>
       <InfraConnected>
         <DrawerManager :ui-store="UIStore" @files-dropped="handleFilesDropped" />
@@ -55,7 +55,7 @@ watch(
       indeterminate
       color="white"
       class="position-fixed top-0"
-      style="z-index: 10001"
+      style="z-index: 4;"
     />
     <FeedBackSnackers />
   </v-app>
@@ -98,7 +98,7 @@ watch(
   position: fixed;
   inset: 0;
   background-color: rgba(0, 0, 0, 0.5);
-  z-index: 98;
+  z-index: 2;
   will-change: backdrop-filter;
   transform: translateZ(0);
   isolation: isolate;
@@ -118,7 +118,7 @@ watch(
   height: calc(100vh - 100px) !important;
   margin-top: 84px;
   padding: 16px;
-  z-index: 99;
+  z-index: 3;
   isolation: isolate;
   backface-visibility: hidden;
   transform: translateZ(0);