diff --git a/components/layout/NavDrawer.js b/components/layout/NavDrawer.js index 05c34def..f484bc51 100644 --- a/components/layout/NavDrawer.js +++ b/components/layout/NavDrawer.js @@ -16,12 +16,11 @@ const NavDrawer = ({ active, children, className, onOverlayClick, permanentAt, p }); return ( -
-
- -
+
+
+
); }; diff --git a/components/layout/_mixins.scss b/components/layout/_mixins.scss index 1ace8de4..e998d174 100644 --- a/components/layout/_mixins.scss +++ b/components/layout/_mixins.scss @@ -1,11 +1,9 @@ @mixin open() { transition-delay: $animation-delay; - & > .scrim { - & > .drawerContent { - pointer-events: all; - transition-delay: $animation-delay; - transform: translateX(0); - } + .drawerContent { + pointer-events: all; + transition-delay: $animation-delay; + transform: translateX(0); } } diff --git a/components/layout/theme.scss b/components/layout/theme.scss index 17275cd1..405d5121 100644 --- a/components/layout/theme.scss +++ b/components/layout/theme.scss @@ -29,7 +29,7 @@ top: 0; bottom: 0; left: 0; - z-index: $z-index-highest; + z-index: $z-index-higher; width: 0; height: 100%; background-color: rgba($drawer-overlay-color, 0); @@ -38,6 +38,8 @@ .drawerContent { @include shadow-2dp(); + position: absolute; + z-index: $z-index-highest; display: flex; width: $navigation-drawer-mobile-width; max-width: $navigation-drawer-max-mobile-width;