Restore commented out dropdown styles, get open dropdown state working again

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 249645d9ca0d05e3a2a745380f90d58663bef07f..65e47130614c2564bb5a23c71396e9f593cefbad 100644 (file)
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -2693,15 +2693,10 @@ input[type="button"].btn-block {
   content: "\e160";
 }
 
-.open > a {
-  outline: 0;
-}
-
 .caret {
   display: inline-block;
   width: 0;
   height: 0;
-  margin-top: 8px;
   margin-left: 2px;
   vertical-align: middle;
   border-top: 4px solid #000;
@@ -2804,6 +2799,10 @@ input[type="button"].btn-block {
   display: block;
 }
 
+.open > a {
+  outline: 0;
+}
+
 .pull-right > .dropdown-menu {
   right: 0;
   left: auto;
@@ -3163,6 +3162,13 @@ button.close {
   margin-top: 9px;
 }
 
+.nav > li.open > a,
+.nav > li.open > a:hover,
+.nav > li.open > a:focus {
+  background-color: #428bca;
+  border-color: #428bca;
+}
+
 .nav > .pull-right {
   float: right;
 }
@@ -3313,10 +3319,56 @@ button.close {
 }
 
 .nav-tabs .dropdown-menu {
+  margin-top: -1px;
   border-top-right-radius: 0;
   border-top-left-radius: 0;
 }
 
+.nav .caret {
+  border-top-color: #428bca;
+  border-bottom-color: #428bca;
+}
+
+.nav a:hover .caret {
+  border-top-color: #2a6496;
+  border-bottom-color: #2a6496;
+}
+
+.nav .active .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
+}
+
+.nav-tabs .active .caret {
+  border-top-color: #555555;
+  border-bottom-color: #555555;
+}
+
+.nav > .dropdown.active > a:hover {
+  cursor: pointer;
+}
+
+.nav-tabs .open > a,
+.nav-pills .open > a,
+.nav > li.dropdown.open.active > a:hover {
+  color: #fff;
+  background-color: #999999;
+  border-color: #999999;
+}
+
+.nav li.dropdown.open .caret,
+.nav li.dropdown.open.active .caret,
+.nav li.dropdown.open > a:hover .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
+  opacity: 1;
+  filter: alpha(opacity=100);
+}
+
+.tabs-stacked .open > a:hover {
+  border-color: #999999;
+}
+
 /*
 // Prevent IE8 from misplacing imgs
 // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989

diff --git a/less/dropdowns.less b/less/dropdowns.less
index 45242fb68ca879d85d443e418c8914d2e0ac9bb2..1b9165b4efb442d0712f00a93b23e78b39a515d8 100644 (file)
--- a/less/dropdowns.less
+++ b/less/dropdowns.less
@@ -2,10 +2,6 @@
 // Dropdown menus
 // --------------------------------------------------
 
-// Remove the outline when :focus is triggered
-.open > a {
-  outline: 0;
-}
 
 // Dropdown arrow/caret
 // --------------------
@@ -107,9 +103,15 @@
 // Open state for the dropdown
 // ---------------------------
 .open {
-  & > .dropdown-menu {
+  // Show the menu
+  > .dropdown-menu {
     display: block;
   }
+
+  // Remove the outline when :focus is triggered
+  > a {
+    outline: 0;
+  }
 }
 
 // Right aligned dropdowns

diff --git a/less/navs.less b/less/navs.less
index 7e8bcf87c99468f87cdc90774a074946340d954f..5496778e532c0f90c71c1049c04a19900c00e7ac 100644 (file)
--- a/less/navs.less
+++ b/less/navs.less
@@ -28,17 +28,10 @@
       }
     }
 
-    // Nav states and addons
-    // --------------------------------------------------
-
-    // Disabled state
-    // -------------------------
-
-    // Gray out text
+    // Disabled state sets text to gray and nukes hover/tab effects
     &.disabled > a {
       color: @gray-light;
     }
-    // Nuke hover effects
     &.disabled > a:hover,
     &.disabled > a:focus {
       color: @gray-light;
@@ -46,10 +39,19 @@
       background-color: transparent;
       cursor: default;
     }
+
     // Space the headers out when they follow another list item (link)
     + .nav-header {
       margin-top: 9px;
     }
+
+    // Open dropdowns
+    &.open > a,
+    &.open > a:hover,
+    &.open > a:focus {
+      background-color: @link-color;
+      border-color: @link-color;
+    }
   }
 
   // Redeclare pull classes because of specifity
@@ -222,11 +224,69 @@
 // -------------------------
 
 .nav-tabs .dropdown-menu {
+  // make dropdown border overlap tab border
+  margin-top: -1px;
   // Remove the top rounded corners here since there is a hard edge above the menu
   .border-top-radius(0);
 }
 
 
+
+
+
+
+  // Make dropdown carets use link color in navs
+  .nav .caret {
+    border-top-color: @link-color;
+    border-bottom-color: @link-color;
+  }
+  .nav a:hover .caret {
+    border-top-color: @link-hover-color;
+    border-bottom-color: @link-hover-color;
+  }
+
+
+
+// Active dropdown links
+// -------------------------
+.nav .active .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
+}
+.nav-tabs .active .caret {
+  border-top-color: @gray;
+  border-bottom-color: @gray;
+}
+
+// Active:hover dropdown links
+// -------------------------
+.nav > .dropdown.active > a:hover {
+  cursor: pointer;
+}
+
+// Open dropdowns
+// -------------------------
+.nav-tabs .open > a,
+.nav-pills .open > a,
+.nav > li.dropdown.open.active > a:hover {
+  color: #fff;
+  background-color: @gray-light;
+  border-color: @gray-light;
+}
+.nav li.dropdown.open .caret,
+.nav li.dropdown.open.active .caret,
+.nav li.dropdown.open > a:hover .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
+  .opacity(1);
+}
+
+// Dropdowns in stacked tabs
+.tabs-stacked .open > a:hover {
+  border-color: @gray-light;
+}
+
+
 /*
 // Prevent IE8 from misplacing imgs
 // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989