From c6ee96c02587aeea0da52018325c100bfd45127a Mon Sep 17 00:00:00 2001
From: Mark Otto <markotto@twitter.com>
Date: Thu, 5 Jul 2012 10:37:23 -0700
Subject: fix up subnav styles, add subnav search form styles, add some basic
 docs for subnav

---
 docs/templates/pages/components.mustache | 57 ++++++++++++++++++++++++++++++++
 1 file changed, 57 insertions(+)

(limited to 'docs/templates')

diff --git a/docs/templates/pages/components.mustache b/docs/templates/pages/components.mustache
index ea6cc4516..5fb11ccf2 100644
--- a/docs/templates/pages/components.mustache
+++ b/docs/templates/pages/components.mustache
@@ -1177,6 +1177,63 @@
     <strong>{{_i}}Heads up!{{/i}}</strong> The responsive navbar requires the <a href="./javascript.html#collapse">collapse plugin</a> and <a href="./scaffolding.html#responsive">responsive Bootstrap CSS file</a>.
   </div>
 
+
+  <hr class="bs-docs-separator">
+
+
+  <h2>{{_i}}Responsive navbar{{/i}}</h2>
+  <p>{{_i}}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>.btn-navbar</code>.{{/i}}</p>
+  <div class="bs-docs-example">
+    <div class="navbar navbar-subnav" style="position: static;">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </a>
+          <a class="brand" href="#">{{_i}}Title{{/i}}</a>
+          <div class="nav-collapse">
+            <ul class="nav">
+              <li class="active"><a href="#">{{_i}}Home{{/i}}</a></li>
+              <li><a href="#">{{_i}}Link{{/i}}</a></li>
+              <li><a href="#">{{_i}}Link{{/i}}</a></li>
+              <li class="dropdown">
+                <a href="#" class="dropdown-toggle" data-toggle="dropdown">{{_i}}Dropdown{{/i}} <b class="caret"></b></a>
+                <ul class="dropdown-menu">
+                  <li><a href="#">{{_i}}Action{{/i}}</a></li>
+                  <li><a href="#">{{_i}}Another action{{/i}}</a></li>
+                  <li><a href="#">{{_i}}Something else here{{/i}}</a></li>
+                  <li class="divider"></li>
+                  <li class="nav-header">Nav header</li>
+                  <li><a href="#">{{_i}}Separated link{{/i}}</a></li>
+                  <li><a href="#">{{_i}}One more separated link{{/i}}</a></li>
+                </ul>
+              </li>
+            </ul>
+            <form class="navbar-search pull-left" action="">
+              <input type="text" class="search-query span2" placeholder="Search">
+            </form>
+            <ul class="nav pull-right">
+              <li><a href="#">{{_i}}Link{{/i}}</a></li>
+              <li class="divider-vertical"></li>
+              <li class="dropdown">
+                <a href="#" class="dropdown-toggle" data-toggle="dropdown">{{_i}}Dropdown{{/i}} <b class="caret"></b></a>
+                <ul class="dropdown-menu">
+                  <li><a href="#">{{_i}}Action{{/i}}</a></li>
+                  <li><a href="#">{{_i}}Another action{{/i}}</a></li>
+                  <li><a href="#">{{_i}}Something else here{{/i}}</a></li>
+                  <li class="divider"></li>
+                  <li><a href="#">{{_i}}Separated link{{/i}}</a></li>
+                </ul>
+              </li>
+            </ul>
+          </div><!-- /.nav-collapse -->
+        </div>
+      </div><!-- /navbar-inner -->
+    </div><!-- /navbar -->
+  </div>{{! /example }}
+
 </section>
 
 
-- 
cgit v1.2.3