chore: handle nav-stack z-index and sticky display group z-index

IDEMSInternational · Dec 2, 2024 · 9fd016c · 9fd016c
1 parent 14b3abb
commit 9fd016c
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 0 deletions.
diff --git a/src/app/feature/nav-stack/components/nav-stack/nav-stack.component.global.scss b/src/app/feature/nav-stack/components/nav-stack/nav-stack.component.global.scss
@@ -8,6 +8,8 @@ ion-modal.nav-stack-modal {
   --box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
   --backdrop-opacity: 0.5;
 
+  z-index: calc(10 + var(--nav-stack-index));
+
   // Override defalut ion-modal behaviour of hiding backdrop for subsequent modals after first
   &:not([data-nav-stack-index="0"]) {
     --backdrop-opacity: 0.2 !important;

diff --git a/...p/shared/components/template/components/layout/display-group/display-group.component.scss b/...p/shared/components/template/components/layout/display-group/display-group.component.scss
@@ -16,6 +16,8 @@
     width: 100vw;
     display: flex;
     justify-content: center;
+    // nav-stacks have a z-index of (10 + var(--nav-stack-index))
+    z-index: calc(10 + var(--nav-stack-index, 0));
   }
 
   &[data-sticky="top"] {