aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2012-07-17 22:26:53 -0700
committerMark Otto <[email protected]>2012-07-17 22:26:53 -0700
commit39f8996d6a34ac2fab1bdf47db65fd9bde891308 (patch)
tree600ec1a8b305516ede999327496af01deeba2cb3
parent6a663081a78b2810e7b3904949cfc5a91df81eff (diff)
downloadbootstrap-39f8996d6a34ac2fab1bdf47db65fd9bde891308.tar.xz
bootstrap-39f8996d6a34ac2fab1bdf47db65fd9bde891308.zip
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
-rw-r--r--docs/assets/css/bootstrap.css39
-rw-r--r--less/dropdowns.less16
-rw-r--r--less/navs.less9
-rw-r--r--less/variables.less2
4 files changed, 57 insertions, 9 deletions
diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 3e79f9410..0226f24b5 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 e9e91b6a4..1e4f33ff6 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 33bdfe1d0..799a38ce5 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 725100443..ae5cd5e00 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;