From 39f8996d6a34ac2fab1bdf47db65fd9bde891308 Mon Sep 17 00:00:00 2001
From: Mark Otto <markotto@twitter.com>
Date: Tue, 17 Jul 2012 22:26:53 -0700
Subject: [PATCH] fix dropdown vars and make hover state be link color again,
 add gradient to dropdown link hovers, fix caret positions and active states
 on nav tabs, tweak nav link padding

---
 docs/assets/css/bootstrap.css | 39 +++++++++++++++++++++++++++++++----
 less/dropdowns.less           | 16 +++++++++++---
 less/navs.less                |  9 +++++++-
 less/variables.less           |  2 +-
 4 files changed, 57 insertions(+), 9 deletions(-)

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 3e79f94102..0226f24b5b 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -2623,7 +2623,7 @@ table .span24 {
 
 .dropdown-menu a {
   display: block;
-  padding: 3px 15px;
+  padding: 3px 20px;
   clear: both;
   font-weight: normal;
   line-height: 20px;
@@ -2633,9 +2633,17 @@ table .span24 {
 
 .dropdown-menu li > a:hover,
 .dropdown-menu li > a:focus {
-  color: #333333;
+  color: #ffffff;
   text-decoration: none;
-  background-color: #eeeeee;
+  background-color: #0088cc;
+  background-color: #0081c2;
+  background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
+  background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
+  background-image: -o-linear-gradient(top, #0088cc, #0077b3);
+  background-image: linear-gradient(to bottom, #0088cc, #0077b3);
+  background-repeat: repeat-x;
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
 }
 
 .dropdown-menu .active > a,
@@ -2643,7 +2651,15 @@ table .span24 {
   color: #ffffff;
   text-decoration: none;
   background-color: #0088cc;
+  background-color: #0081c2;
+  background-image: linear-gradient(to bottom, #0088cc, #0077b3);
+  background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
+  background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
+  background-image: -o-linear-gradient(top, #0088cc, #0077b3);
+  background-repeat: repeat-x;
   outline: 0;
+  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
 }
 
 .dropdown-menu .disabled > a,
@@ -2657,6 +2673,11 @@ table .span24 {
   background-color: transparent;
 }
 
+.dropdown .dropdown-menu .nav-header {
+  padding-right: 20px;
+  padding-left: 20px;
+}
+
 .open {
   *z-index: 1000;
 }
@@ -3659,13 +3680,23 @@ input[type="submit"].btn.btn-mini {
   border-bottom-color: #005580;
 }
 
+/* move down carets for tabs */
+
+.nav-tabs .dropdown-toggle .caret {
+  margin-top: 8px;
+}
+
 .nav .active .dropdown-toggle .caret {
   border-top-color: #fff;
   border-bottom-color: #fff;
 }
 
+.nav-tabs .active .dropdown-toggle .caret {
+  border-top-color: #555555;
+  border-bottom-color: #555555;
+}
+
 .nav > .dropdown.active > a:hover {
-  color: #fff;
   cursor: pointer;
 }
 
diff --git a/less/dropdowns.less b/less/dropdowns.less
index e9e91b6a4b..1e4f33ff6b 100644
--- a/less/dropdowns.less
+++ b/less/dropdowns.less
@@ -84,7 +84,7 @@
   // Links within the dropdown menu
   a {
     display: block;
-    padding: 3px 15px;
+    padding: 3px 20px;
     clear: both;
     font-weight: normal;
     line-height: @baseLineHeight;
@@ -98,8 +98,9 @@
 .dropdown-menu li > a:hover,
 .dropdown-menu li > a:focus {
   text-decoration: none;
-  color: @dropdownLinkColorActive;
+  color: @dropdownLinkColorHover;
   background-color: @dropdownLinkBackgroundHover;
+  #gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%));
 }
 
 // Active state
@@ -108,8 +109,9 @@
 .dropdown-menu .active > a:hover {
   color: @dropdownLinkColorHover;
   text-decoration: none;
-  background-color: @dropdownLinkBackgroundActive;
   outline: 0;
+  background-color: @dropdownLinkBackgroundActive;
+  #gradient > .vertical(@dropdownLinkBackgroundActive, darken(@dropdownLinkBackgroundActive, 5%));
 }
 
 // Disabled state
@@ -126,6 +128,14 @@
   cursor: default;
 }
 
+// Tweak nav headers
+// -----------------
+// Increase padding from 15px to 20px on sides
+.dropdown .dropdown-menu .nav-header {
+  padding-left: 20px;
+  padding-right: 20px;
+}
+
 // Open state for the dropdown
 // ---------------------------
 .open {
diff --git a/less/navs.less b/less/navs.less
index 33bdfe1d0f..799a38ce51 100644
--- a/less/navs.less
+++ b/less/navs.less
@@ -213,6 +213,10 @@
   border-top-color: @linkColorHover;
   border-bottom-color: @linkColorHover;
 }
+/* move down carets for tabs */
+.nav-tabs .dropdown-toggle .caret {
+  margin-top: 8px;
+}
 
 // Active dropdown links
 // -------------------------
@@ -220,11 +224,14 @@
   border-top-color: #fff;
   border-bottom-color: #fff;
 }
+.nav-tabs .active .dropdown-toggle .caret {
+  border-top-color: @gray;
+  border-bottom-color: @gray;
+}
 
 // Active:hover dropdown links
 // -------------------------
 .nav > .dropdown.active > a:hover {
-  color: #fff;
   cursor: pointer;
 }
 
diff --git a/less/variables.less b/less/variables.less
index 725100443b..ae5cd5e00b 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -109,7 +109,7 @@
 @dropdownLinkColor:             @grayDark;
 
 @dropdownLinkColorHover:        @white;
-@dropdownLinkBackgroundHover:   @grayLighter;
+@dropdownLinkBackgroundHover:   @dropdownLinkBackgroundActive;
 
 @dropdownLinkColorActive:       @dropdownLinkColor;
 @dropdownLinkBackgroundActive:  @linkColor;