separates chick to destination form menu toggle

diff --git a/docs/assets/scss/docs.scss b/docs/assets/scss/docs.scss
index 846637c8ddbf29ec1608c80ffea26a7b281867ab..1320037cfcc4044fa9c83ae7cd549b252e5cee8a 100644 (file)
--- a/docs/assets/scss/docs.scss
+++ b/docs/assets/scss/docs.scss
@@ -270,6 +270,14 @@ $global-nav-hover-color: lighten($global-nav-bg, 10%);
 .global-nav-mobile-wrapper {
   background: $global-nav-bg;
   position: relative;
+  display: flex;
+  vertical-align: middle;
+
+  button,
+  [type="button"] {
+    appearance: none;
+    height: rem-calc(45);
+  }
 
   @media screen and (min-width: 775px) {
     display: none;
@@ -284,9 +292,8 @@ $global-nav-hover-color: lighten($global-nav-bg, 10%);
   // hamburger-menu
 
   .hamburger-icon {
-    @include vertical-center;
     height: 12px;
-    left: 10px;
+    margin-left: 10px;
   }
 
   // zurb logo

diff --git a/docs/partials/mobile-navigation.html b/docs/partials/mobile-navigation.html
index 52cf786185b1f8d513ddd3ee8260d8c5a450b370..886081a1c2ed0d2b7ca54b00715a48b66f4529b4 100644 (file)
--- a/docs/partials/mobile-navigation.html
+++ b/docs/partials/mobile-navigation.html
@@ -1,10 +1,8 @@
 <div class="global-nav-mobile-wrapper hide-for-smedium-up">
   <button type="button" data-toggle="offCanvasLeft">
-    <div class="global-nav-mobile">
-      <img class="hamburger-icon" alt="Menu icon" src="{{root}}assets/img/icons/menu-grey.png">
-      <div class="global-nav-title">
-        <a class="zurb-logo" href="http://foundation.zurb.com/index.html">ZURB <strong>Foundation</strong></a>
-      </div>
-    </div>
+    <img class="hamburger-icon" alt="Menu icon" src="{{root}}assets/img/icons/menu-grey.png">
   </button>
+  <div class="global-nav-title">
+    <a class="zurb-logo" href="http://foundation.zurb.com/index.html">ZURB <strong>Foundation</strong></a>
+  </div>
 </div>