Improve greedy navigation's layout when JavaScript is disabled

2018-01-09 13:56:09 -05:00 · 2018-01-09 13:56:09 -05:00 · 614b6bdf92
parent a8d7bf2237
commit 614b6bdf92
2 changed files with 11 additions and 1 deletions
--- a/_includes/masthead.html
+++ b/_includes/masthead.html
@ -22,7 +22,7 @@
          </svg>
        </button>
        {% endif %}
-        <button class="greedy-nav__toggle" type="button">
+        <button class="greedy-nav__toggle hidden" type="button">
          <span class="visually-hidden">{{ site.data.ui-text[site.locale].menu_label | default: "Toggle Menu" }}</span>
          <div class="navicon"></div>
        </button>
--- a/_sass/minimal-mistakes/_navigation.scss
+++ b/_sass/minimal-mistakes/_navigation.scss
@ -309,6 +309,16 @@
  }
 }

+.no-js {
+  .greedy-nav {
+    .visible-links {
+      -ms-flex-wrap: wrap;
+      flex-wrap: wrap;
+      overflow: visible;
+    }
+  }
+}
+
 /*
     Navigation list
     ========================================================================== */