(less) Fixes twbs#11610: Add @grid-float-breakpoint-max to better lin…

…k navbar behavior across viewports and improve customization. Also addresses twbs#10371, twbs#10395, and twbs#10465.
stempler · Dec 5, 2013 · 71d3d5f · 71d3d5f
1 parent e363349
commit 71d3d5f
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/navbar.less b/navbar.less
@@ -213,7 +213,7 @@
     line-height: @line-height-computed;
   }
 
-  @media (max-width: @screen-xs-max) {
+  @media (max-width: @grid-float-breakpoint-max) {
     // Dropdowns get custom display when collapsed
     .open .dropdown-menu {
       position: static;
@@ -287,7 +287,7 @@
   .form-inline();
 
   .form-group {
-    @media (max-width: @screen-xs-max) {
+    @media (max-width: @grid-float-breakpoint-max) {
       margin-bottom: 5px;
     }
   }
@@ -445,7 +445,7 @@
       }
     }
 
-    @media (max-width: @screen-xs-max) {
+    @media (max-width: @grid-float-breakpoint-max) {
       // Dropdowns get custom display when collapsed
       .open .dropdown-menu {
         > li > a {
@@ -565,7 +565,7 @@
       }
     }
 
-    @media (max-width: @screen-xs-max) {
+    @media (max-width: @grid-float-breakpoint-max) {
       // Dropdowns get custom display
       .open .dropdown-menu {
         > .dropdown-header {

diff --git a/variables.less b/variables.less
@@ -247,8 +247,13 @@
 @grid-columns:              12;
 // Padding, to be divided by two and applied to the left and right of all columns
 @grid-gutter-width:         30px;
-// Point at which the navbar stops collapsing
+
+// Navbar collapse
+
+// Point at which the navbar becomes uncollapsed
 @grid-float-breakpoint:     @screen-sm-min;
+// Point at which the navbar begins collapsing
+@grid-float-breakpoint-max: (@grid-float-breakpoint - 1);
 
 
 // Navbar