Merge branch 'v4-dev' into v4-navbars

scss/_navbar.scss

@@ -116,10 +116,13 @@
 // Bootstrap JavaScript plugin.
 
 .navbar-toggler {
+  width: 2.5em;
+  height: 2em;
   padding: $navbar-toggler-padding-y $navbar-toggler-padding-x;
   font-size: $navbar-toggler-font-size;
   line-height: 1;
-  background: none;
+  background: transparent no-repeat center center;
+  background-size: 24px 24px;
   border: $border-width solid transparent;
   @include border-radius($navbar-toggler-border-radius);
 
@@ -207,6 +210,10 @@
     }
   }
 
+  .navbar-toggler {
+    background-image: $navbar-light-toggler-bg;
+  }
+
   .navbar-divider {
     background-color: rgba(0,0,0,.075);
   }
@@ -242,7 +249,57 @@
     }
   }
 
+  .navbar-toggler {
+    background-image: $navbar-dark-toggler-bg;
+  }
+
   .navbar-divider {
     background-color: rgba(255,255,255,.075);
   }
 }
+
+
+// Navbar toggleable
+//
+// Custom override for collapse plugin in navbar.
+
+.navbar-toggleable {
+  &-xs {
+    @include clearfix;
+    @include media-breakpoint-down(xs) {
+      .navbar-nav .nav-item {
+        float: none;
+        margin-left: 0;
+      }
+    }
+    @include media-breakpoint-up(sm) {
+      display: block !important;
+    }
+  }
+
+  &-sm {
+    @include clearfix;
+    @include media-breakpoint-down(sm) {
+      .navbar-nav .nav-item {
+        float: none;
+        margin-left: 0;
+      }
+    }
+    @include media-breakpoint-up(md) {
+      display: block !important;
+    }
+  }
+
+  &-md {
+    @include clearfix;
+    @include media-breakpoint-down(md) {
+      .navbar-nav .nav-item {
+        float: none;
+        margin-left: 0;
+      }
+    }
+    @include media-breakpoint-up(lg) {
+      display: block !important;
+    }
+  }
+}