fix: fix modal, overlay z-indexes

TomatoVan · Mar 5, 2024 · c56236a · c56236a
1 parent a588818
commit c56236a
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 11 deletions.
diff --git a/src/app/styles/variables/global.scss b/src/app/styles/variables/global.scss
@@ -19,7 +19,8 @@
     --sidebar-width-collapsed: 80px;
 
     // z - Индексы
-    --modal-z-index: 10;
+    --modal-z-index: 1000;
+    --overlay-z-index: 100;
 
     // Цвета
     --overlay-color: rgba(0 0 0 / 60%);

diff --git a/src/shared/ui/Modal/Modal.module.scss b/src/shared/ui/Modal/Modal.module.scss
@@ -12,22 +12,14 @@
     align-items: center;
 }
 
-.overlay {
-    width: 100%;
-    height: 100%;
-    background: var(--overlay-color);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
 .content {
     padding: 20px;
     border-radius: 12px;
     background: var(--bg-color);
     transition: 0.3s transform;
     transform: scale(0.5);
     max-width: 60%;
+    z-index: var(--modal-z-index);
 }
 
 .opened {

diff --git a/src/shared/ui/Overlay/Overlay.module.scss b/src/shared/ui/Overlay/Overlay.module.scss
@@ -8,6 +8,6 @@
     bottom: 0;
     right: 0;
     left: 0;
-    z-index: -1;
     cursor: pointer;
+    z-index: var(--overlay-z-index);
 }