]> git.ipfire.org Git - thirdparty/bootstrap.git/commitdiff
removing required .navbar-static class, rewrote docs to reflect the change, and updat...
authorMark Otto <markdotto@gmail.com>
Sun, 29 Jan 2012 07:40:52 +0000 (23:40 -0800)
committerMark Otto <markdotto@gmail.com>
Sun, 29 Jan 2012 07:40:52 +0000 (23:40 -0800)
docs/assets/css/bootstrap.css
docs/components.html
docs/templates/pages/components.mustache
docs/templates/pages/upgrading.mustache
docs/upgrading.html
less/navbar.less

index 37b774fb9436f1eb454234051268d9bfe1a03148..efd22199156ae36ded4125b8ccf22c5acd7efa9c 100644 (file)
@@ -2296,9 +2296,11 @@ button.btn.small, input[type="submit"].btn.small {
 }
 .navbar {
   overflow: visible;
+  margin-bottom: 18px;
 }
 .navbar-inner {
-  background-color: #222222;
+  padding-left: 20px;
+  padding-right: 20px;
   background-color: #2c2c2c;
   background-image: -moz-linear-gradient(top, #333333, #222222);
   background-image: -ms-linear-gradient(top, #333333, #222222);
@@ -2308,6 +2310,9 @@ button.btn.small, input[type="submit"].btn.small {
   background-image: linear-gradient(top, #333333, #222222);
   background-repeat: repeat-x;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
   -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
   -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
@@ -2452,16 +2457,6 @@ button.btn.small, input[type="submit"].btn.small {
   box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
   outline: 0;
 }
-.navbar-static {
-  margin-bottom: 18px;
-}
-.navbar-static .navbar-inner {
-  padding-left: 20px;
-  padding-right: 20px;
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  border-radius: 4px;
-}
 .navbar-fixed-top {
   position: fixed;
   top: 0;
@@ -2469,6 +2464,13 @@ button.btn.small, input[type="submit"].btn.small {
   left: 0;
   z-index: 1030;
 }
+.navbar-fixed-top .navbar-inner {
+  padding-left: 0;
+  padding-right: 0;
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0;
+}
 .navbar .nav {
   position: relative;
   left: 0;
index 7ba72f34daec6b18eb74e3f3c6acb145a94f3216..63a4b3dd08dd14d6ef4c9b3f2bf04bf63db8c7d7 100644 (file)
   </div>
   <h2>Static navbar example</h2>
   <p>An example of a static (not fixed to the top) navbar with project name, navigation, and search form.</p>
-  <div class="navbar navbar-static">
+  <div class="navbar">
     <div class="navbar-inner">
       <div class="container" style="width: auto;">
         <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
       <h3>Navbar scaffolding</h3>
       <p>The navbar requires only a few divs to structure it well for static or fixed display.</p>
 <pre class="prettyprint linenums">
-&lt;div class="navbar navbar-static"&gt;
+&lt;div class="navbar"&gt;
   &lt;div class="navbar-inner"&gt;
     &lt;div class="container"&gt;
       ...
   &lt;/div&gt;
 &lt;/div&gt;
 </pre>
-      <p>To make the navbar fixed, swap the <code>.navbar-static</code> class for <code>.navbar-fixed-top</code>. In your CSS, you will also need to account for the overlap it causes by adding <code>padding-top: 40px;</code> to your <code>&lt;body&gt;</code>.</p>
+      <p>To make the navbar fixed to the top of the viewport, add <code>.navbar-fixed-top</code> to the outermost div, <code>.navbar</code>. In your CSS, you will also need to account for the overlap it causes by adding <code>padding-top: 40px;</code> to your <code>&lt;body&gt;</code>.</p>
 <pre class="prettyprint linenums">
 &lt;div class="navbar navbar-fixed-top"&gt;
   ...
       <h3>Optional responsive variation</h3>
       <p>Depending on the amount of content in your topbar, you might want to implement the responsive options. To do so, wrap your nav content in a containing div, <code>.nav-collapse</code>, and add the navbar toggle button, <code>.btn-navbar</code>.</p>
 <pre class="prettyprint linenums">
-&lt;div class="navbar navbar-static"&gt;
+&lt;div class="navbar"&gt;
   &lt;div class="navbar-inner"&gt;
     &lt;div class="container"&gt;
       
index 11874b9f35e76a860a5b0c7dd186407c36a7a526..75ca3eb7e4e479016153299236c7f70c4e63f63d 100644 (file)
   </div>
   <h2>{{_i}}Static navbar example{{/i}}</h2>
   <p>{{_i}}An example of a static (not fixed to the top) navbar with project name, navigation, and search form.{{/i}}</p>
-  <div class="navbar navbar-static">
+  <div class="navbar">
     <div class="navbar-inner">
       <div class="container" style="width: auto;">
         <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
       <h3>{{_i}}Navbar scaffolding{{/i}}</h3>
       <p>{{_i}}The navbar requires only a few divs to structure it well for static or fixed display.{{/i}}</p>
 <pre class="prettyprint linenums">
-&lt;div class="navbar navbar-static"&gt;
+&lt;div class="navbar"&gt;
   &lt;div class="navbar-inner"&gt;
     &lt;div class="container"&gt;
       ...
   &lt;/div&gt;
 &lt;/div&gt;
 </pre>
-      <p>{{_i}}To make the navbar fixed, swap the <code>.navbar-static</code> class for <code>.navbar-fixed-top</code>. In your CSS, you will also need to account for the overlap it causes by adding <code>padding-top: 40px;</code> to your <code>&lt;body&gt;</code>.{{/i}}</p>
+      <p>{{_i}}To make the navbar fixed to the top of the viewport, add <code>.navbar-fixed-top</code> to the outermost div, <code>.navbar</code>. In your CSS, you will also need to account for the overlap it causes by adding <code>padding-top: 40px;</code> to your <code>&lt;body&gt;</code>.{{/i}}</p>
 <pre class="prettyprint linenums">
 &lt;div class="navbar navbar-fixed-top"&gt;
   ...
       <h3>{{_i}}Optional responsive variation{{/i}}</h3>
       <p>{{_i}}Depending on the amount of content in your topbar, you might want to implement the responsive options. To do so, wrap your nav content in a containing div, <code>.nav-collapse</code>, and add the navbar toggle button, <code>.btn-navbar</code>.{{/i}}</p>
 <pre class="prettyprint linenums">
-&lt;div class="navbar navbar-static"&gt;
+&lt;div class="navbar"&gt;
   &lt;div class="navbar-inner"&gt;
     &lt;div class="container"&gt;
       
index 2339b2e1cf800b57c51585a9c453b5aabb9275d3..95587456ac7f21fbb332d459e58dea04e43498e9 100644 (file)
     <li>{{_i}}Pills were restyled to be less rounded by default{{/i}}</li>
     <li>{{_i}}Pills now have dropdown menu support (they share the same markup and styles as tabs){{/i}}</li>
   </ul>
+  <h3>{{_i}}Navbar (formerly topbar){{/i}}</h3>
+  <ul>
+    <li>{{_i}}Base class changed from <code>.topbar</code> to <code>.navbar</code>{{/i}}</li>
+    <li>{{_i}}Now supports static position (default behavior, not fixed) and fixed to the top of viewport via <code>.navbar-fixed-top</code> (previously only supported fixed){{/i}}</li>
+    <li>{{_i}}Added vertical dividers to top-level nav{{/i}}</li>
+    <li>{{_i}}Improved support for inline forms in the navbar, which now require <code>.navbar-form</code> to properly scope styles to only the intended forms.{{/i}}</li>
+    <li>{{_i}}Navbar search form now requires use of the <code>.navbar-search</code> class and its input the use of <code>.search-query</code>. To position the search form, you <strong>must</strong> use <code>.pull-left</code> or <code>.pull-right</code>.{{/i}}</li>
+    <li>{{_i}}Added optional responsive markup for collapsing navbar contents for smaller resolutions and devices. <a href="./components.html#navbar">See navbar docs</a> for how to utilize.{{/i}}</li>
+  </ul>
   <h3>{{_i}}Dropdown menus{{/i}}</h3>
   <ul>
     <li>{{_i}}Updated the <code>.dropdown-menu</code> to tighten up spacing{{/i}}</li>
index c0778d9d072ee35c79c621b99a127f2ffbb51401..d7ad30f561de2344e171b895e83dde1044727679 100644 (file)
     <li>Pills were restyled to be less rounded by default</li>
     <li>Pills now have dropdown menu support (they share the same markup and styles as tabs)</li>
   </ul>
+  <h3>Navbar (formerly topbar)</h3>
+  <ul>
+    <li>Base class changed from <code>.topbar</code> to <code>.navbar</code></li>
+    <li>Now supports static position (default behavior, not fixed) and fixed to the top of viewport via <code>.navbar-fixed-top</code> (previously only supported fixed)</li>
+    <li>Added vertical dividers to top-level nav</li>
+    <li>Improved support for inline forms in the navbar, which now require <code>.navbar-form</code> to properly scope styles to only the intended forms.</li>
+    <li>Navbar search form now requires use of the <code>.navbar-search</code> class and its input the use of <code>.search-query</code>. To position the search form, you <strong>must</strong> use <code>.pull-left</code> or <code>.pull-right</code>.</li>
+    <li>Added optional responsive markup for collapsing navbar contents for smaller resolutions and devices. <a href="./components.html#navbar">See navbar docs</a> for how to utilize.</li>
+  </ul>
   <h3>Dropdown menus</h3>
   <ul>
     <li>Updated the <code>.dropdown-menu</code> to tighten up spacing</li>
index 404782e61adbc38a24b1250b74a43e5dd021365d..25ca7b4e28f594f64d3bc66f0262dcc17f50eac4 100644 (file)
@@ -7,11 +7,15 @@
 
 .navbar {
   overflow: visible;
+  margin-bottom: @baseLineHeight;
 }
-// gradient is applied to it's own element because overflow visible is not honored by IE when filter is present
+
+// Gradient is applied to it's own element because overflow visible is not honored by IE when filter is present
 .navbar-inner {
-  background-color: @navbarBackground;
+  padding-left:  20px;
+  padding-right: 20px;
   #gradient > .vertical(@navbarBackgroundHighlight, @navbarBackground);
+  .border-radius(4px);
   @shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1);
   .box-shadow(@shadow);
 }
 }
 
 
-// STATIC OR FIXED?
-// ----------------
-
-// Static navbar
-.navbar-static {
-  margin-bottom: @baseLineHeight;
-}
-.navbar-static .navbar-inner {
-  padding-left:  20px;
-  padding-right: 20px;
-  .border-radius(4px);
-}
+// FIXED NAVBAR
+// ------------
 
-// Fixed navbar
 .navbar-fixed-top {
   position: fixed;
   top: 0;
   left: 0;
   z-index: @zindexFixedNavbar;
 }
+.navbar-fixed-top .navbar-inner {
+  padding-left:  0;
+  padding-right: 0;
+  .border-radius(0);
+}
 
 
 // NAVIGATION