finish up second pass through docs nav, headings, organization, naming, etc...

finish up second pass through docs nav, headings, organization, naming, etc (another run through at #9710)

_includes/nav-components.html

@@ -10,28 +10,28 @@
 <li>
   <a href="#btn-groups">Button groups</a>
   <ul class="nav">
-    <li><a href="#btn-groups-single">Basic button group</a></li>
+    <li><a href="#btn-groups-single">Basic example</a></li>
     <li><a href="#btn-groups-toolbar">Button toolbar</a></li>
-    <li><a href="#btn-groups-sizing">Button group sizing</a></li>
-    <li><a href="#btn-groups-nested">Nested button groups</a></li>
+    <li><a href="#btn-groups-sizing">Sizing</a></li>
+    <li><a href="#btn-groups-nested">Nesting</a></li>
     <li><a href="#btn-groups-vertical">Vertical variation</a></li>
-    <li><a href="#btn-groups-justified">Justified link buttons</a></li>
+    <li><a href="#btn-groups-justified">Justified link variation</a></li>
   </ul>
 </li>
 <li>
   <a href="#btn-dropdowns">Button dropdowns</a>
   <ul class="nav">
-    <li><a href="#btn-dropdowns-single">Single button dropdown</a></li>
-    <li><a href="#btn-dropdowns-split">Split button dropdown</a></li>
-    <li><a href="#btn-dropdowns-sizes">Button sizes</a></li>
+    <li><a href="#btn-dropdowns-single">Single button dropdowns</a></li>
+    <li><a href="#btn-dropdowns-split">Split button dropdowns</a></li>
+    <li><a href="#btn-dropdowns-sizing">Sizing</a></li>
     <li><a href="#btn-dropdowns-dropup">Dropup variation</a></li>
   </ul>
 </li>
 <li>
   <a href="#input-groups">Input groups</a>
   <ul class="nav">
-    <li><a href="#input-groups-basic">Basic input group</a></li>
-    <li><a href="#input-groups-sizes">Sizing options</a></li>
+    <li><a href="#input-groups-basic">Basic example</a></li>
+    <li><a href="#input-groups-sizing">Sizing</a></li>
     <li><a href="#input-groups-checkboxes-radios">Checkbox and radios addons</a></li>
     <li><a href="#input-groups-buttons">Button addons</a></li>
     <li><a href="#input-groups-buttons-dropdowns">Buttons with dropdowns</a></li>
@@ -41,8 +41,8 @@
 <li>
   <a href="#nav">Navs</a>
   <ul class="nav">
-    <li><a href="#nav-tabs">Tabs nav</a></li>
-    <li><a href="#nav-pills">Pills nav</a></li>
+    <li><a href="#nav-tabs">Tabs</a></li>
+    <li><a href="#nav-pills">Pills</a></li>
     <li><a href="#nav-justified">Justified nav</a></li>
     <li><a href="#nav-disabled-links">Disabled links</a></li>
     <li><a href="#nav-alignment">Alignment options</a></li>
@@ -53,13 +53,13 @@
   <a href="#navbar">Navbar</a>
   <ul class="nav">
     <li><a href="#navbar-default">Default navbar</a></li>
-    <li><a href="#navbar-buttons">Buttons in navbars</a></li>
-    <li><a href="#navbar-text">Text in navbars</a></li>
-    <li><a href="#navbar-links">Links in navbars</a></li>
+    <li><a href="#navbar-buttons">Buttons</a></li>
+    <li><a href="#navbar-text">Text</a></li>
+    <li><a href="#navbar-links">Non-nav links</a></li>
     <li><a href="#navbar-component-alignment">Component alignment</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-fixed-top">Fixed to top</a></li>
+    <li><a href="#navbar-fixed-bottom">Fixed to bottom</a></li>
+    <li><a href="#navbar-static-top">Static top</a></li>
     <li><a href="#navbar-inverted">Inverted navbar</a></li>
   </ul>
 </li>
@@ -78,7 +78,7 @@
 <li>
   <a href="#thumbnails">Thumbnails</a>
   <ul class="nav">
-    <li><a href="#thumbnails-default">Default thumbnails</a></li>
+    <li><a href="#thumbnails-default">Default example</a></li>
     <li><a href="#thumbnails-custom-content">Custom content</a></li>
   </ul>
 </li>
@@ -94,7 +94,7 @@
 <li>
   <a href="#progress">Progress bars</a>
   <ul class="nav">
-    <li><a href="#progress-basic">Basic progress bar</a></li>
+    <li><a href="#progress-basic">Basic example</a></li>
     <li><a href="#progress-alternatives">Contextual alternatives</a></li>
     <li><a href="#progress-striped">Striped</a></li>
     <li><a href="#progress-animated">Animated</a></li>
@@ -111,17 +111,16 @@
 <li>
   <a href="#list-group">List group</a>
   <ul class="nav">
-    <li><a href="#list-group-basic">Basic list group</a></li>
+    <li><a href="#list-group-basic">Basic example</a></li>
     <li><a href="#list-group-badges">Badges</a></li>
     <li><a href="#list-group-linked">Linked items</a></li>
     <li><a href="#list-group-custom-content">Custom content</a></li>
-    <!-- <li><a href="#list-group-pic">Leading picture</a></li> -->
   </ul>
 </li>
 <li>
   <a href="#panels">Panels</a>
   <ul class="nav">
-    <li><a href="#panels-basic">Basic panel</a></li>
+    <li><a href="#panels-basic">Basic example</a></li>
     <li><a href="#panels-heading">Panel with heading</a></li>
     <li><a href="#panels-alternatives">Contextual alternatives</a></li>
     <li><a href="#panels-list-group">With list groups</a>

_includes/nav-css.html

@@ -4,9 +4,9 @@
     <li><a href="#overview-doctype">HTML5 doctype</a></li>
     <li><a href="#overview-mobile">Mobile first</a></li>
     <li><a href="#overview-responsive-images">Responsive images</a></li>
-    <li><a href="#overview-type-links">Type and links</a></li>
+    <li><a href="#overview-type-links">Typography and links</a></li>
     <li><a href="#overview-normalize">Normalize</a></li>
-    <li><a href="#overview-container">Container</a></li>
+    <li><a href="#overview-container">Containers</a></li>
   </ul>
 </li>
 <li>
@@ -16,13 +16,13 @@
   <a href="#grid">Grid system</a>
   <ul class="nav">
     <li><a href="#grid-media-queries">Media queries</a></li>
-    <li><a href="#grid-options">Available options</a></li>
+    <li><a href="#grid-options">Grid options</a></li>
     <li><a href="#grid-example-basic">Ex: Stacked-to-horizonal</a></li>
-    <li><a href="#grid-example-mixed">Ex: Mobile-desktop</a></li>
-    <li><a href="#grid-example-mixed-complete">Ex: Mobile, tablet, desktop</a></li>
+    <li><a href="#grid-example-mixed">Ex: Mobile and desktops</a></li>
+    <li><a href="#grid-example-mixed-complete">Ex: Mobile, tablet, desktops</a></li>
     <li><a href="#grid-responsive-resets">Responsive column resets</a></li>
-    <li><a href="#grid-offsetting">Offset columns</a></li>
-    <li><a href="#grid-nesting">Nested columns</a></li>
+    <li><a href="#grid-offsetting">Offsetting columns</a></li>
+    <li><a href="#grid-nesting">Nesting columns</a></li>
     <li><a href="#grid-column-ordering">Column ordering</a></li>
     <li><a href="#grid-less">LESS mixins and variables</a></li>
   </ul>
@@ -44,10 +44,10 @@
   <a href="#tables">Tables</a>
   <ul class="nav">
     <li><a href="#tables-example">Basic example</a></li>
-    <li><a href="#tables-striped">Zebra striping</a></li>
-    <li><a href="#tables-bordered">Bordered tables</a></li>
+    <li><a href="#tables-striped">Striped rows</a></li>
+    <li><a href="#tables-bordered">Bordered table</a></li>
     <li><a href="#tables-hover-rows">Hover rows</a></li>
-    <li><a href="#tables-condensed">Condensed tables</a></li>
+    <li><a href="#tables-condensed">Condensed table</a></li>
     <li><a href="#tables-contextual-classes">Contextual classes</a></li>
   </ul>
 </li>
@@ -55,10 +55,10 @@
   <a href="#forms">Forms</a>
   <ul class="nav">
     <li><a href="#forms-example">Basic example</a></li>
-    <li><a href="#forms-inline">Inline variation</a></li>
-    <li><a href="#forms-horizontal">Horizontal variation</a></li>
+    <li><a href="#forms-inline">Inline form</a></li>
+    <li><a href="#forms-horizontal">Horizontal form</a></li>
     <li><a href="#forms-controls">Supported controls</a></li>
-    <li><a href="#forms-controls-static">Static form control</a></li>
+    <li><a href="#forms-controls-static">Static control</a></li>
     <li><a href="#forms-control-states">Control states</a></li>
     <li><a href="#forms-control-sizes">Control sizing</a></li>
     <li><a href="#forms-help-text">Help text</a></li>
@@ -67,9 +67,9 @@
 <li>
   <a href="#buttons">Buttons</a>
   <ul class="nav">
-    <li><a href="#buttons-options">Button options</a></li>
+    <li><a href="#buttons-options">Options</a></li>
     <li><a href="#buttons-sizes">Sizes</a></li>
-    <li><a href="#buttons-disabled">Disabled</a></li>
+    <li><a href="#buttons-disabled">Disabled state</a></li>
     <li><a href="#buttons-tags">Button tags</a></li>
   </ul>
 </li>

_includes/nav-getting-started.html

 <li>
   <a href="#download">Download Bootstrap</a>
   <ul class="nav">
-    <li><a href="#download-options">Download options</a></li>
+    <li><a href="#download-source">Download source</a></li>
+    <li><a href="#download-additional">Additional downloads</a></li>
     <li><a href="#download-cdn">Bootstrap CDN</a></li>
   </ul>
 </li>

_includes/nav-javascript.html

@@ -4,7 +4,7 @@
     <li><a href="#js-individual-compiled">Individual or compiled</a></li>
     <li><a href="#js-data-attrs">Data attributes</a></li>
     <li><a href="#js-programmatic-api">Programmatic API</a></li>
-    <li><a href="#js-noconflict">No Conflict</a></li>
+    <li><a href="#js-noconflict">No conflict</a></li>
     <li><a href="#js-events">Events</a></li>
   </ul>
 </li>

assets/css/docs.css

@@ -531,6 +531,12 @@ body {
   }
 }
 
