1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-21 04:41:36 +02:00

improve navbar vars and fix side nav alignment

This commit is contained in:
Mark Otto
2013-01-16 23:33:26 -08:00
parent 6b193dc22d
commit f535201781
4 changed files with 42 additions and 19 deletions

View File

@@ -2979,11 +2979,16 @@ button.close {
} }
.navbar-inverse .brand { .navbar-inverse .brand {
color: #fff; color: #999999;
} }
.navbar-inverse .brand:hover { .navbar-inverse .brand:hover {
background-color: #333; color: #808080;
background-color: transparent;
}
.navbar-inverse .navbar-text {
color: #999999;
} }
.navbar-inverse .nav > li > a { .navbar-inverse .nav > li > a {

View File

@@ -111,6 +111,13 @@ section > ul li {
color: rgba(255,255,255,.25); color: rgba(255,255,255,.25);
} }
/* Subhead (other docs pages)
------------------------- */
.subhead {
text-align: left;
}
/* Marketing section of Overview /* Marketing section of Overview
@@ -204,10 +211,10 @@ section > ul li {
/* From here, start to affix the nav because we keep columns here */ /* From here, start to affix the nav because we keep columns here */
.bs-docs-sidenav.affix { .bs-docs-sidenav.affix {
position: fixed; position: fixed;
top: 10px; top: 54px;
} }
.bs-docs-sidenav { .bs-docs-sidenav {
width: 189px; width: 170px;
} }
} }

View File

@@ -115,11 +115,17 @@
background-color: @navbar-inverse-bg; background-color: @navbar-inverse-bg;
.brand { .brand {
color: #fff; color: @navbar-inverse-brand-color;
&:hover { &:hover {
background-color: #333; color: @navbar-inverse-brand-color-hover;
background-color: @navbar-inverse-brand-bg-hover;
} }
} }
.navbar-text {
color: @navbar-inverse-text;
}
.nav > li > a { .nav > li > a {
color: @navbar-inverse-link-color; color: @navbar-inverse-link-color;
} }

View File

@@ -171,24 +171,29 @@
@navbar-link-bg-hover: transparent; @navbar-link-bg-hover: transparent;
@navbar-link-bg-active: darken(@navbar-bg, 10%); @navbar-link-bg-active: darken(@navbar-bg, 10%);
// Inverted navbar // Inverted navbar
@navbar-inverse-text: @grayLight;
@navbar-inverse-bg: #222; @navbar-inverse-bg: #222;
@navbar-inverse-text: @grayLight; // Inverted navbar brand label
@navbar-inverse-link-color: @grayLight; @navbar-inverse-brand-color: @navbar-inverse-link-color;
@navbar-inverse-link-color-hover: #fff; @navbar-inverse-brand-color-hover: darken(@navbar-inverse-link-color, 10%);
@navbar-inverse-link-color-active: @navbar-inverse-link-color-hover; @navbar-inverse-brand-bg-hover: transparent;
@navbar-inverse-link-bg-hover: transparent;
@navbar-inverse-link-bg-active: @navbar-inverse-bg;
@navbar-inverse-search-background: lighten(@navbar-inverse-bg, 25%); // Inverted navbar links
@navbar-inverse-search-background-focus: #fff; @navbar-inverse-link-color: @grayLight;
@navbar-inverse-search-border: @navbar-inverse-bg; @navbar-inverse-link-color-hover: #fff;
@navbar-inverse-search-placeholder-color: #ccc; @navbar-inverse-link-color-active: @navbar-inverse-link-color-hover;
@navbar-inverse-link-bg-hover: transparent;
@navbar-inverse-link-bg-active: @navbar-inverse-bg;
// Inverted navbar search
// Normal navbar needs no special styles or vars
@navbar-inverse-search-background: lighten(@navbar-inverse-bg, 25%);
@navbar-inverse-search-background-focus: #fff;
@navbar-inverse-search-border: @navbar-inverse-bg;
@navbar-inverse-search-placeholder-color: #ccc;
@navbar-inverse-brand-color: @navbar-inverse-link-color;
// Pagination // Pagination