]> git.ipfire.org Git - thirdparty/bootstrap.git/commitdiff
fix static navbar container issues, clean up docs presentation by unfixing the top...
authorMark Otto <markotto@twitter.com>
Mon, 20 Aug 2012 04:12:52 +0000 (21:12 -0700)
committerMark Otto <markotto@twitter.com>
Mon, 20 Aug 2012 04:12:52 +0000 (21:12 -0700)
18 files changed:
docs/assets/css/bootstrap-responsive.css
docs/assets/css/bootstrap.css
docs/assets/css/docs.css
docs/base-css.html
docs/components.html
docs/customize.html
docs/extend.html
docs/getting-started.html
docs/index.html
docs/javascript.html
docs/scaffolding.html
docs/templates/layout.mustache
docs/templates/pages/base-css.mustache
docs/templates/pages/javascript.mustache
less/mixins.less
less/navbar.less
less/scaffolding.less
less/utilities.less

index 394a15b4a54b538b162390929819e47780e87b0a..821c9603fd147030c01d926463a03ea07ffde06e 100644 (file)
     margin-left: 30px;
   }
   .container,
+  .navbar-static-top .container,
   .navbar-fixed-top .container,
   .navbar-fixed-bottom .container {
     width: 1170px;
     margin-left: 20px;
   }
   .container,
