rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-28 00:54:30 +01:00
Code Issues Actions Packages Releases Activity

More navbar tweaks, including making fixed navbars work in the docs by adding padding to body

Browse Source
This commit is contained in:
Mark Otto 2013-01-16 16:20:29 -08:00
parent 9ba14cfb7c
commit 6b193dc22d
3 changed files with 18 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
docs/assets/css/bootstrap.css vendored
View File

@ -2882,7 +2882,7 @@ button.close {
.navbar .brand { .navbar .brand {
display: inline-block; display: inline-block;
padding: 15px 15px; padding: 7px 15px;
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
line-height: 20px; line-height: 20px;
@ -2919,10 +2919,6 @@ button.close {
margin-top: 15px; margin-top: 15px;
} }
.navbar .nav > li {
float: left;
}
.navbar .nav > li > a { .navbar .nav > li > a {
padding-top: 15px; padding-top: 15px;
padding-bottom: 15px; padding-bottom: 15px;
@ -2943,13 +2939,15 @@ button.close {
background-color: #d5d5d5; background-color: #d5d5d5;
} }
@media screen and (min-width: 992px) { @media screen and (min-width: 768px) {
.navbar { .navbar {
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
} }
.navbar .brand { .navbar .brand {
float: left; float: left;
padding-top: 15px;
padding-bottom: 15px;
margin-left: -15px; margin-left: -15px;
} }
.navbar .nav { .navbar .nav {
@ -2963,6 +2961,9 @@ button.close {
.navbar .nav:after { .navbar .nav:after {
clear: both; clear: both;
} }
.navbar .nav > li {
float: left;
}
.navbar .btn-navbar { .navbar .btn-navbar {
display: none; display: none;
} }

4
docs/assets/css/docs.css
View File

@ -10,6 +10,7 @@
body { body {
position: relative; /* For scrollyspy */ position: relative; /* For scrollyspy */
padding-top: 62px; /* Default height of navbar */
} }
/* */ /* */
@ -197,6 +198,9 @@ section > ul li {
/* Affix all the things, and set widths because they're positioned, depending on viewport size */ /* Affix all the things, and set widths because they're positioned, depending on viewport size */
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
body {
padding-top: 44px;
}
/* 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;

12
less/navbar.less
View File

@ -16,7 +16,7 @@
.navbar .brand { .navbar .brand {
display: inline-block; display: inline-block;
padding: ((@navbar-height - @line-height-base) / 2) 15px; padding: 7px 15px;
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
line-height: @line-height-base; line-height: @line-height-base;
@ -58,9 +58,6 @@
.nav { .nav {
margin-top: 15px; // space out from .navbar .brand and .btn-navbar margin-top: 15px; // space out from .navbar .brand and .btn-navbar
} }
.nav > li {
float: left;
}
.nav > li > a { .nav > li > a {
padding-top: (@navbar-height - @line-height-base) / 2; padding-top: (@navbar-height - @line-height-base) / 2;
padding-bottom: (@navbar-height - @line-height-base) / 2; padding-bottom: (@navbar-height - @line-height-base) / 2;
@ -79,7 +76,7 @@
background-color: @navbar-link-bg-active; background-color: @navbar-link-bg-active;
} }
} }
@media screen and (min-width: 992px) { @media screen and (min-width: 768px) {
.navbar { .navbar {
padding-top: 0; padding-top: 0;
@ -87,12 +84,17 @@
} }
.navbar .brand { .navbar .brand {
float: left; float: left;
padding-top: (@navbar-height - @line-height-base) / 2;
padding-bottom: (@navbar-height - @line-height-base) / 2;
margin-left: -15px; margin-left: -15px;
} }
.navbar .nav { .navbar .nav {
.clear_float(); .clear_float();
margin-top: 0; // undo top margin to make nav extend full height of navbar margin-top: 0; // undo top margin to make nav extend full height of navbar
} }
.navbar .nav > li {
float: left;
}
// Required to make the collapsing navbar work on regular desktops // Required to make the collapsing navbar work on regular desktops
.navbar .btn-navbar { .navbar .btn-navbar {