Merge pull request #8726 from andreypopp/3.0.0-wip

Fix out of order variable declaration order

less/navs.less

@@ -73,6 +73,36 @@
 // Nav variations
 // --------------------------------------------------
 
+// Justified nav links
+// -------------------------
+
+.nav-justified {
+  width: 100%;
+  > li {
+    float: none;
+    display: table-cell;
+    width: 1%;
+    > a {
+      text-align: center;
+    }
+  }
+}
+
+// Move borders to anchors instead of bottom of list
+.nav-tabs-justified {
+  border-bottom: 0;
+  > li > a {
+    border-bottom: 1px solid @nav-tabs-justified-link-border-color;
+
+    // Override margin from .nav-tabs
+    margin-right: 0;
+  }
+  > .active > a {
+    border-bottom-color: @nav-tabs-justified-active-link-border-color;
+  }
+
+}
+
 // Tabs
 // -------------------------
 
@@ -154,37 +184,6 @@
   }
 }
 
-// Justified nav links
-// -------------------------
-
-.nav-justified {
-  width: 100%;
-  > li {
-    float: none;
-    display: table-cell;
-    width: 1%;
-    > a {
-      text-align: center;
-    }
-  }
-}
-
-// Move borders to anchors instead of bottom of list
-.nav-tabs-justified {
-  border-bottom: 0;
-  > li > a {
-    border-bottom: 1px solid @nav-tabs-justified-link-border-color;
-
-    // Override margin from .nav-tabs
-    margin-right: 0;
-  }
-  > .active > a {
-    border-bottom-color: @nav-tabs-justified-active-link-border-color;
-  }
-
-}
-
-
 
 // Tabbable tabs
 // -------------------------

less/variables.less

@@ -174,6 +174,39 @@
 @zindex-modal-background:  1040;
 @zindex-modal:             1050;
 
+// Media queries breakpoints
+// --------------------------------------------------
+
+// Tiny screen / phone
+@screen-tiny:                480px;
+@screen-phone:               @screen-tiny;
+
+// Small screen / tablet
+@screen-small:               768px;
+@screen-tablet:              @screen-small;
+
+// Medium screen / desktop
+@screen-medium:              992px;
+@screen-desktop:             @screen-medium;
+
+// So media queries don't overlap when required, provide a maximum
+@screen-small-max:           (@screen-medium - 1);
+@screen-tablet-max:          @screen-small-max;
+
+// Large screen / wide desktop
+@screen-large:               1200px;
+@screen-large-desktop:       @screen-large;
+
+// Grid system
+// --------------------------------------------------
+
+// Number of columns in the grid system
+@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
+@grid-float-breakpoint:     @screen-tablet;
+
 
 // Navbar
 // -------------------------
@@ -520,30 +553,6 @@
 @component-offset-horizontal: 180px;
 
 
-// Media queries breakpoints
-// --------------------------------------------------
-
-// Tiny screen / phone
-@screen-tiny:                480px;
-@screen-phone:               @screen-tiny;
-
-// Small screen / tablet
-@screen-small:               768px;
-@screen-tablet:              @screen-small;
-
-// Medium screen / desktop
-@screen-medium:              992px;
-@screen-desktop:             @screen-medium;
-
-// So media queries don't overlap when required, provide a maximum
-@screen-small-max:           (@screen-medium - 1);
-@screen-tablet-max:          @screen-small-max;
-
-// Large screen / wide desktop
-@screen-large:               1200px;
-@screen-large-desktop:       @screen-large;
-
-
 // Container sizes
 // --------------------------------------------------
 
@@ -555,14 +564,3 @@
 
 // Large screen / wide desktop
 @container-large-desktop:   1170px;
-
-
-// Grid system
-// --------------------------------------------------
-
-// Number of columns in the grid system
-@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
-@grid-float-breakpoint:     @screen-tablet;