more subnav optimizations

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index fcbae2b319b330f2fa8ddd3b5ea78cc1751632f0..8bb7b5d92a30a3baca75857eb5a73c96d48fdf74 100644 (file)
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -2532,7 +2532,7 @@ table .span24 {
   display: none;
   float: left;
   min-width: 160px;
-  padding: 4px 0;
+  padding: 5px 0;
   margin: 1px 0 0;
   list-style: none;
   background-color: #ffffff;
@@ -2540,9 +2540,9 @@ table .span24 {
   border: 1px solid rgba(0, 0, 0, 0.2);
   *border-right-width: 2px;
   *border-bottom-width: 2px;
-  -webkit-border-radius: 5px;
-     -moz-border-radius: 5px;
-          border-radius: 5px;
+  -webkit-border-radius: 6px;
+     -moz-border-radius: 6px;
+          border-radius: 6px;
   -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
      -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
           box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
@@ -3585,38 +3585,35 @@ input[type="submit"].btn.btn-mini {
 }
 
 .nav-tabs .dropdown-menu {
-  -webkit-border-radius: 0 0 5px 5px;
-     -moz-border-radius: 0 0 5px 5px;
-          border-radius: 0 0 5px 5px;
+  -webkit-border-radius: 0 0 6px 6px;
+     -moz-border-radius: 0 0 6px 6px;
+          border-radius: 0 0 6px 6px;
 }
 
 .nav-pills .dropdown-menu {
-  -webkit-border-radius: 4px;
-     -moz-border-radius: 4px;
-          border-radius: 4px;
+  -webkit-border-radius: 6px;
+     -moz-border-radius: 6px;
+          border-radius: 6px;
 }
 
-.nav-tabs .dropdown-toggle .caret,
-.nav-pills .dropdown-toggle .caret {
+.nav .dropdown-toggle .caret {
   margin-top: 6px;
   border-top-color: #0088cc;
   border-bottom-color: #0088cc;
 }
 
-.nav-tabs .dropdown-toggle:hover .caret,
-.nav-pills .dropdown-toggle:hover .caret {
+.nav .dropdown-toggle:hover .caret {
   border-top-color: #005580;
   border-bottom-color: #005580;
 }
 
-.nav-tabs .active .dropdown-toggle .caret,
-.nav-pills .active .dropdown-toggle .caret {
-  border-top-color: #333333;
-  border-bottom-color: #333333;
+.nav .active .dropdown-toggle .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
 }
 
 .nav > .dropdown.active > a:hover {
-  color: #000000;
+  color: #fff;
   cursor: pointer;
 }
 
@@ -3997,6 +3994,10 @@ input[type="submit"].btn.btn-mini {
   text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
 }
 
+.navbar .nav .dropdown-toggle .caret {
+  margin-top: 8px;
+}
+
 .navbar .btn {
   display: inline-block;
   padding: 4px 10px 4px;
@@ -4207,8 +4208,8 @@ input[type="submit"].btn.btn-mini {
 }
 
 .subnav .nav > li > a {
-  padding: 8px 12px;
-  line-height: 20px;
+  padding: 9px 12px;
+  line-height: 18px;
   border-right: 1px solid #e5e5e5;
   border-left: 1px solid #f5f5f5;
 }
@@ -4225,11 +4226,6 @@ input[type="submit"].btn.btn-mini {
           box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.05);
 }
 
-.subnav .nav > .active > a .caret,
-.subnav .nav > .active > a:hover .caret {
-  border-top-color: #777;
-}
-
 .subnav .nav > li:first-child > a,
 .subnav .nav > li:first-child > a:hover {
   padding-left: 12px;
@@ -4243,13 +4239,24 @@ input[type="submit"].btn.btn-mini {
   border-right: 0;
 }
 
-/* Dropdown menus get matching border-radius
-.subnav .dropdown-menu {
-  -webkit-border-radius: 0 0 @subnavBorderRadius @subnavBorderRadius;
-     -moz-border-radius: 0 0 @subnavBorderRadius @subnavBorderRadius;
-          border-radius: 0 0 @subnavBorderRadius @subnavBorderRadius;
+/* Reposition the dropdown carets */
+
+.subnav .nav .dropdown-toggle .caret {
+  margin-top: 7px;
 }
 
+.nav .active .dropdown-toggle .caret {
+  border-top-color: #777;
+  border-bottom-color: #777;
+}
+
+/* Dropdown menus get matching border-radius */
+
+.subnav .dropdown-menu {
+  -webkit-border-radius: 0 0 4px 4px;
+     -moz-border-radius: 0 0 4px 4px;
+          border-radius: 0 0 4px 4px;
+}
 
 /* Fixed subnav on scroll, but only for 980px and up (sorry IE!) */
 

diff --git a/less/dropdowns.less b/less/dropdowns.less
index bd2dab772d77e3c8cd7a063525fa8087c3292615..f55edbae7ce90069b387e0726ddf978c733a40b0 100644 (file)
--- a/less/dropdowns.less
+++ b/less/dropdowns.less
@@ -54,7 +54,7 @@
   display: none; // none by default, but block on "open" of the menu
   float: left;
   min-width: 160px;
-  padding: 4px 0;
+  padding: 5px 0;
   margin: 1px 0 0; // override default ul
   list-style: none;
   background-color: @dropdownBackground;
@@ -62,7 +62,7 @@
   border: 1px solid rgba(0,0,0,.2);
   *border-right-width: 2px;
   *border-bottom-width: 2px;
-  .border-radius(5px);
+  .border-radius(6px);
   .box-shadow(0 5px 10px rgba(0,0,0,.2));
   -webkit-background-clip: padding-box;
      -moz-background-clip: padding;

diff --git a/less/navbar.less b/less/navbar.less
index d1bfc2209b6310a5b39f9819d40f396e9fb65615..705169fe208934ad254af3f204d1e5aa5ef73c1c 100644 (file)
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -205,6 +205,10 @@
   text-decoration: none;
   text-shadow: 0 -1px 0 rgba(0,0,0,.25);
 }
+.navbar .nav .dropdown-toggle .caret {
+  margin-top: 8px;
+}
+
 // Buttons
 .navbar .btn {
   display: inline-block;

diff --git a/less/navs.less b/less/navs.less
index 66d985a933504b3b32b14f859a5ab1e4c6cb1b82..66ce6fa3ae1cf8d74c9c15ff222ad619e5df578e 100644 (file)
--- a/less/navs.less
+++ b/less/navs.less
@@ -195,39 +195,36 @@
 // ---------
 
 .nav-tabs .dropdown-menu {
-  .border-radius(0 0 5px 5px); // remove the top rounded corners here since there is a hard edge above the menu
+  .border-radius(0 0 6px 6px); // remove the top rounded corners here since there is a hard edge above the menu
 }
 .nav-pills .dropdown-menu {
-  .border-radius(4px); // make rounded corners match the pills
+  .border-radius(6px); // make rounded corners match the pills
 }
 
 // Default dropdown links
 // -------------------------
 // Make carets use linkColor to start
-.nav-tabs .dropdown-toggle .caret,
-.nav-pills .dropdown-toggle .caret {
+.nav .dropdown-toggle .caret {
   border-top-color: @linkColor;
   border-bottom-color: @linkColor;
   margin-top: 6px;
 }
-.nav-tabs .dropdown-toggle:hover .caret,
-.nav-pills .dropdown-toggle:hover .caret {
+.nav .dropdown-toggle:hover .caret {
   border-top-color: @linkColorHover;
   border-bottom-color: @linkColorHover;
 }
 
 // Active dropdown links
 // -------------------------
-.nav-tabs .active .dropdown-toggle .caret,
-.nav-pills .active .dropdown-toggle .caret {
-  border-top-color: @grayDark;
-  border-bottom-color: @grayDark;
+.nav .active .dropdown-toggle .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
 }
 
 // Active:hover dropdown links
 // -------------------------
 .nav > .dropdown.active > a:hover {
-  color: @black;
+  color: #fff;
   cursor: pointer;
 }
 

diff --git a/less/subnav.less b/less/subnav.less
index 4f68269a7ea58d20c2216682d0217090926502a6..9d0e714dbd4ebfe379b5675b8c8527b40e7a27a5 100644 (file)
--- a/less/subnav.less
+++ b/less/subnav.less
@@ -6,12 +6,12 @@
 ------------------------- */
 .subnav {
   width: 100%;
-  height: @subnavHeight;
-  #gradient > .vertical(@subnavBackgroundHighlight, @subnavBackground);
-  border: 1px solid @subnavBorder;
-  -webkit-border-radius: @subnavBorderRadius;
-     -moz-border-radius: @subnavBorderRadius;
-          border-radius: @subnavBorderRadius;
+  height: 36px;
+  #gradient > .vertical(#f5f5f5, #eeeeee);
+  border: 1px solid #e5e5e5;
+  -webkit-border-radius: 4px;
+     -moz-border-radius: 4px;
+          border-radius: 4px;
 }
 
 
@@ -20,14 +20,15 @@
 .subnav .nav {
   margin-bottom: 0; // remove default bottom margin of .nav
 }
+// Make list items appear inline
 .subnav .nav > li {
   float: left;
 }
 .subnav .nav > li > a {
-  padding: 8px 12px;
-  line-height: 20px;
-  border-left: 1px solid @subnavBackgroundHighlight;
-  border-right: 1px solid @subnavBorder;
+  padding: 9px 12px;
+  line-height: 18px;
+  border-left: 1px solid #f5f5f5;
+  border-right: 1px solid #e5e5e5;
 }
 .subnav .nav > .active > a,
 .subnav .nav > .active > a:hover {
@@ -40,27 +41,32 @@
      -moz-box-shadow: inset 0 3px 5px rgba(0,0,0,.05);
           box-shadow: inset 0 3px 5px rgba(0,0,0,.05);
 }
-.subnav .nav > .active > a .caret,
-.subnav .nav > .active > a:hover .caret {
-  border-top-color: #777;
-}
 .subnav .nav > li:first-child > a,
 .subnav .nav > li:first-child > a:hover {
   border-left: 0;
   padding-left: 12px;
-  -webkit-border-radius: @subnavBorderRadius 0 0 @subnavBorderRadius;
-     -moz-border-radius: @subnavBorderRadius 0 0 @subnavBorderRadius;
-          border-radius: @subnavBorderRadius 0 0 @subnavBorderRadius;
+  -webkit-border-radius: 4px 0 0 4px;
+     -moz-border-radius: 4px 0 0 4px;
+          border-radius: 4px 0 0 4px;
 }
 .subnav .nav > li:last-child > a {
   border-right: 0;
 }
 
-/* Dropdown menus get matching border-radius
+/* Reposition the dropdown carets */
+.subnav .nav .dropdown-toggle .caret {
+  margin-top: 7px;
+}
+.nav .active .dropdown-toggle .caret {
+  border-top-color: #777;
+  border-bottom-color: #777;
+}
+
+/* Dropdown menus get matching border-radius */
 .subnav .dropdown-menu {
-  -webkit-border-radius: 0 0 @subnavBorderRadius @subnavBorderRadius;
-     -moz-border-radius: 0 0 @subnavBorderRadius @subnavBorderRadius;
-          border-radius: 0 0 @subnavBorderRadius @subnavBorderRadius;
+  -webkit-border-radius: 0 0 4px 4px;
+     -moz-border-radius: 0 0 4px 4px;
+          border-radius: 0 0 4px 4px;
 }
 
 

diff --git a/less/variables.less b/less/variables.less
index 0060e207caf901e02625c7dcb6b4c3be8c0f13b0..25a032781db98a902eea002da6fe71dc81842256 100644 (file)
--- a/less/variables.less
+++ b/less/variables.less
@@ -168,16 +168,6 @@
 @navbarBrandColor:                @navbarLinkColor;
 
 
-// Subnav
-// -------------------------
-@subnavHeight:                    36px;
-@subnavBackground:                #eeeeee;
-@subnavBackgroundHighlight:       #f5f5f5;
-
-@subnavBorder:                    #e5e5e5;
-@subnavBorderRadius:              4px;
-
-
 // Hero unit
 // -------------------------
 @heroUnitBackground:              @grayLighter;