diff --git a/.changeset/tender-cats-divide.md b/.changeset/tender-cats-divide.md new file mode 100644 index 00000000..57c3c605 --- /dev/null +++ b/.changeset/tender-cats-divide.md @@ -0,0 +1,5 @@ +--- +"@cube-dev/ui-kit": patch +--- + +Increase `zIndex` style for Modals. diff --git a/src/components/overlays/Modal/Modal.tsx b/src/components/overlays/Modal/Modal.tsx index 8db8bbbb..6a089ee5 100644 --- a/src/components/overlays/Modal/Modal.tsx +++ b/src/components/overlays/Modal/Modal.tsx @@ -25,7 +25,7 @@ export const OVERLAY_WRAPPER_STYLES: Styles = { width: '100vw', height: '100dvh', pointerEvents: 'none', - zIndex: 2, + zIndex: 10, transition: { '': 'visibility .5s steps(2, start)', open: 'visibility 0s linear', @@ -45,7 +45,7 @@ const ModalElement = tasty({ exiting: 'grid', exited: 'none', }, - zIndex: 2, + zIndex: 10, height: { '': 'max 90dvh', '[data-type="fullscreenTakeover"] | [data-type="panel"]': '100dvh 100dvh', diff --git a/src/components/overlays/Modal/Tray.tsx b/src/components/overlays/Modal/Tray.tsx index 01485325..3b4e1de8 100644 --- a/src/components/overlays/Modal/Tray.tsx +++ b/src/components/overlays/Modal/Tray.tsx @@ -29,7 +29,7 @@ const TrayElement = tasty({ exiting: 'initial', exited: 'none', }, - zIndex: 2, + zIndex: 10, height: 'max 90dvh', width: '288px 90vw', pointerEvents: 'auto', diff --git a/src/components/overlays/Modal/Underlay.tsx b/src/components/overlays/Modal/Underlay.tsx index 67151252..51b1176b 100644 --- a/src/components/overlays/Modal/Underlay.tsx +++ b/src/components/overlays/Modal/Underlay.tsx @@ -10,7 +10,7 @@ const UnderlayElement = tasty({ right: 0, bottom: 0, left: 0, - zIndex: 1, + zIndex: 9, transitionDelay: '0ms', opacity: { '': 0,