Super massive docs overhaul

* Bring back the navbar up top
* Pull the docs content back into separate pages because a 6.6k line docs file is just crazy
* Recenter the page content and bring back affixed side nav (needs work)

6 files changed, 232 insertions, 224 deletions

diff --git a/docs/_includes/docs-nav.html b/docs/_includes/docs-nav.html
deleted file mode 100644
index a9afa52c7..000000000
--- a/docs/_includes/docs-nav.html
+++ /dev/null
@@ -1,224 +0,0 @@
-<div class="bs-docs-sidebar">
-  <ul class="nav bs-docs-sidenav">
-    <h3 class="bs-docs-sidenav-heading"><a href="/">Bootstrap</a></h3>
-
-    <li><a href="#welcome">Welcome!</a></li>
-    <li><a href="#getting-started">Getting started</a></li>
-    <li><a href="#whats-included">What's included</a></li>
-    <li><a href="#examples">Templates and examples</a></li>
-    <li><a href="#customizing">Customizing Bootstrap</a></li>
-
-    <!-- CSS -->
-    <li><a class="nav-header" href="#css">CSS</a></li>
-    <li><a href="#css-overview">Overview</a></li>
-    <li>
-      <a href="#grid">Grid system</a>
-      <ul class="nav">
-        <li><a href="#grid-example">Example usage</a></li>
-        <li><a href="#grid-offsetting">Offset columns</a></li>
-        <li><a href="#grid-nesting">Nested columns</a></li>
-        <li><a href="#grid-column-ordering">Column ordering</a></li>
-        <li><a href="#grid-small">Small device grid</a></li>
-        <li><a href="#grid-less">LESS mixins and variables</a></li>
-      </ul>
-    </li>
-    <li>
-      <a href="#type">Typography</a>
-      <ul class="nav">
-        <li><a href="#type-headings">Headings</a></li>
-        <li><a href="#type-body-copy">Body copy</a></li>
-        <li><a href="#type-emphasis">Emphasis</a></li>
-        <li><a href="#type-abbreviations">Abbreviations</a></li>
-        <li><a href="#type-addresses">Addresses</a></li>
-        <li><a href="#type-blockquotes">Blockquotes</a></li>
-        <li><a href="#type-lists">Lists</a></li>
-      </ul>
-    </li>
-    <li><a href="#code">Code</a></li>
-    <li>
-      <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-hover-rows">Hover rows</a></li>
-        <li><a href="#tables-condensed">Condensed tables</a></li>
-        <li><a href="#tables-row-classes">Contextual row classes</a></li>
-      </ul>
-    </li>
-    <li>
-      <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-controls">Supported controls</a></li>
-        <li><a href="#forms-control-states">Control states</a></li>
-        <li><a href="#forms-input-groups">Input groups</a></li>
-        <li><a href="#forms-control-sizes">Control sizing</a></li>
-        <li><a href="#forms-actions">Form actions</a></li>
-        <li><a href="#forms-help-text">Help text</a></li>
-      </ul>
-    </li>
-    <li>
-      <a href="#buttons">Buttons</a>
-      <ul class="nav">
-        <li><a href="#buttons-options">Button options</a></li>
-        <li><a href="#buttons-sizes">Sizes</a></li>
-        <li><a href="#buttons-disabled">Disabled</a></li>
-        <li><a href="#buttons-tags">Button tags</a></li>
-      </ul>
-    </li>
-    <li><a href="#images">Images</a></li>
-    <li><a href="#helper-classes">Helper classes</a></li>
-    <li><a href="#responsive-utilities">Responsive utilities</a></li>
-
-    <!-- Components -->
-    <li><a class="nav-header" href="#components">Components</a></li>
-    <li><a href="#icons">Glyphicons</a></li>
-    <li>
-      <a href="#dropdowns">Dropdowns</a>
-      <ul class="nav">
-        <li><a href="#dropdowns-example">Example</a></li>
-        <li><a href="#dropdowns-alignment">Alignment options</a></li>
-        <li><a href="#dropdowns-disabled">Disabled menu items</a></li>
-        <li><a href="#dropdowns-submenus">Submenus</a></li>
-      </ul>
-    </li>
-    <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-toolbar">Button toolbar</a></li>
-        <li><a href="#btn-groups-vertical">Vertical variation</a></li>
-        <li><a href="#btn-groups-justified">Justified link buttons</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-dropup">Dropup variation</a></li>
-      </ul>
-    </li>
-    <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-justified">Justified nav</a></li>
-        <li><a href="#nav-disabled-links">Disabled links</a></li>
-        <li><a href="#nav-alignment">Alignment options</a></li>
-        <li><a href="#nav-dropdowns">Using dropdowns</a></li>
-      </ul>
-    </li>
-    <li>
-      <a href="#navbar">Navbar</a>
-      <ul class="nav">
-        <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-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-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-responsive">Responsive navbar</a></li>
-      </ul>
-    </li>
-    <li><a href="#breadcrumbs">Breadcrumbs</a></li>
-    <li>
-      <a href="#pagination">Pagination</a>
-      <ul class="nav">
-        <li><a href="#pagination-default">Default pagination</a></li>
-        <li><a href="#pagination-pager">Pager</a></li>
-      </ul>
-    </li>
-    <li><a href="#labels">Labels</a></li>
-    <li><a href="#badges">Badges</a></li>
-    <li>
-      <a href="#type-components">Typography</a>
-      <ul class="nav">
-        <li><a href="#type-components-jumbotron">Jumbotron</a></li>
-        <li><a href="#type-components-page-header">Page header</a></li>
-      </ul>
-    </li>
-    <li><a href="#thumbnails">Thumbnails</a></li>
-    <li>
-      <a href="#alerts">Alerts</a>
-      <ul class="nav">
-        <li><a href="#alerts-default">Default alert</a></li>
-        <li><a href="#alerts-block">Block alerts</a></li>
-        <li><a href="#alerts-alternatives">Contextual alternatives</a></li>
-      </ul>
-    </li>
-    <li>
-      <a href="#progress">Progress bars</a>
-      <ul class="nav">
-        <li><a href="#progress-basic">Basic progress bar</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>
-        <li><a href="#progress-stacked">Stacked</a></li>
-      </ul>
-    </li>
-    <li><a href="#media">Media object</a></li>
-    <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-chevrons">Chevrons</a></li>
-        <li><a href="#list-group-badges">Badges</a></li>
-        <li><a href="#list-group-badges-chevrons">Badges and chevrons</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-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>
-      </ul>
-    </li>
-    <li><a href="#wells">Wells</a></li>
-
-    <!-- JavaScript -->
-    <li><a class="nav-header" href="#js">JavaScript</a></li>
-    <li>
-      <a href="#js-overview">Overview</a>
-      <ul class="nav">
-        <li><a href="#js-individual-compiled">Individual or compiled</a></li>
-        <li><a href="#js-data-attributes">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-events">Evens</a></li>
-      </ul>
-    </li>
-    <li><a href="#transitions">Transitions</a></li>
-    <li>
-      <a href="#modals">Modal</a>
-      <ul class="nav">
-        <li><a href="#modals-examples">Examples</a></li>
-        <li><a href="#modals-usage">Usage</a></li>
-      </ul>
-    </li>
-    <li><a href="#dropdowns">Dropdown</a></li>
-    <li><a href="#scrollspy">Scrollspy</a></li>
-    <li><a href="#tabs">Tab</a></li>
-    <li><a href="#tooltips">Tooltip</a></li>
-    <li><a href="#popovers">Popover</a></li>
-    <li><a href="#js-alerts">Alert</a></li>
-    <li><a href="#js-buttons">Button</a></li>
-    <li><a href="#collapse">Collapse</a></li>
-    <li><a href="#carousel">Carousel</a></li>
-    <li><a href="#affix">Affix</a></li>
-  </ul>
-</div>
diff --git a/docs/_includes/nav-components.html b/docs/_includes/nav-components.html
new file mode 100644
index 000000000..08be1ad8f
--- /dev/null
+++ b/docs/_includes/nav-components.html
@@ -0,0 +1,114 @@
+<li><a href="#icons">Glyphicons</a></li>
+<li>
+  <a href="#dropdowns">Dropdowns</a>
+  <ul class="nav">
+    <li><a href="#dropdowns-example">Example</a></li>
+    <li><a href="#dropdowns-alignment">Alignment options</a></li>
+    <li><a href="#dropdowns-disabled">Disabled menu items</a></li>
+    <li><a href="#dropdowns-submenus">Submenus</a></li>
+  </ul>
+</li>
+<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-toolbar">Button toolbar</a></li>
+    <li><a href="#btn-groups-vertical">Vertical variation</a></li>
+    <li><a href="#btn-groups-justified">Justified link buttons</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-dropup">Dropup variation</a></li>
+  </ul>
+</li>
+<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-justified">Justified nav</a></li>
+    <li><a href="#nav-disabled-links">Disabled links</a></li>
+    <li><a href="#nav-alignment">Alignment options</a></li>
+    <li><a href="#nav-dropdowns">Using dropdowns</a></li>
+  </ul>
+</li>
+<li>
+  <a href="#navbar">Navbar</a>
+  <ul class="nav">
+    <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-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-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-responsive">Responsive navbar</a></li>
+  </ul>
+</li>
+<li><a href="#breadcrumbs">Breadcrumbs</a></li>
+<li>
+  <a href="#pagination">Pagination</a>
+  <ul class="nav">
+    <li><a href="#pagination-default">Default pagination</a></li>
+    <li><a href="#pagination-pager">Pager</a></li>
+  </ul>
+</li>
+<li><a href="#labels">Labels</a></li>
+<li><a href="#badges">Badges</a></li>
+<li>
+  <a href="#type-components">Typography</a>
+  <ul class="nav">
+    <li><a href="#type-components-jumbotron">Jumbotron</a></li>
+    <li><a href="#type-components-page-header">Page header</a></li>
+  </ul>
+</li>
+<li><a href="#thumbnails">Thumbnails</a></li>
+<li>
+  <a href="#alerts">Alerts</a>
+  <ul class="nav">
+    <li><a href="#alerts-default">Default alert</a></li>
+    <li><a href="#alerts-block">Block alerts</a></li>
+    <li><a href="#alerts-alternatives">Contextual alternatives</a></li>
+  </ul>
+</li>
+<li>
+  <a href="#progress">Progress bars</a>
+  <ul class="nav">
+    <li><a href="#progress-basic">Basic progress bar</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>
+    <li><a href="#progress-stacked">Stacked</a></li>
+  </ul>
+</li>
+<li><a href="#media">Media object</a></li>
+<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-chevrons">Chevrons</a></li>
+    <li><a href="#list-group-badges">Badges</a></li>
+    <li><a href="#list-group-badges-chevrons">Badges and chevrons</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-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>
+  </ul>
+</li>
+<li><a href="#wells">Wells</a></li>
diff --git a/docs/_includes/nav-css.html b/docs/_includes/nav-css.html
new file mode 100644
index 000000000..6a94e293b
--- /dev/null
+++ b/docs/_includes/nav-css.html
@@ -0,0 +1,62 @@
+<li><a href="#css-overview">Overview</a></li>
+<li>
+  <a href="#grid">Grid system</a>
+  <ul class="nav">
+    <li><a href="#grid-example">Example usage</a></li>
+    <li><a href="#grid-offsetting">Offset columns</a></li>
+    <li><a href="#grid-nesting">Nested columns</a></li>
+    <li><a href="#grid-column-ordering">Column ordering</a></li>
+    <li><a href="#grid-small">Small device grid</a></li>
+    <li><a href="#grid-less">LESS mixins and variables</a></li>
+  </ul>
+</li>
+<li>
+  <a href="#type">Typography</a>
+  <ul class="nav">
+    <li><a href="#type-headings">Headings</a></li>
+    <li><a href="#type-body-copy">Body copy</a></li>
+    <li><a href="#type-emphasis">Emphasis</a></li>
+    <li><a href="#type-abbreviations">Abbreviations</a></li>
+    <li><a href="#type-addresses">Addresses</a></li>
+    <li><a href="#type-blockquotes">Blockquotes</a></li>
+    <li><a href="#type-lists">Lists</a></li>
+  </ul>
+</li>
+<li><a href="#code">Code</a></li>
+<li>
+  <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-hover-rows">Hover rows</a></li>
+    <li><a href="#tables-condensed">Condensed tables</a></li>
+    <li><a href="#tables-row-classes">Contextual row classes</a></li>
+  </ul>
+</li>
+<li>
+  <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-controls">Supported controls</a></li>
+    <li><a href="#forms-control-states">Control states</a></li>
+    <li><a href="#forms-input-groups">Input groups</a></li>
+    <li><a href="#forms-control-sizes">Control sizing</a></li>
+    <li><a href="#forms-actions">Form actions</a></li>
+    <li><a href="#forms-help-text">Help text</a></li>
+  </ul>
+</li>
+<li>
+  <a href="#buttons">Buttons</a>
+  <ul class="nav">
+    <li><a href="#buttons-options">Button options</a></li>
+    <li><a href="#buttons-sizes">Sizes</a></li>
+    <li><a href="#buttons-disabled">Disabled</a></li>
+    <li><a href="#buttons-tags">Button tags</a></li>
+  </ul>
+</li>
+<li><a href="#images">Images</a></li>
+<li><a href="#helper-classes">Helper classes</a></li>
+<li><a href="#responsive-utilities">Responsive utilities</a></li>
diff --git a/docs/_includes/nav-javascript.html b/docs/_includes/nav-javascript.html
new file mode 100644
index 000000000..d691845f2
--- /dev/null
+++ b/docs/_includes/nav-javascript.html
@@ -0,0 +1,28 @@
+<li>
+  <a href="#js-overview">Overview</a>
+  <ul class="nav">
+    <li><a href="#js-individual-compiled">Individual or compiled</a></li>
+    <li><a href="#js-data-attributes">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-events">Evens</a></li>
+  </ul>
+</li>
+<li><a href="#transitions">Transitions</a></li>
+<li>
+  <a href="#modals">Modal</a>
+  <ul class="nav">
+    <li><a href="#modals-examples">Examples</a></li>
+    <li><a href="#modals-usage">Usage</a></li>
+  </ul>
+</li>
+<li><a href="#dropdowns">Dropdown</a></li>
+<li><a href="#scrollspy">Scrollspy</a></li>
+<li><a href="#tabs">Tab</a></li>
+<li><a href="#tooltips">Tooltip</a></li>
+<li><a href="#popovers">Popover</a></li>
+<li><a href="#js-alerts">Alert</a></li>
+<li><a href="#js-buttons">Button</a></li>
+<li><a href="#collapse">Collapse</a></li>
+<li><a href="#carousel">Carousel</a></li>
+<li><a href="#affix">Affix</a></li>
diff --git a/docs/_includes/nav-main.html b/docs/_includes/nav-main.html
new file mode 100644
index 000000000..b9d321a38
--- /dev/null
+++ b/docs/_includes/nav-main.html
@@ -0,0 +1,24 @@
+<div class="navbar navbar-fixed-top bs-docs-nav">
+  <div class="container">
+    <a href="/" class="navbar-brand">Bootstrap</a>
+    <div class="nav-collapse collapse">
+      <ul class="nav navbar-nav">
+        <li{% if page.slug == "welcome" %} class="active"{% endif %}>
+          <a href="/welcome">Overview</a>
+        </li>
+        <li{% if page.slug == "css" %} class="active"{% endif %}>
+          <a href="/css">CSS</a>
+        </li>
+        <li{% if page.slug == "components" %} class="active"{% endif %}>
+          <a href="/components">Components</a>
+        </li>
+        <li{% if page.slug == "js" %} class="active"{% endif %}>
+          <a href="/javascript">JavaScript</a>
+        </li>
+        <li{% if page.slug == "customize" %} class="active"{% endif %}>
+          <a href="/customize">Customize</a>
+        </li>
+      </ul>
+    </div>
+  </div>
+</div>
diff --git a/docs/_includes/nav-welcome.html b/docs/_includes/nav-welcome.html
new file mode 100644
index 000000000..6a4741f41
--- /dev/null
+++ b/docs/_includes/nav-welcome.html
@@ -0,0 +1,4 @@
+<li><a href="#getting-started">Getting started</a></li>
+<li><a href="#whats-included">What's included</a></li>
+<li><a href="#examples">Templates and examples</a></li>
+<li><a href="#customizing">Customizing Bootstrap</a></li>
\ No newline at end of file