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

3 files changed, 18 insertions, 11 deletions

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 70eaace26..d1feacac1 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -2882,7 +2882,7 @@ button.close {
 
 .navbar .brand {
   display: inline-block;
-  padding: 15px 15px;
+  padding: 7px 15px;
   font-size: 18px;
   font-weight: bold;
   line-height: 20px;
@@ -2919,10 +2919,6 @@ button.close {
   margin-top: 15px;
 }
 
-.navbar .nav > li {
-  float: left;
-}
-
 .navbar .nav > li > a {
   padding-top: 15px;
   padding-bottom: 15px;
@@ -2943,13 +2939,15 @@ button.close {
   background-color: #d5d5d5;
 }
 
-@media screen and (min-width: 992px) {
+@media screen and (min-width: 768px) {
   .navbar {
     padding-top: 0;
     padding-bottom: 0;
   }
   .navbar .brand {
     float: left;
+    padding-top: 15px;
+    padding-bottom: 15px;
     margin-left: -15px;
   }
   .navbar .nav {
@@ -2963,6 +2961,9 @@ button.close {
   .navbar .nav:after {
     clear: both;
   }
+  .navbar .nav > li {
+    float: left;
+  }
   .navbar .btn-navbar {
     display: none;
   }
diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index 38fd87a44..4e52cdf61 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -10,6 +10,7 @@
 
 body {
   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 */
 @media screen and (min-width: 768px) {
+  body {
+    padding-top: 44px;
+  }
   /* From here, start to affix the nav because we keep columns here */
   .bs-docs-sidenav.affix {
     position: fixed;
diff --git a/less/navbar.less b/less/navbar.less
index 4353e2a94..7e4b56935 100644
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -16,7 +16,7 @@
 
 .navbar .brand {
   display: inline-block;
-  padding: ((@navbar-height - @line-height-base) / 2) 15px;
+  padding: 7px 15px;
   font-size: 18px;
   font-weight: bold;
   line-height: @line-height-base;
@@ -58,9 +58,6 @@
   .nav {
     margin-top: 15px; // space out from .navbar .brand and .btn-navbar
   }
-  .nav > li {
-    float: left;
-  }
   .nav > li > a {
     padding-top: (@navbar-height - @line-height-base) / 2;
     padding-bottom: (@navbar-height - @line-height-base) / 2;
@@ -79,7 +76,7 @@
     background-color: @navbar-link-bg-active;
   }
 }
-@media screen and (min-width: 992px) {
+@media screen and (min-width: 768px) {
 
   .navbar {
     padding-top: 0;
@@ -87,12 +84,17 @@
   }
   .navbar .brand {
     float: left;
+    padding-top: (@navbar-height - @line-height-base) / 2;
+    padding-bottom: (@navbar-height - @line-height-base) / 2;
     margin-left: -15px;
   }
   .navbar .nav {
     .clear_float();
     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
   .navbar .btn-navbar {