Merge pull request #100 from OpenSourceOrg/merge/mobile-nav

Merge/mobile nav

Author: geoffguillain

themes/osi/assets/scss/_6_components.header.scss

@@ -9,6 +9,12 @@
 		color: inherit;
 	}
 }
+.admin-bar {
+    .header-main.header-main-small {
+        top: 46px;
+    }
+
+}
 .header--inner {
     padding: 0;
     position: static;
@@ -108,8 +114,6 @@
 
 @media only screen and (max-width: #{$break-nav}) {
 	.header-main-small {
-		pointer-events: none;
-
 		.header--blog-name img {
 			max-height: 67.19px;
 		}

themes/osi/assets/scss/_6_components.mobile-menu.scss

@@ -6,6 +6,17 @@
     width: 100%;
 }
 
+.open-the-menu {
+  .open-button-wrapper {
+    position: fixed;
+  }
+  .admin-bar {
+    .open-button-wrapper {
+      top: 46px;
+    }
+  }
+}
+
   .open-button:not(.open-search) {
       @include drop-shadow($x-axis: 0, $y-axis: 0px, $blur: 0, $alpha: 0);
       background: none;

themes/osi/assets/scss/_6_components.navigation.scss

@@ -88,15 +88,6 @@ nav {
 	margin-left: auto;
 	padding: 2.1rem 0;
 	transition: all 0.8s ease;
-	// position: absolute;
-	// right: 100%;
-	// top: 0;
-	// // @include transition(all .8s);
-	// width: 80%;
-
-	.header-main-small & {
-		padding: 0;
-	}
 
 	ul {
 		list-style: none;
@@ -167,7 +158,7 @@ footer {
 		margin-top: $quicklinksTop; // quicklinks header height
 		max-height: 0;
 		overflow: hidden;
-    	position: absolute;
+    	position: fixed;
 		right: 0;
 		top: 0;
     	transition: all .3s;

themes/osi/assets/scss/_7_vendor.plugins.scss

@@ -89,7 +89,6 @@ form.wp-block-jetpack-contact-form {
 
 /* Specific styling for mobile devices */
 @media only screen and (max-width: 768px) {
-
     .header-main-small {
         display: block !important;
     }