[C-2347] Improve popover zIndex (#3168)

AudiusProject · Apr 5, 2023 · e310e84 · e310e84
1 parent 6772675
commit e310e84
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/apps/audius-client/packages/stems/src/assets/styles/layers.css b/apps/audius-client/packages/stems/src/assets/styles/layers.css
@@ -0,0 +1,7 @@
+:root,
+root {
+  --layer: 0;
+  --layer-modal: 200;
+  --layer-popup: 300;
+  --layer-tooltip: 400;
+}
diff --git a/apps/audius-client/packages/stems/src/components/Popup/Popup.module.css b/apps/audius-client/packages/stems/src/components/Popup/Popup.module.css
@@ -1,6 +1,6 @@
 .wrapper {
   position: absolute;
-  z-index: 1;
+  z-index: var(--layer-popup);
 }
 
 .popup {

diff --git a/apps/audius-client/packages/stems/src/index.tsx b/apps/audius-client/packages/stems/src/index.tsx
@@ -3,6 +3,7 @@ import './assets/styles/fonts.css'
 import './assets/styles/colors.css'
 import './assets/styles/animations.css'
 import './assets/styles/transforms.css'
+import './assets/styles/layers.css'
 
 export * from './components/Icons'