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;