Commit 62df3858 authored by Mark Otto's avatar Mark Otto
Browse files

navbar links in sidenav

parent 171c7fea
11 merge requests!8635ignore Gruntfile.js in jekyll,!8339Fix broken links to navbar component in docs examples,!7674Clear float on all when navbar is collapsed - v3,!7775added some tests for tooltip title setter,!8157Close Me: Docs "Customize and Download" button fix,!7964commit fixes #7792,!8656Added rel="stylesheet" to CDN-Examples,!8527Inner properties move 1,!8245Interactive color picker - Closed: request against wrong branch,!7865Patch 2,!7651Drop the sizzle dependency to allow smaller builds targeting mobile devices
Showing with 15 additions and 14 deletions
+15 -14
......@@ -117,12 +117,13 @@
<li>
<a href="#navbar">Navbar</a>
<ul class="nav">
<li><a href="#navbar-"></a></li>
<li><a href="#navbar-"></a></li>
<li><a href="#navbar-"></a></li>
<li><a href="#navbar-"></a></li>
<li><a href="#navbar-"></a></li>
<li><a href="#navbar-"></a></li>
<li><a href="#navbar-basic">Basic navbar</a></li>
<li><a href="#navbar-nav">Nav links</a></li>
<li><a href="#navbar-forms">Forms in navbars</a></li>
<li><a href="#navbar-fixed-top">Fixed top navbar</a></li>
<li><a href="#navbar-fixed-bottom">Fixed bottom navbar</a></li>
<li><a href="#navbar-static-top">Static top navbar</a></li>
<li><a href="#navbar-responsive">Responsive navbar</a></li>
</ul>
</li>
<li><a href="#breadcrumbs">Breadcrumbs</a></li>
......
......@@ -3277,7 +3277,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</div>
<h2>Basic navbar</h2>
<h2 id="navbar-basic">Basic navbar</h2>
<p>To start, navbars are static (not fixed to the top) and include support for a project name and basic navigation. Place one anywhere within a <code>.container</code>, which sets the width of your site and content.</p>
<div class="bs-docs-example">
<div class="navbar">
......@@ -3302,7 +3302,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<h2>Navbar components</h2>
<h3>Brand</h3>
<h3 id="navbar-brand">Brand</h3>
<p>A simple link to show your brand or project name only requires an anchor tag.</p>
<div class="bs-docs-example">
<div class="navbar">
......@@ -3313,7 +3313,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<a class="navbar-brand" href="#">Title</a>
{% endhighlight %}
<h3>Nav links</h3>
<h3 id="navbar-nav">Nav links</h3>
<p>Nav items are simple to add via unordered lists.</p>
<div class="bs-docs-example">
<div class="navbar">
......@@ -3352,7 +3352,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</ul>
{% endhighlight %}
<h3>Forms</h3>
<h3 id="navbar-forms">Forms</h3>
<p>To properly style and position a form within the navbar, add the appropriate classes as shown below. For a default form, include <code>.navbar-form</code> and either <code>.pull-left</code> or <code>.pull-right</code> to properly align it.</p>
<div class="bs-docs-example">
<div class="navbar">
......@@ -3382,7 +3382,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<h2>Optional display variations</h2>
<p>Fix the navbar to the top or bottom of the viewport with an additional class on the outermost div, <code>.navbar</code>.</p>
<h3>Fixed to top</h3>
<h3 id="navbar-fixed-top">Fixed to top</h3>
<p>Add <code>.navbar-fixed-top</code> and remember to account for the hidden area underneath it by adding at least 40px <code>padding</code> to the <code>&lt;body&gt;</code>. Be sure to add this after the core Bootstrap CSS and before the optional responsive CSS.</p>
<div class="bs-docs-example bs-navbar-top-example">
<div class="navbar navbar-fixed-top" style="position: absolute; top: -1px;">
......@@ -3402,7 +3402,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</div>
{% endhighlight %}
<h3>Fixed to bottom</h3>
<h3 id="navbar-fixed-bottom">Fixed to bottom</h3>
<p>Add <code>.navbar-fixed-bottom</code> instead.</p>
<div class="bs-docs-example bs-navbar-bottom-example">
<div class="navbar navbar-fixed-bottom" style="position: absolute; bottom: -1px;">
......@@ -3422,7 +3422,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
</div>
{% endhighlight %}
<h3>Static top navbar</h3>
<h3 id="navbar-static-top">Static top navbar</h3>
<p>Create a full-width navbar that scrolls away with the page by adding <code>.navbar-static-top</code>. Unlike the <code>.navbar-fixed-top</code> class, you do not need to change any padding on the <code>body</code>.</p>
<div class="bs-docs-example bs-navbar-top-example">
<div class="navbar navbar-static-top" style="margin: -1px -1px 0;">
......@@ -3443,7 +3443,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
{% endhighlight %}
<h2>Responsive navbar</h2>
<h2 id="navbar-responsive">Responsive navbar</h2>
<p>To implement a collapsing responsive navbar, wrap your navbar content in a containing div, <code>.nav-collapse.collapse</code>, and add the navbar toggle button, <code>.navbar-toggle</code>.</p>
<div class="bs-docs-example">
<div class="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