update home and side nav to use new navbar structure

2 files changed, 61 insertions, 86 deletions

diff --git a/docs/_includes/docs-nav.html b/docs/_includes/docs-nav.html
index cc8e64d43..0ab8cd33b 100644
--- a/docs/_includes/docs-nav.html
+++ b/docs/_includes/docs-nav.html
@@ -1,61 +1,49 @@
 <header class="navbar navbar-static-top bs-docs-sidebar" id="top" role="banner">
-  <div class="container-fluid">
-    <div class="navbar-header">
-      <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-sidenav-collapse">
-        <span class="sr-only">Toggle navigation</span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-      </button>
-      <a href="{{ site.baseurl }}" class="navbar-brand">
-        Bootstrap
-      </a>
-    </div>
-    <nav class="collapse navbar-collapse bs-sidenav-collapse" role="navigation">
-      {% for group in site.data.nav %}
-        {% assign link = group.pages | first %}
-        {% assign slug = group.title | downcase | replace: ' ', '-' || page.title | downcase | replace: ' ', '-' %}
-        {% assign active = nil %}
+  <a href="{{ site.baseurl }}" class="navbar-brand">
+    Bootstrap
+  </a>
+  {% for group in site.data.nav %}
+    {% assign link = group.pages | first %}
+    {% assign slug = group.title | downcase | replace: ' ', '-' || page.title | downcase | replace: ' ', '-' %}
+    {% assign active = nil %}
 
-        {% if page.url contains slug %}
-          {% assign active = 'active' %}
-        {% endif %}
+    {% if page.url contains slug %}
+      {% assign active = 'active' %}
+    {% endif %}
 
-        <div class="bs-docs-toc-item {{ active }}">
-          <a class="bs-docs-toc-link" href="{{ site.baseurl }}{{ group.title | downcase | replace: ' ', '-' }}/{{ link.title | downcase | replace: ' ', '-' || page.title | downcase | replace: ' ', '-'  }}">
-            {{ group.title }}
-          </a>
+    <div class="bs-docs-toc-item {{ active }}">
+      <a class="bs-docs-toc-link" href="{{ site.baseurl }}{{ group.title | downcase | replace: ' ', '-' }}/{{ link.title | downcase | replace: ' ', '-' || page.title | downcase | replace: ' ', '-'  }}">
+        {{ group.title }}
+      </a>
 
-          <ul class="nav bs-docs-sidenav">
-            {% for doc in group.pages %}
-              {% assign slug = doc.title | downcase | replace: ' ', '-' %}
-              {% assign active = nil %}
+      <ul class="nav bs-docs-sidenav">
+        {% for doc in group.pages %}
+          {% assign slug = doc.title | downcase | replace: ' ', '-' %}
+          {% assign active = nil %}
 
-              {% if page.url contains slug %}
-                {% assign active = 'active' %}
-              {% endif %}
+          {% if page.url contains slug %}
+            {% assign active = 'active' %}
+          {% endif %}
 
-              <li class="{{ active }}">
-                <a href="{{ site.baseurl }}{{ group.title | downcase | replace: ' ', '-' }}/{{ doc.title | downcase | replace: ' ', '-' }}">
-                  {{ doc.title }}
-                </a>
+          <li class="{{ active }}">
+            <a href="{{ site.baseurl }}{{ group.title | downcase | replace: ' ', '-' }}/{{ doc.title | downcase | replace: ' ', '-' }}">
+              {{ doc.title }}
+            </a>
 
-                {% unless doc.sections == nil %}
-                  <ul class="nav">
-                    {% for section in doc.sections %}
-                      <li>
-                        <a href="{{ site.baseurl }}{{ group.title | downcase | replace: ' ', '-' }}/{{ doc.title | downcase | replace: ' ', '-' }}/#{{ section.title | downcase | replace: ' ', '-' }}">
-                          {{ section.title }}
-                        </a>
-                      </li>
-                    {% endfor %}
-                  </ul>
-                {% endunless %}
-              </li>
-            {% endfor %}
-          </ul>
-        </div>
-      {% endfor %}
-    </nav>
-  </div>
+            {% unless doc.sections == nil %}
+              <ul class="nav">
+                {% for section in doc.sections %}
+                  <li>
+                    <a href="{{ site.baseurl }}{{ group.title | downcase | replace: ' ', '-' }}/{{ doc.title | downcase | replace: ' ', '-' }}/#{{ section.title | downcase | replace: ' ', '-' }}">
+                      {{ section.title }}
+                    </a>
+                  </li>
+                {% endfor %}
+              </ul>
+            {% endunless %}
+          </li>
+        {% endfor %}
+      </ul>
+    </div>
+  {% endfor %}
 </header>
diff --git a/docs/_includes/home-nav.html b/docs/_includes/home-nav.html
index 2ffd56a28..9b0cecd24 100644
--- a/docs/_includes/home-nav.html
+++ b/docs/_includes/home-nav.html
@@ -1,35 +1,22 @@
 <header class="navbar navbar-inverse navbar-static-top bs-docs-nav" id="top" role="banner">
-  <div class="container">
-    <div class="navbar-header">
-      <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
-        <span class="sr-only">Toggle navigation</span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-      </button>
-      <a href="../" class="navbar-brand">Bootstrap</a>
-    </div>
-    <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
-      <ul class="nav navbar-nav">
-        {% for group in site.data.nav %}
-          {% assign link = group.pages | first %}
-          {% assign slug = group.title | downcase | replace: ' ', '-' || page.title | downcase | replace: ' ', '-' %}
-          <li class="nav-item">
-            <a class="nav-link" href="{{ site.baseurl }}{{ group.title | downcase | replace: ' ', '-' }}/{{ link.title | downcase | replace: ' ', '-' || page.title | downcase | replace: ' ', '-'  }}">
-              {{ group.title }}
-            </a>
-          </li>
-        {% endfor %}
-      </ul>
-      <ul class="nav navbar-nav navbar-right">
-        <li class="nav-item">
-          <a class="nav-link" href="{{ site.expo }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Expo');">Expo</a>
-        </li>
-        <li class="nav-item">
-          <a class="nav-link" href="{{ site.blog }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Blog');">Blog</a>
-        </li>
-      </ul>
-    </nav>
-  </div>
+  <a href="../" class="navbar-brand">Bootstrap</a>
+  <ul class="nav nav-pills pull-left">
+    {% for group in site.data.nav %}
+      {% assign link = group.pages | first %}
+      {% assign slug = group.title | downcase | replace: ' ', '-' || page.title | downcase | replace: ' ', '-' %}
+      <li class="nav-item">
+        <a class="nav-link" href="{{ site.baseurl }}{{ group.title | downcase | replace: ' ', '-' }}/{{ link.title | downcase | replace: ' ', '-' || page.title | downcase | replace: ' ', '-'  }}">
+          {{ group.title }}
+        </a>
+      </li>
+    {% endfor %}
+  </ul>
+  <ul class="nav nav-pills pull-right">
+    <li class="nav-item">
+      <a class="nav-link" href="{{ site.expo }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Expo');">Expo</a>
+    </li>
+    <li class="nav-item">
+      <a class="nav-link" href="{{ site.blog }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Blog');">Blog</a>
+    </li>
+  </ul>
 </header>
-