navbar callouts cleanup

Move all callouts to be adjacent to each other
Combine JS-related callouts into a single callout

diff --git a/docs/_includes/components/navbar.html b/docs/_includes/components/navbar.html
index e876e80a3d2943cf63242b18feb96d3fc78f605f..67a9faa93211dd3098382e1026f4469f1d05599b 100644 (file)
--- a/docs/_includes/components/navbar.html
+++ b/docs/_includes/components/navbar.html
@@ -15,13 +15,18 @@
     </ol>
   </div>
   <div class="bs-callout bs-callout-danger">
-    <h4>Requires JavaScript</h4>
+    <h4>Requires JavaScript plugin</h4>
     <p>If JavaScript is disabled and the viewport is narrow enough that the navbar collapses, it will be impossible to expand the navbar and view the content within the <code>.navbar-collapse</code>.</p>
+    <p>The responsive navbar requires the <a href="../javascript/#collapse">collapse plugin</a> to be included in your version of Bootstrap.</p>
   </div>
   <div class="bs-callout bs-callout-info">
     <h4>Changing the collapsed mobile navbar breakpoint</h4>
     <p>The navbar collapses into its vertical mobile view when the viewport is narrower than <code>@grid-float-breakpoint</code>, and expands into its horizontal non-mobile view when the viewport is at least <code>@grid-float-breakpoint</code> in width. Adjust this variable in the Less source to control when the navbar collapses/expands. The default value is <code>768px</code> (the smallest "small" or "tablet" screen).</p>
   </div>
+  <div class="bs-callout bs-callout-warning">
+    <h4>Make navbars accessible</h4>
+    <p>Be sure to add a <code>role="navigation"</code> to every navbar to help with accessibility.</p>
+  </div>
 
   <div class="bs-example">
     <nav class="navbar navbar-default" role="navigation">
@@ -134,16 +139,6 @@
 </nav>
 {% endhighlight %}
 
-  <div class="bs-callout bs-callout-danger">
-    <h4>Plugin dependency</h4>
-    <p>The responsive navbar requires the <a href="../javascript/#collapse">collapse plugin</a> to be included in your version of Bootstrap.</p>
-  </div>
-
-  <div class="bs-callout bs-callout-warning">
-    <h4>Make navbars accessible</h4>
-    <p>Be sure to add a <code>role="navigation"</code> to every navbar to help with accessibility.</p>
-  </div>
-
 
   <h2 id="navbar-brand-image">Brand image</h2>
   <p>Replace the navbar brand with your own image by swapping the text for an <code>&lt;img&gt;</code>. Since the <code>.navbar-brand</code> has its own padding and height, you may need to override some CSS depending on your image.</p>