+/* Pagination */
+.bs-example .pagination {
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+
 /* Example modals */
 .bs-example-modal {
   background-color: #f5f5f5;

css.html

@@ -15,7 +15,7 @@ base_url: "../"
     </div>
     <p class="lead">Get the lowdown on the key pieces of Bootstrap's infrastructure, including our approach to better, faster, stronger web development.</p>
 
-    <h3 id="overview-doctype">HTML5 doctype required</h3>
+    <h3 id="overview-doctype">HTML5 doctype</h3>
     <p>Bootstrap makes use of certain HTML elements and CSS properties that require the use of the HTML5 doctype. Include it at the beginning of all your projects.</p>
 {% highlight html %}
 <!DOCTYPE html>
@@ -51,10 +51,10 @@ base_url: "../"
     </ul>
     <p>These styles can be found within <code>scaffolding.less</code>.</p>
 
-    <h3 id="overview-normalize">Normalize reset</h3>
+    <h3 id="overview-normalize">Normalize</h3>
     <p>For improved cross-browser rendering, we use <a href="http://necolas.github.io/normalize.css/" target="_blank">Normalize</a>, a project by <a href="http://twitter.com/necolas" target="_blank">Nicolas Gallagher</a> and <a href="http://twitter.com/jon_neal" target="_blank">Jonathan Neal</a>.</p>
 
-    <h3 id="overview-container">Centering with container</h3>
+    <h3 id="overview-container">Containers</h3>
     <p>Easily center a page's contents by wrapping its contents in a <code>.container</code>. Containers set <code>max-width</code> at various media query breakpoints to match our grid system.</p>
 {% highlight html %}
 <div class="container">
@@ -249,7 +249,7 @@ base_url: "../"
 </div>
 {% endhighlight %}
 
-    <h3 id="grid-example-mixed">Example: Combining mobile with desktop</h3>
+    <h3 id="grid-example-mixed">Example: Mobile and desktop</h3>
     <p>Don't want your columns to simply stack in smaller devices? Use the extra small and medium device grid classes by adding <code>.col-xs-*</code> <code>.col-md-*</code> to your columns. See the example below for a better idea of how it all works.</p>
     <div class="bs-docs-grid">
       <div class="row show-grid">
@@ -287,7 +287,7 @@ base_url: "../"
 </div>
 {% endhighlight %}
 
-    <h3 id="grid-example-mixed-complete">Example: Mobile, tablet, and desktop</h3>
+    <h3 id="grid-example-mixed-complete">Example: Mobile, tablet, desktops</h3>
     <p>Build on the previous example by creating even more dynamic and powerful layouts with tablet <code>.col-sm-*</code> classes.</p>
     <div class="bs-docs-grid">
       <div class="row show-grid">
@@ -1061,10 +1061,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 {% endhighlight %}
 
 
-    <h2>Optional classes</h2>
-    <p>Add any of the following classes to the <code>.table</code> base class.</p>
-
-    <h3 id="tables-striped">Striped</h3>
+    <h2 id="tables-striped">Striped rows</h2>
     <p>Use <code>.table-striped</code> to add zebra-striping to any table row within the <code>&lt;tbody&gt;</code>.</p>
     <div class="bs-callout bs-callout-danger">
       <h4>Cross-browser compatibility</h4>
@@ -1108,7 +1105,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 </table>
 {% endhighlight %}
 
-    <h3 id="tables-bordered">Bordered</h3>
+
+    <h2 id="tables-bordered">Bordered table</h2>
     <p>Add <code>.table-bordered</code> for borders on all sides of the table and cells.</p>
     <div class="bs-example">
       <table class="table table-bordered">
@@ -1152,7 +1150,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 </table>
 {% endhighlight %}
 
-    <h3 id="tables-hover-rows">Hover rows</h3>
+
+    <h2 id="tables-hover-rows">Hover rows</h2>
     <p>Add <code>.table-hover</code> to enable a hover state on table rows within a <code>&lt;tbody&gt;</code>.</p>
     <div class="bs-example">
       <table class="table table-hover">
@@ -1192,7 +1191,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 {% endhighlight %}
 
 
-    <h3 id="tables-condensed">Condensed</h3>
+    <h2 id="tables-condensed">Condensed table</h2>
     <p>Add <code>.table-condensed</code> to make tables more compact by cutting cell padding in half.</p>
     <div class="bs-example">
       <table class="table table-condensed">
@@ -1233,7 +1232,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 
 
 
-    <h2 id="tables-contextual-classes">Contextual table classes</h2>
+    <h2 id="tables-contextual-classes">Contextual classes</h2>
     <p>Use contextual classes to color table rows or individual cells.</p>
     <div class="bs-table-scrollable">
       <table class="table table-bordered table-striped bs-table">
@@ -1406,7 +1405,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 {% endhighlight %}
 
 
-    <h3 id="forms-inline">Inline form</h3>
+    <h2 id="forms-inline">Inline form</h2>
     <p>Add <code>.form-inline</code> for left-aligned and inline-block controls for a compact layout.</p>
     <div class="bs-callout bs-callout-danger">
       <h4>Requires custom widths</h4>
@@ -1451,6 +1450,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 </form>
 {% endhighlight %}
 
+
     <h2 id="forms-horizontal">Horizontal form</h2>
     <p>Use Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout by adding <code>.form-horizontal</code> to the form. Doing so changes <code>.form-group</code>s to behave as grid rows, so no need for <code>.row</code>.</p>
     <form class="bs-example form-horizontal">
@@ -1513,7 +1513,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 {% endhighlight %}
 
 
-    <h2 id="forms-controls">Supported form controls</h2>
+    <h2 id="forms-controls">Supported controls</h2>
     <p>Examples of standard form controls supported in an example form layout.</p>
 
     <h3>Inputs</h3>
@@ -1647,8 +1647,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 {% endhighlight %}
 
 
-    <h2 id="forms-controls-static">Static text in horizontal forms</h2>
-    <p>When you need to place regular, static text next to a form label within a horizontal form, use the <code>.form-control-static</code> class on a <code>&lt;p&gt;</code>.</p>
+    <h2 id="forms-controls-static">Static control</h2>
+    <p>When you need to place plain text next to a form label within a horizontal form, use the <code>.form-control-static</code> class on a <code>&lt;p&gt;</code>.</p>
     <form class="bs-example form-horizontal">
       <div class="form-group">
         <label class="col-lg-2 control-label">Email</label>
@@ -1681,7 +1681,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 {% endhighlight %}
 
 
-    <h2 id="forms-control-states">Form control states</h2>
+    <h2 id="forms-control-states">Form states</h2>
     <p>Provide feedback to users or visitors with basic feedback states on form controls and labels.</p>
 
     <h3 id="forms-input-focus">Input focus</h3>
@@ -1873,7 +1873,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
       <h1 id="buttons">Buttons</h1>
     </div>
 
-    <h2 id="buttons-options">Button options</h2>
+    <h2 id="buttons-options">Options</h2>
     <p>Use any of the available button classes to quickly create a styled button.</p>
     <div class="bs-example">
       <button type="button" class="btn btn-default">Default</button>
@@ -1907,7 +1907,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
 <button type="button" class="btn btn-link">Link</button>
 {% endhighlight %}
 
-    <h2 id="buttons-sizes">Button sizes</h2>
+    <h2 id="buttons-sizes">Sizes</h2>
     <p>Fancy larger or smaller buttons? Add <code>.btn-lg</code>, <code>.btn-sm</code>, or <code>.btn-xs</code> for additional sizes.</p>
     <div class="bs-example">
       <p>
@@ -1997,7 +1997,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
     </div>
 
 
-    <h2 id="buttons-tags">Using multiple tags</h2>
+    <h2 id="buttons-tags">Button tags</h2>
     <p>Use the button classes on an <code>&lt;a&gt;</code>, <code>&lt;button&gt;</code>, or <code>&lt;input&gt;</code> element.</p>
     <form class="bs-example">
       <a class="btn btn-default" href="#">Link</a>

getting-started.html

@@ -15,7 +15,7 @@ base_url: "../"
     </div>
     <p class="lead">There are a few easy ways to quickly get started with Bootstrap, each one appealing to a different skill level and use case. Read through to see what suits your particular needs.</p>
 
-    <h3>Download latest full source</h3>
+    <h3 id="download-source">Download latest full source</h3>
     <p>Until Bootstrap 3.0.0 is finalized, download the latest full source code (includes compiled and minified versions of our CSS and JavaScript under the <code>dist/</code> directory).</p>
     <p><a class="btn btn-lg btn-primary" href="{{ site.download }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download source']);">Download latest Bootstrap 3</a></p>
     <!--
@@ -24,7 +24,7 @@ base_url: "../"
     <p><a class="btn btn-lg btn-primary" href="{{ site.download_dist }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download compiled']);">Download Bootstrap</a></p>
     -->
 
-    <h3 id="download-options">More download options</h3>
+    <h3 id="download-additional">Additional downloads</h3>
     <div class="bs-docs-dl-options">
       <h4>
         <a href="{{ site.download }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download source']);">Download latest source code</a>
@@ -41,7 +41,7 @@ base_url: "../"
       {% highlight bash %}$ bower install bootstrap{% endhighlight %}
     </div>
 
-    <h3 id="download-cdn">Use the Bootstrap CDN</h3>
+    <h3 id="download-cdn">Bootstrap CDN</h3>
     <p>The folks over at <a href="https://www.netdna.com/">NetDNA</a> have graciously provided CDN support for Bootstrap's CSS and JavaScript. To use, swap your local instances for the <a href="http://www.bootstrapcdn.com/">Bootstrap CDN</a> links listed below.</p>
 {% highlight html linenos %}
 <!-- Latest compiled and minified CSS -->