+  .navbar-static-top .container,
   .navbar-fixed-top .container,
   .navbar-fixed-bottom .container {
     width: 724px;
index 38829e7d5e60d5048d53a544d9b3aa840c33bfb1..3c16ef2f56baff092d03238a3a8b6a11ba4d1b66 100644 (file)
@@ -219,6 +219,7 @@ a:hover {
 }
 
 .container,
+.navbar-static-top .container,
 .navbar-fixed-top .container,
 .navbar-fixed-bottom .container {
   width: 940px;
@@ -4172,7 +4173,8 @@ input[type="submit"].btn.btn-mini {
 }
 
 .navbar-fixed-top .navbar-inner,
-.navbar-fixed-bottom .navbar-inner {
+.navbar-fixed-bottom .navbar-inner,
+.navbar-static-top .navbar-inner {
   border: 0;
 }
 
@@ -4185,6 +4187,7 @@ input[type="submit"].btn.btn-mini {
           border-radius: 0;
 }
 
+.navbar-static-top .container,
 .navbar-fixed-top .container,
 .navbar-fixed-bottom .container {
   width: 940px;
@@ -4194,7 +4197,8 @@ input[type="submit"].btn.btn-mini {
   top: 0;
 }
 
-.navbar-fixed-top .navbar-inner {
+.navbar-fixed-top .navbar-inner,
+.navbar-static-top .navbar-inner {
   -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 10px rgba(0, 0, 0, 0.1);
      -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 10px rgba(0, 0, 0, 0.1);
           box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1), 0 1px 10px rgba(0, 0, 0, 0.1);
index e12f46a991baa13a075fdd7b7b0cc1cba9e4bd83..2801efe5e94daf0a142cdd1264f5dd4af6a01b8f 100644 (file)
@@ -12,7 +12,6 @@
 
 body {
   position: relative;
-  padding-top: 40px;
 }
 
 /* Code in headings */
@@ -26,12 +25,12 @@ h3 code {
 /* Tweak navbar brand link to be super sleek
 -------------------------------------------------- */
 
-body > .navbar-fixed-top {
+body > .navbar-static-top {
   font-size: 13px;
 }
 
 /* Change the docs' brand */
-body > .navbar-fixed-top .brand {
+body > .navbar-static-top .brand {
   padding-right: 0;
   padding-left: 0;
   margin-left: 20px;
@@ -43,7 +42,7 @@ body > .navbar-fixed-top .brand {
      -moz-transition: all .2s linear;
           transition: all .2s linear;
 }
-body > .navbar-fixed-top .brand:hover {
+body > .navbar-static-top .brand:hover {
   text-decoration: none;
   text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.4);
 }
@@ -54,7 +53,7 @@ body > .navbar-fixed-top .brand:hover {
 
 /* padding for in-page bookmarks and fixed navbar */
 section {
-  padding-top: 60px;
+  padding-top: 30px;
 }
 section > .page-header,
 section > .lead {
@@ -759,10 +758,9 @@ form.bs-docs-example {
 }
 
 .bs-docs-sidenav {
-  width: 218px;
+  width: 228px;
   margin-top: 30px;
   padding: 0;
-  margin-right: 10px;
   background-color: #fff;
   margin-left: 0;
   -webkit-border-radius: 6px;
@@ -790,9 +788,13 @@ form.bs-docs-example {
           border-radius: 0 0 6px 6px;
 }
 .bs-docs-sidenav > .active > a {
-  border-color: #08c;
   position: relative;
   z-index: 2;
+  padding: 9px 15px;
+  border: 0;
+  -webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
+     -moz-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
+          box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
 }
 /* Chevrons */
 .bs-docs-sidenav .icon-chevron-right {
@@ -807,12 +809,13 @@ form.bs-docs-example {
 .bs-docs-sidenav a:hover .icon-chevron-right {
   opacity: .5;
 }
-.bs-docs-sidenav .active .icon-chevron-right {
+.bs-docs-sidenav .active .icon-chevron-right,
+.bs-docs-sidenav .active a:hover .icon-chevron-right {
   background-image: url(../img/glyphicons-halflings-white.png);
   opacity: .75;
 }
 .bs-docs-sidenav.affix {
-  top: 40px;
+  top: 0;
 }
 .bs-docs-sidenav.affix-bottom {
   position: absolute;
@@ -869,18 +872,11 @@ form.bs-docs-example {
   body {
     padding-top: 0;
   }
-  /* Widen masthead and social buttons to fill body padding */
-  .jumbotron {
-    margin-top: -20px; /* Offset bottom margin on .navbar */
-  }
   /* Adjust sidenav width */
   .bs-docs-sidenav {
     width: 166px;
     margin-top: 20px;
   }
-  .bs-docs-sidenav.affix {
-    top: 0;
-  }
 }
 
 /* Tablet
@@ -936,9 +932,6 @@ form.bs-docs-example {
   .footer p {
     margin-bottom: 9px;
   }
-  .bs-docs-sidenav.affix {
-    top: 0;
-  }
 }
 
 /* Landscape phones
index df5df2402756a2b1c231a40255ce91391f3def52..95267c5b5f78fa430eeb61127d2e5a196b030e3d 100644 (file)
 
   </head>
 
-  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
+  <body data-spy="scroll" data-target=".bs-docs-sidebar">
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-static-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
             <h1>Typography</h1>
           </div>
 
-          <h2>Headings</h2>
+          <ul>
+            <li><a href="./base-css.html#headings">Headings</a></li>
+            <li><a href="./base-css.html#body-copy">Body copy</a></li>
+            <li><a href="./base-css.html#emphasis">Emphasis</a></li>
+          </ul>
+
+          <hr>
+
+          <h2 id="headings">Headings</h2>
           <p>All HTML headings, <code>&lt;h1&gt;</code> through <code>&lt;h6&gt;</code> are available.</p>
           <div class="bs-docs-example">
             <h1>h1. Heading 1</h1>
             <h6>h6. Heading 6</h6>
           </div>
 
-          <h2>Body copy</h2>
+          <h2 id="body-copy">Body copy</h2>
           <p>Bootstrap's global default <code>font-size</code> is <strong>14px</strong>, with a <code>line-height</code> of <strong>20px</strong>. This is applied to the <code>&lt;body&gt;</code> and all paragraphs. In addition, <code>&lt;p&gt;</code> (paragraphs) receive a bottom margin of half their line-height (9px by default).</p>
           <div class="bs-docs-example">
             <p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p>
           </div>
           <pre class="prettyprint">&lt;p class="lead"&gt;...&lt;/p&gt;</pre>
 
-          <h2>Built with Less</h2>
+          <h3>Built with Less</h3>
           <p>The typographic scale is based on two LESS variables in <strong>variables.less</strong>: <code>@baseFontSize</code> and <code>@baseLineHeight</code>. The first is the base font-size used throughout and the second is the base line-height. We use those variables and some simple math to create the margins, paddings, and line-heights of all our type and more. Customize them and Bootstrap adapts.</p>
 
 
           <hr class="bs-docs-separator">
 
 
-          <h2>Emphasis</h2>
+          <h2 id="emphasis">Emphasis</h2>
           <p>Make use of HTML's default emphasis tags with lightweight styles.</p>
 
           <h3><code>&lt;small&gt;</code></h3>
index 6312a3041ed6cb50b667b7ebf65acd8bda228f5b..40f1457560da4ef671469a8c6b685c333aaa885d 100644 (file)
 
   </head>
 
-  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
+  <body data-spy="scroll" data-target=".bs-docs-sidebar">
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-static-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
index b2468519662ebb560a211d4818a7a655a9f589ca..8d6a59cd93e936aced46b6e2c39aa70031c0d6cc 100644 (file)
 
   </head>
 
-  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
+  <body data-spy="scroll" data-target=".bs-docs-sidebar">
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-static-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
index 1c6447b3e2b454b7d74ff4fffc27b679321f8aa9..f5a194702b317f4b0aa49aa1036511b11aa2d0d0 100644 (file)
 
   </head>
 
-  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
+  <body data-spy="scroll" data-target=".bs-docs-sidebar">
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-static-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
index 6323f2cfa0818931c1eefba80b9ebc06eacbfe3e..ac38f3863821e48f1f424eddeaf9f0ce6d75583a 100644 (file)
 
   </head>
 
-  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
+  <body data-spy="scroll" data-target=".bs-docs-sidebar">
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-static-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
index 3233287ed63fa3353d6e79f8b5b108f6758a1dde..efc82d55cf416bfd31c44ea1f413ab4123133e76 100644 (file)
 
   </head>
 
-  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
+  <body data-spy="scroll" data-target=".bs-docs-sidebar">
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-static-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
index 4a4fb41eb22bc7e29074d689b65b7c52ba71da30..7ac86841ff79f728bf800c95397d7ed73bcf61ad 100644 (file)
 
   </head>
 
-  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
+  <body data-spy="scroll" data-target=".bs-docs-sidebar">
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-static-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
@@ -71,7 +71,7 @@
 
 <!-- Subhead
 ================================================== -->
-<header class="jumbotron subhead" id="overview">
+<header class="jumbotron subhead">
   <div class="container">
     <h1>JavaScript for Bootstrap</h1>
     <p class="lead">Bring Bootstrap's components to life&mdash;now with 13 custom jQuery plugins.
index b8b663a7c1b64cd160f9842ea231ce522e5b0034..c30d1776495eefc266737fd2780b77ef91484be6 100644 (file)
 
   </head>
 
-  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
+  <body data-spy="scroll" data-target=".bs-docs-sidebar">
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-static-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
index eb4cc9ef422c4e4ba450b02dc21c761b2a5fc6f0..f98f31897608d8bd2d03e4760b9d54ba49d79355 100644 (file)
     {{/production}}
   </head>
 
-  <body data-spy="scroll" data-target=".bs-docs-sidebar" data-offset="10">
+  <body data-spy="scroll" data-target=".bs-docs-sidebar">
 
     <!-- Navbar
     ================================================== -->
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar navbar-inverse navbar-static-top">
       <div class="navbar-inner">
         <div class="container">
           <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
index d1d8691ba15f95fb1234bd5517c0d59e9b736796..53ded2d8738d353b951adfd76daf9b431a91f683 100644 (file)
             <h1>{{_i}}Typography{{/i}}</h1>
           </div>
 
+          <ul>
+            <li><a href="./base-css.html#headings">Headings</a></li>
+            <li><a href="./base-css.html#body-copy">Body copy</a></li>
+            <li><a href="./base-css.html#emphasis">Emphasis</a></li>
+          </ul>
+
+          <hr>
+
           {{! Headings }}
-          <h2>{{_i}}Headings{{/i}}</h2>
+          <h2 id="headings">{{_i}}Headings{{/i}}</h2>
           <p>{{_i}}All HTML headings, <code>&lt;h1&gt;</code> through <code>&lt;h6&gt;</code> are available.{{/i}}</p>
           <div class="bs-docs-example">
             <h1>h1. {{_i}}Heading 1{{/i}}</h1>
@@ -48,7 +56,7 @@
           </div>
 
           {{! Body copy }}
-          <h2>{{_i}}Body copy{{/i}}</h2>
+          <h2 id="body-copy">{{_i}}Body copy{{/i}}</h2>
           <p>{{_i}}Bootstrap's global default <code>font-size</code> is <strong>14px</strong>, with a <code>line-height</code> of <strong>20px</strong>. This is applied to the <code>&lt;body&gt;</code> and all paragraphs. In addition, <code>&lt;p&gt;</code> (paragraphs) receive a bottom margin of half their line-height (9px by default).{{/i}}</p>
           <div class="bs-docs-example">
             <p>Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.</p>
@@ -66,7 +74,7 @@
           <pre class="prettyprint">&lt;p class="lead"&gt;...&lt;/p&gt;</pre>
 
           {{! Using LESS }}
-          <h2>{{_i}}Built with Less{{/i}}</h2>
+          <h3>{{_i}}Built with Less{{/i}}</h3>
           <p>{{_i}}The typographic scale is based on two LESS variables in <strong>variables.less</strong>: <code>@baseFontSize</code> and <code>@baseLineHeight</code>. The first is the base font-size used throughout and the second is the base line-height. We use those variables and some simple math to create the margins, paddings, and line-heights of all our type and more. Customize them and Bootstrap adapts.{{/i}}</p>
 
 
@@ -74,7 +82,7 @@
 
 
           {{! Emphasis }}
-          <h2>{{_i}}Emphasis{{/i}}</h2>
+          <h2 id="emphasis">{{_i}}Emphasis{{/i}}</h2>
           <p>{{_i}}Make use of HTML's default emphasis tags with lightweight styles.{{/i}}</p>
 
           <h3><code>&lt;small&gt;</code></h3>
index ccec7eb24e8ad86b06bd9305445c039017b42bf3..c9e1b612b058bf9d18129c8d937eb35d69a50228 100644 (file)
@@ -1,6 +1,6 @@
 <!-- Subhead
 ================================================== -->
-<header class="jumbotron subhead" id="overview">
+<header class="jumbotron subhead">
   <div class="container">
     <h1>{{_i}}JavaScript for Bootstrap{{/i}}</h1>
     <p class="lead">{{_i}}Bring Bootstrap's components to life&mdash;now with 13 custom jQuery plugins.{{/i}}
index 68fbb5829b8de552c215172d6dcfb1d99a9e91b1..b6352831fa45ac7de1c66256da55b8c33ebcddcc 100644 (file)
 
     // Set the container width, and override it for fixed navbars in media queries
     .container,
+    .navbar-static-top .container,
     .navbar-fixed-top .container,
     .navbar-fixed-bottom .container { .span(@gridColumns); }
 
index 3a7e074b29c0b74b88619e44a15f79bc3c023d86..70501e4595919305e283d6929ba391022698e092 100644 (file)
   left: 0;
   z-index: @zindexFixedNavbar;
   margin-bottom: 0; // remove 18px margin for default navbar
+}
+.navbar-fixed-top,
+.navbar-fixed-bottom,
+.navbar-static-top {
   .navbar-inner {
     border: 0;
   }
 }
 
 // Reset container width
+// Required here as we reset the width earlier on and the grid mixins don't override early enough
+.navbar-static-top .container,
 .navbar-fixed-top .container,
 .navbar-fixed-bottom .container {
   #grid > .core > .span(@gridColumns);
 // Fixed to top
 .navbar-fixed-top {
   top: 0;
+}
+.navbar-fixed-top,
+.navbar-static-top {
   .navbar-inner {
     .box-shadow(~"inset 0 -1px 0 rgba(0,0,0,.1), 0 1px 10px rgba(0,0,0,.1)");
   }
index fe63c7cacddaf67d7e9f14e0fc3713ab9d4ff629..342dcf70516c6dcb08607c3c8b2a7615a27a4417 100644 (file)
@@ -48,4 +48,4 @@ a:hover {
 
 .img-circle {
   .border-radius(500px);
-}
\ No newline at end of file
+}
index 5eef70fe7f898de89505a2300392d8e35ca45ce7..314b4ffdb45acbb991eedc0782a800535e73b051 100644 (file)
@@ -24,6 +24,7 @@
   visibility: hidden;
 }
 
+// For Affix plugin
 .affix {
   position: fixed;
-}
\ No newline at end of file
+}