0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-17 14:54:30 +01:00

address issues with fixed subnav like borders, corners, etc

This commit is contained in:
Mark Otto 2012-06-28 21:20:40 -07:00
parent 6f4360c47b
commit 98ebd54800
2 changed files with 26 additions and 18 deletions
docs/assets/css
less

@ -3987,7 +3987,7 @@ input[type="submit"].btn.btn-mini {
.navbar .nav > li > a { .navbar .nav > li > a {
float: none; float: none;
padding: 9px 12px 11px; padding: 10px 12px 11px;
line-height: 19px; line-height: 19px;
color: #999999; color: #999999;
text-decoration: none; text-decoration: none;
@ -4174,12 +4174,7 @@ input[type="submit"].btn.btn-mini {
/* Subnav navbar /* Subnav navbar
-------------------------------------------------- */ -------------------------------------------------- */
.navbar-subnav {
height: 36px;
}
.navbar-subnav .navbar-inner { .navbar-subnav .navbar-inner {
min-height: 36px;
padding: 0; padding: 0;
background-color: #f6f6f6; background-color: #f6f6f6;
background-image: -moz-linear-gradient(top, #f9f9f9, #f1f1f1); background-image: -moz-linear-gradient(top, #f9f9f9, #f1f1f1);
@ -4204,6 +4199,12 @@ input[type="submit"].btn.btn-mini {
color: #005580; color: #005580;
} }
.navbar-subnav .nav > .active > a,
.navbar-subnav .nav > .active > a:hover {
color: #777;
background-color: #e5e5e5;
}
.navbar-subnav .nav li.dropdown .dropdown-toggle .caret, .navbar-subnav .nav li.dropdown .dropdown-toggle .caret,
.navbar-subnav .nav li.dropdown.open .caret { .navbar-subnav .nav li.dropdown.open .caret {
border-top-color: #0088cc; border-top-color: #0088cc;
@ -4220,15 +4221,18 @@ input[type="submit"].btn.btn-mini {
right: 0; right: 0;
left: 0; left: 0;
z-index: 1020; z-index: 1020;
-webkit-box-shadow: inset 0 1px 0 #ffffff, 0 1px 10px rgba(0, 0, 0, 0.1);
-moz-box-shadow: inset 0 1px 0 #ffffff, 0 1px 10px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 1px 0 #ffffff, 0 1px 10px rgba(0, 0, 0, 0.1);
}
.navbar-subnav-fixed .navbar-inner {
border-color: #d5d5d5; border-color: #d5d5d5;
border-width: 0 0 1px; border-width: 0 0 1px;
-webkit-border-radius: 0; -webkit-border-radius: 0;
-moz-border-radius: 0; -moz-border-radius: 0;
border-radius: 0; border-radius: 0;
filter: progid:dximagetransform.microsoft.gradient(enabled=false); filter: progid:dximagetransform.microsoft.gradient(enabled=false);
-webkit-box-shadow: inset 0 1px 0 #ffffff, 0 1px 10px rgba(0, 0, 0, 0.1);
-moz-box-shadow: inset 0 1px 0 #ffffff, 0 1px 10px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 1px 0 #ffffff, 0 1px 10px rgba(0, 0, 0, 0.1);
} }
.navbar-subnav-fixed .nav { .navbar-subnav-fixed .nav {

@ -205,7 +205,7 @@
float: none; float: none;
// Vertically center the text given @navbarHeight // Vertically center the text given @navbarHeight
@elementHeight: 20px; @elementHeight: 20px;
padding: ((@navbarHeight - @elementHeight) / 2 - 1) 12px ((@navbarHeight - @elementHeight) / 2 + 1); padding: ((@navbarHeight - @elementHeight) / 2) 12px ((@navbarHeight - @elementHeight) / 2 + 1);
line-height: 19px; line-height: 19px;
color: @navbarLinkColor; color: @navbarLinkColor;
text-decoration: none; text-decoration: none;
@ -379,10 +379,8 @@
// Override the default .navbar // Override the default .navbar
.navbar-subnav { .navbar-subnav {
height: 36px;
} }
.navbar-subnav .navbar-inner { .navbar-subnav .navbar-inner {
min-height: 36px;
padding: 0; padding: 0;
#gradient > .vertical(#f9f9f9, #f1f1f1); #gradient > .vertical(#f9f9f9, #f1f1f1);
.box-shadow(none); .box-shadow(none);
@ -398,6 +396,13 @@
color: @linkColorHover; color: @linkColorHover;
} }
// Active nav links
.navbar-subnav .nav > .active > a,
.navbar-subnav .nav > .active > a:hover {
color: #777;
background-color: #e5e5e5;
}
// Dropdown carets // Dropdown carets
.navbar-subnav .nav li.dropdown .dropdown-toggle .caret, .navbar-subnav .nav li.dropdown .dropdown-toggle .caret,
.navbar-subnav .nav li.dropdown.open .caret { .navbar-subnav .nav li.dropdown.open .caret {
@ -410,7 +415,6 @@
color: @linkColorHover; color: @linkColorHover;
} }
// Fixed subnav on scroll, but only for 980px and up (sorry IE!) // Fixed subnav on scroll, but only for 980px and up (sorry IE!)
.navbar-subnav-fixed { .navbar-subnav-fixed {
position: fixed; position: fixed;
@ -418,15 +422,15 @@
left: 0; left: 0;
right: 0; right: 0;
z-index: 1020; /* 10 less than .navbar-fixed to prevent any overlap */ z-index: 1020; /* 10 less than .navbar-fixed to prevent any overlap */
border-color: #d5d5d5;
border-width: 0 0 1px; /* drop the border on the fixed edges */
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
-webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 10px rgba(0,0,0,.1); -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 10px rgba(0,0,0,.1);
-moz-box-shadow: inset 0 1px 0 #fff, 0 1px 10px rgba(0,0,0,.1); -moz-box-shadow: inset 0 1px 0 #fff, 0 1px 10px rgba(0,0,0,.1);
box-shadow: inset 0 1px 0 #fff, 0 1px 10px rgba(0,0,0,.1); box-shadow: inset 0 1px 0 #fff, 0 1px 10px rgba(0,0,0,.1);
}
.navbar-subnav-fixed .navbar-inner {
border-color: #d5d5d5;
border-width: 0 0 1px; /* drop the border on the fixed edges */
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); /* IE6-9 */ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); /* IE6-9 */
.border-radius(0);
} }
.navbar-subnav-fixed .nav { .navbar-subnav-fixed .nav {
float: none; float: none;