refactor navbar file to better nest css and restore navbar-color to navbar text (fixes #9500)

dist/css/bootstrap.css

@@ -3196,6 +3196,12 @@ button.close {
     border-top: 0;
     box-shadow: none;
   }
+  .navbar-collapse.collapse {
+    display: block !important;
+    height: auto !important;
+    padding-bottom: 0;
+    overflow: visible !important;
+  }
 }
 
 @media (min-width: 768px) {
@@ -3275,18 +3281,20 @@ button.close {
   margin-top: 4px;
 }
 
+@media (min-width: 768px) {
+  .navbar-toggle {
+    position: relative;
+    top: auto;
+    left: auto;
+    display: none;
+  }
+}
+
 .navbar-nav {
   margin-right: -15px;
   margin-left: -15px;
 }
 
-@media (min-width: 768px) {
-  .navbar-nav {
-    margin-right: 0;
-    margin-left: 0;
-  }
-}
-
 .navbar-nav > li > a {
   padding-top: 10px;
   padding-bottom: 10px;
@@ -3352,6 +3360,20 @@ button.close {
   }
 }
 
+@media (min-width: 768px) {
+  .navbar-nav {
+    float: left;
+    margin: 0;
+  }
+  .navbar-nav > li {
+    float: left;
+  }
+  .navbar-nav > li > a {
+    padding-top: 15px;
+    padding-bottom: 15px;
+  }
+}
+
 @media (min-width: 768px) {
   .navbar-left {
     float: left !important;
@@ -3457,6 +3479,25 @@ button.close {
   left: auto;
 }
 
+.navbar-btn {
+  margin-top: 8px;
+}
+
+.navbar-text {
+  float: left;
+  margin-top: 15px;
+  margin-bottom: 15px;
+  color: #777777;
+}
+
+.navbar-link {
+  color: #777777;
+}
+
+.navbar-link:hover {
+  color: #333333;
+}
+
 .navbar-inverse {
   background-color: #222222;
   border-color: #080808;
@@ -3567,51 +3608,6 @@ button.close {
   }
 }
 
-@media screen and (min-width: 768px) {
-  .navbar-nav {
-    float: left;
-    margin-top: 0;
-    margin-bottom: 0;
-  }
-  .navbar-nav > li {
-    float: left;
-  }
-  .navbar-nav > li > a {
-    padding-top: 15px;
-    padding-bottom: 15px;
-  }
-  .navbar-toggle {
-    position: relative;
-    top: auto;
-    left: auto;
-    display: none;
-  }
-  .navbar-collapse.collapse {
-    display: block !important;
-    height: auto !important;
-    padding-bottom: 0;
-    overflow: visible !important;
-  }
-}
-
-.navbar-btn {
-  margin-top: 8px;
-}
-
-.navbar-text {
-  float: left;
-  margin-top: 15px;
-  margin-bottom: 15px;
-}
-
-.navbar-link {
-  color: #777777;
-}
-
-.navbar-link:hover {
-  color: #333333;
-}
-
 .navbar-inverse .navbar-link {
   color: #999999;
 }

less/navbar.less

@@ -69,6 +69,13 @@
     padding: 0;
     border-top: 0;
     box-shadow: none;
+
+    &.collapse {
+      display: block !important;
+      height: auto !important;
+      padding-bottom: 0; // Override default setting
+      overflow: visible !important;
+    }
   }
 }
 
@@ -159,6 +166,13 @@
   .icon-bar + .icon-bar {
     margin-top: 4px;
   }
+
+  @media (min-width: @grid-float-breakpoint) {
+    position: relative;
+    top: auto;
+    left: auto;
+    display: none;
+  }
 }
 
 
@@ -171,11 +185,6 @@
   margin-left: -@navbar-padding-horizontal;
   margin-right: -@navbar-padding-horizontal;
 
-  @media (min-width: @grid-float-breakpoint) {
-    margin-left: 0;
-    margin-right: 0;
-  }
-
   > li > a {
     padding-top:    10px;
     padding-bottom: 10px;
@@ -205,7 +214,7 @@
   }
 
   @media (max-width: @screen-phone-max) {
-    // Dropdowns get custom display
+    // Dropdowns get custom display when collapsed
     .open .dropdown-menu {
       position: static;
       float: none;
@@ -247,6 +256,20 @@
     }
   }
 
+  // Uncollapse the nav
+  @media (min-width: @grid-float-breakpoint) {
+    float: left;
+    margin: 0;
+
+    > li {
+      float: left;
+      > a {
+        padding-top: ((@navbar-height - @line-height-computed) / 2);
+        padding-bottom: ((@navbar-height - @line-height-computed) / 2);
+      }
+    }
+  }
+
 }
 
 
@@ -351,6 +374,38 @@
 }
 
 
+// Buttons in navbars
+//
+// Vertically center a button within a navbar (when *not* in a form).
+
+.navbar-btn {
+  margin-top: ((@navbar-height - @input-height-base) / 2);
+}
+
+
+// Text in navbars
+//
+// Add a class to make any element properly align itself vertically within the navbars.
+
+.navbar-text {
+  float: left;
+  color: @navbar-color;
+  .navbar-vertical-align(@line-height-computed);
+}
+
+
+// Links in navbars
+//
+// Add a class to ensure links outside the navbar nav are colored correctly.
+
+// Default navbar variables
+.navbar-link {
+  color: @navbar-link-color;
+  &:hover {
+    color: @navbar-link-hover-color;
+  }
+}
+
 
 // Inverse navbar
 // --------------------------------------------------
@@ -479,85 +534,11 @@
     }
   }
 
-}
-
-
-
-// Responsive navbar
-// --------------------------------------------------
-
-@media screen and (min-width: @grid-float-breakpoint) {
-
-  .navbar-nav {
-    float: left;
-    // undo margin to make nav extend full height of navbar
-    margin-top: 0;
-    margin-bottom: 0;
-
-    > li {
-      float: left;
-      > a {
-        padding-top: ((@navbar-height - @line-height-computed) / 2);
-        padding-bottom: ((@navbar-height - @line-height-computed) / 2);
-      }
-    }
-  }
-
-  // Required to make the collapsing navbar work on regular desktops
-  .navbar-toggle {
-    position: relative;
-    top: auto;
-    left: auto;
-    display: none;
-  }
-  .navbar-collapse.collapse {
-    display: block !important;
-    height: auto !important;
-    padding-bottom: 0; // Override default setting
-    overflow: visible !important;
-  }
-
-}
-
-
-
-// Buttons in navbars
-//
-// Vertically center a button within a navbar (when *not* in a form).
-
-.navbar-btn {
-  margin-top: ((@navbar-height - @input-height-base) / 2);
-}
-
-
-
-// Text in navbars
-//
-// Add a class to make any element properly align itself vertically within the navbars.
-
-.navbar-text {
-  float: left;
-  .navbar-vertical-align(@line-height-computed);
-}
-
-
-
-// Links in navbars
-//
-// Add a class to ensure links outside the navbar nav are colored correctly.
-
-// Default navbar variables
   .navbar-link {
-  color: @navbar-link-color;
-  &:hover {
-    color: @navbar-link-hover-color;
-  }
-}
-
-// Use the inverse navbar variables
-.navbar-inverse .navbar-link {
     color: @navbar-inverse-link-color;
     &:hover {
       color: @navbar-inverse-link-hover-color;
     }
   }
+
+}