Add "click" overlay to close masthead and follow button menus when open

Fixes #1168
2020-03-09 14:49:15 -04:00
parent 9c90563d1a
commit b5abe62bf6
3 changed files with 60 additions and 9 deletions
--- a/_sass/minimal-mistakes/_utilities.scss
+++ b/_sass/minimal-mistakes/_utilities.scss
@@ -385,6 +385,33 @@ body:hover .visually-hidden button {
  }
 }

+.greedy-nav__toggle {
+  &:before {
+    @supports (pointer-events: none) {
+      content: '';
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      opacity: 0;
+      background-color: $background-color;
+      -webkit-transition: $global-transition;
+      transition: $global-transition;
+      pointer-events: none;
+    }
+  }
+
+  &.close {
+    &:before {
+      opacity: 0.9;
+      -webkit-transition: $global-transition;
+      transition: $global-transition;
+      pointer-events: auto;
+    }
+  }
+}
+
 .greedy-nav__toggle:hover {
  .navicon,
  .navicon:before,