Commit 6b193dc2 authored by Mark Otto's avatar Mark Otto
Browse files

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

parent 9ba14cfb
Showing with 18 additions and 11 deletions
+18 -11
...@@ -2882,7 +2882,7 @@ button.close { ...@@ -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 { ...@@ -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 { ...@@ -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 { ...@@ -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;
} }
......
...@@ -10,6 +10,7 @@ ...@@ -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 { ...@@ -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;
......
...@@ -16,7 +16,7 @@ ...@@ -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 @@ ...@@ -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 @@ ...@@ -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 @@ ...@@ -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 {
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment