add justified nav links for tabs and pills

1 files changed, 45 insertions, 29 deletions

diff --git a/less/navs.less b/less/navs.less
index 5ca43f9e0..bfdec50ed 100644
--- a/less/navs.less
+++ b/less/navs.less
@@ -85,6 +85,51 @@
 
 
 
+// Pills
+// -------------------------
+
+// Links rendered as pills
+.nav-pills > li > a {
+  border-radius: 5px;
+}
+.nav-pills > li + li > a {
+  margin-left: 2px;
+}
+
+// Active state
+.nav-pills > .active > a,
+.nav-pills > .active > a:hover {
+  color: @white;
+  background-color: @linkColor;
+}
+
+// Stacked pills
+.nav-stacked > li {
+  float: none;
+}
+.nav-stacked > li + li > a {
+  margin-top: 2px;
+  margin-left: 0; // no need for the gap between nav items
+}
+
+
+
+// Justified navs
+// -------------------------
+
+.nav-justified {
+  // Negative margin doesn't work, so we hack it
+  max-height: 37px;
+}
+.nav-justified > li {
+  float: none;
+  display: table-cell;
+  width: 1%;
+  text-align: center;
+}
+
+
+
 // Lists
 // -------------------------
 
@@ -123,35 +168,6 @@
 
 
 
-// Pills
-// -------------------------
-
-// Links rendered as pills
-.nav-pills > li > a {
-  border-radius: 5px;
-}
-.nav-pills > li + li > a {
-  margin-left: 2px;
-}
-
-// Active state
-.nav-pills > .active > a,
-.nav-pills > .active > a:hover {
-  color: @white;
-  background-color: @linkColor;
-}
-
-// Stacked pills
-.nav-stacked > li {
-  float: none;
-}
-.nav-stacked > li + li > a {
-  margin-top: 2px;
-  margin-left: 0; // no need for the gap between nav items
-}
-
-
-
 // Dropdowns
 // -------------------------