2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-11 18:02:28 +03:00

removing required .navbar-static class, rewrote docs to reflect the change, and updated the upgrade docs page to include the navbar section

This commit is contained in:
Mark Otto
2012-01-28 23:40:52 -08:00
parent 62f4a1571a
commit bca269299b
6 changed files with 52 additions and 34 deletions
+4 -4
View File
@@ -587,7 +587,7 @@
</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">
@@ -640,7 +640,7 @@
<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;
...
@@ -648,7 +648,7 @@
&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;
...
@@ -671,7 +671,7 @@
<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;
+9
View File
@@ -114,6 +114,15 @@
<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>