.btn-default to .btn-secondary

5 files changed, 88 insertions, 88 deletions

diff --git a/docs/_includes/components/button-dropdowns.html b/docs/_includes/components/button-dropdowns.html
index d70e97c32..0b67620bc 100644
--- a/docs/_includes/components/button-dropdowns.html
+++ b/docs/_includes/components/button-dropdowns.html
@@ -12,7 +12,7 @@
   <p>Turn a button into a dropdown toggle with some basic markup changes.</p>
   <div class="bs-example">
     <div class="btn-group">
-      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Default</button>
+      <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">Default</button>
       <ul class="dropdown-menu" role="menu">
         <li><a href="#">Action</a></li>
         <li><a href="#">Another action</a></li>
@@ -75,7 +75,7 @@
 {% highlight html %}
 <!-- Single button -->
 <div class="btn-group">
-  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
     Action
   </button>
   <ul class="dropdown-menu" role="menu">
@@ -92,8 +92,8 @@
   <p>Similarly, create split button dropdowns with the same markup changes, only with a separate button.</p>
   <div class="bs-example">
     <div class="btn-group">
-      <button type="button" class="btn btn-default">Default</button>
-      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+      <button type="button" class="btn btn-secondary">Default</button>
+      <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
         <span class="sr-only">Toggle Dropdown</span>
       </button>
       <ul class="dropdown-menu" role="menu">
@@ -192,7 +192,7 @@
   <div class="bs-example">
     <div class="btn-toolbar" role="toolbar">
       <div class="btn-group">
-        <button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown">
+        <button class="btn btn-secondary btn-lg dropdown-toggle" type="button" data-toggle="dropdown">
           Large button
         </button>
         <ul class="dropdown-menu" role="menu">
@@ -206,7 +206,7 @@
     </div><!-- /btn-toolbar -->
     <div class="btn-toolbar" role="toolbar">
       <div class="btn-group">
-        <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
+        <button class="btn btn-secondary btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
           Small button
         </button>
         <ul class="dropdown-menu" role="menu">
@@ -220,7 +220,7 @@
     </div><!-- /btn-toolbar -->
     <div class="btn-toolbar" role="toolbar">
       <div class="btn-group">
-        <button class="btn btn-default btn-xs dropdown-toggle" type="button" data-toggle="dropdown">
+        <button class="btn btn-secondary btn-xs dropdown-toggle" type="button" data-toggle="dropdown">
           Extra small button
         </button>
         <ul class="dropdown-menu" role="menu">
@@ -236,7 +236,7 @@
 {% highlight html %}
 <!-- Large button group -->
 <div class="btn-group">
-  <button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown">
+  <button class="btn btn-secondary btn-lg dropdown-toggle" type="button" data-toggle="dropdown">
     Large button
   </button>
   <ul class="dropdown-menu" role="menu">
@@ -246,7 +246,7 @@
 
 <!-- Small button group -->
 <div class="btn-group">
-  <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
+  <button class="btn btn-secondary btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
     Small button
   </button>
   <ul class="dropdown-menu" role="menu">
@@ -256,7 +256,7 @@
 
 <!-- Extra small button group -->
 <div class="btn-group">
-  <button class="btn btn-default btn-xs dropdown-toggle" type="button" data-toggle="dropdown">
+  <button class="btn btn-secondary btn-xs dropdown-toggle" type="button" data-toggle="dropdown">
     Extra small button
   </button>
   <ul class="dropdown-menu" role="menu">
@@ -270,8 +270,8 @@
   <div class="bs-example">
     <div class="btn-toolbar" role="toolbar">
       <div class="btn-group dropup">
-        <button type="button" class="btn btn-default">Dropup</button>
-        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+        <button type="button" class="btn btn-secondary">Dropup</button>
+        <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
           <span class="sr-only">Toggle Dropdown</span>
         </button>
         <ul class="dropdown-menu" role="menu">
@@ -299,8 +299,8 @@
   </div><!-- /example -->
 {% highlight html %}
 <div class="btn-group dropup">
-  <button type="button" class="btn btn-default">Dropup</button>
-  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+  <button type="button" class="btn btn-secondary">Dropup</button>
+  <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
     <span class="sr-only">Toggle Dropdown</span>
   </button>
   <ul class="dropdown-menu" role="menu">
diff --git a/docs/_includes/components/button-groups.html b/docs/_includes/components/button-groups.html
index 652d21b03..027d3b728 100644
--- a/docs/_includes/components/button-groups.html
+++ b/docs/_includes/components/button-groups.html
@@ -12,16 +12,16 @@
   <p>Wrap a series of buttons with <code>.btn</code> in <code>.btn-group</code>.</p>
   <div class="bs-example">
     <div class="btn-group" style="margin: 9px 0 5px;">
-      <button type="button" class="btn btn-default">Left</button>
-      <button type="button" class="btn btn-default">Middle</button>
-      <button type="button" class="btn btn-default">Right</button>
+      <button type="button" class="btn btn-secondary">Left</button>
+      <button type="button" class="btn btn-secondary">Middle</button>
+      <button type="button" class="btn btn-secondary">Right</button>
     </div>
   </div>
 {% highlight html %}
 <div class="btn-group">
-  <button type="button" class="btn btn-default">Left</button>
-  <button type="button" class="btn btn-default">Middle</button>
-  <button type="button" class="btn btn-default">Right</button>
+  <button type="button" class="btn btn-secondary">Left</button>
+  <button type="button" class="btn btn-secondary">Middle</button>
+  <button type="button" class="btn btn-secondary">Right</button>
 </div>
 {% endhighlight %}
 
@@ -30,18 +30,18 @@
   <div class="bs-example">
     <div class="btn-toolbar" role="toolbar" style="margin: 0;">
       <div class="btn-group">
-        <button type="button" class="btn btn-default">1</button>
-        <button type="button" class="btn btn-default">2</button>
-        <button type="button" class="btn btn-default">3</button>
-        <button type="button" class="btn btn-default">4</button>
+        <button type="button" class="btn btn-secondary">1</button>
+        <button type="button" class="btn btn-secondary">2</button>
+        <button type="button" class="btn btn-secondary">3</button>
+        <button type="button" class="btn btn-secondary">4</button>
       </div>
       <div class="btn-group">
-        <button type="button" class="btn btn-default">5</button>
-        <button type="button" class="btn btn-default">6</button>
-        <button type="button" class="btn btn-default">7</button>
+        <button type="button" class="btn btn-secondary">5</button>
+        <button type="button" class="btn btn-secondary">6</button>
+        <button type="button" class="btn btn-secondary">7</button>
       </div>
       <div class="btn-group">
-        <button type="button" class="btn btn-default">8</button>
+        <button type="button" class="btn btn-secondary">8</button>
       </div>
     </div>
   </div>
@@ -58,30 +58,30 @@
   <div class="bs-example">
     <div class="btn-toolbar" role="toolbar">
       <div class="btn-group btn-group-lg">
-        <button type="button" class="btn btn-default">Left</button>
-        <button type="button" class="btn btn-default">Middle</button>
-        <button type="button" class="btn btn-default">Right</button>
+        <button type="button" class="btn btn-secondary">Left</button>
+        <button type="button" class="btn btn-secondary">Middle</button>
+        <button type="button" class="btn btn-secondary">Right</button>
       </div>
     </div>
     <div class="btn-toolbar" role="toolbar">
       <div class="btn-group">
-        <button type="button" class="btn btn-default">Left</button>
-        <button type="button" class="btn btn-default">Middle</button>
-        <button type="button" class="btn btn-default">Right</button>
+        <button type="button" class="btn btn-secondary">Left</button>
+        <button type="button" class="btn btn-secondary">Middle</button>
+        <button type="button" class="btn btn-secondary">Right</button>
       </div>
     </div>
     <div class="btn-toolbar" role="toolbar">
       <div class="btn-group btn-group-sm">
-        <button type="button" class="btn btn-default">Left</button>
-        <button type="button" class="btn btn-default">Middle</button>
-        <button type="button" class="btn btn-default">Right</button>
+        <button type="button" class="btn btn-secondary">Left</button>
+        <button type="button" class="btn btn-secondary">Middle</button>
+        <button type="button" class="btn btn-secondary">Right</button>
       </div>
     </div>
     <div class="btn-toolbar" role="toolbar">
       <div class="btn-group btn-group-xs">
-        <button type="button" class="btn btn-default">Left</button>
-        <button type="button" class="btn btn-default">Middle</button>
-        <button type="button" class="btn btn-default">Right</button>
+        <button type="button" class="btn btn-secondary">Left</button>
+        <button type="button" class="btn btn-secondary">Middle</button>
+        <button type="button" class="btn btn-secondary">Right</button>
       </div>
     </div>
   </div>
@@ -96,11 +96,11 @@
   <p>Place a <code>.btn-group</code> within another <code>.btn-group</code> when you want dropdown menus mixed with a series of buttons.</p>
   <div class="bs-example">
     <div class="btn-group">
-      <button type="button" class="btn btn-default">1</button>
-      <button type="button" class="btn btn-default">2</button>
+      <button type="button" class="btn btn-secondary">1</button>
+      <button type="button" class="btn btn-secondary">2</button>
 
       <div class="btn-group">
-        <button id="btnGroupDrop1" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+        <button id="btnGroupDrop1" type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
           Dropdown
         </button>
         <ul class="dropdown-menu" role="menu" aria-labelledby="btnGroupDrop1">
@@ -112,11 +112,11 @@
   </div>
 {% highlight html %}
 <div class="btn-group">
-  <button type="button" class="btn btn-default">1</button>
-  <button type="button" class="btn btn-default">2</button>
+  <button type="button" class="btn btn-secondary">1</button>
+  <button type="button" class="btn btn-secondary">2</button>
 
   <div class="btn-group">
-    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+    <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
       Dropdown
     </button>
     <ul class="dropdown-menu" role="menu">
@@ -131,10 +131,10 @@
   <p>Make a set of buttons appear vertically stacked rather than horizontally. <strong class="text-danger">Split button dropdowns are not supported here.</strong></p>
   <div class="bs-example">
     <div class="btn-group-vertical">
-      <button type="button" class="btn btn-default">Button</button>
-      <button type="button" class="btn btn-default">Button</button>
+      <button type="button" class="btn btn-secondary">Button</button>
+      <button type="button" class="btn btn-secondary">Button</button>
       <div class="btn-group">
-        <button id="btnGroupVerticalDrop1" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+        <button id="btnGroupVerticalDrop1" type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
           Dropdown
         </button>
         <ul class="dropdown-menu" role="menu" aria-labelledby="btnGroupVerticalDrop1">
@@ -142,10 +142,10 @@
           <li><a href="#">Dropdown link</a></li>
         </ul>
       </div>
-      <button type="button" class="btn btn-default">Button</button>
-      <button type="button" class="btn btn-default">Button</button>
+      <button type="button" class="btn btn-secondary">Button</button>
+      <button type="button" class="btn btn-secondary">Button</button>
       <div class="btn-group">
-        <button id="btnGroupVerticalDrop2" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+        <button id="btnGroupVerticalDrop2" type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
           Dropdown
         </button>
         <ul class="dropdown-menu" role="menu" aria-labelledby="btnGroupVerticalDrop2">
@@ -154,7 +154,7 @@
         </ul>
       </div>
       <div class="btn-group">
-        <button id="btnGroupVerticalDrop3" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+        <button id="btnGroupVerticalDrop3" type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
           Dropdown
         </button>
         <ul class="dropdown-menu" role="menu" aria-labelledby="btnGroupVerticalDrop3">
@@ -163,7 +163,7 @@
         </ul>
       </div>
       <div class="btn-group">
-        <button id="btnGroupVerticalDrop4" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+        <button id="btnGroupVerticalDrop4" type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
           Dropdown
         </button>
         <ul class="dropdown-menu" role="menu" aria-labelledby="btnGroupVerticalDrop4">
@@ -196,16 +196,16 @@
   <p>Just wrap a series of <code>.btn</code>s in <code>.btn-group.btn-group-justified</code>.</p>
   <div class="bs-example">
     <div class="btn-group btn-group-justified">
-      <a class="btn btn-default" role="button">Left</a>
-      <a class="btn btn-default" role="button">Middle</a>
-      <a class="btn btn-default" role="button">Right</a>
+      <a class="btn btn-secondary" role="button">Left</a>
+      <a class="btn btn-secondary" role="button">Middle</a>
+      <a class="btn btn-secondary" role="button">Right</a>
     </div>
     <br>
     <div class="btn-group btn-group-justified">
-      <a class="btn btn-default" role="button">Left</a>
-      <a class="btn btn-default" role="button">Middle</a>
+      <a class="btn btn-secondary" role="button">Left</a>
+      <a class="btn btn-secondary" role="button">Middle</a>
       <div class="btn-group">
-        <a class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+        <a class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
           Dropdown
         </a>
         <ul class="dropdown-menu" role="menu">
@@ -229,26 +229,26 @@
   <div class="bs-example">
     <div class="btn-group btn-group-justified">
       <div class="btn-group">
-        <button type="button" class="btn btn-default">Left</button>
+        <button type="button" class="btn btn-secondary">Left</button>
       </div>
       <div class="btn-group">
-        <button type="button" class="btn btn-default">Middle</button>
+        <button type="button" class="btn btn-secondary">Middle</button>
       </div>
       <div class="btn-group">
-        <button type="button" class="btn btn-default">Right</button>
+        <button type="button" class="btn btn-secondary">Right</button>
       </div>
     </div>
   </div>
 {% highlight html %}
 <div class="btn-group btn-group-justified">
   <div class="btn-group">
-    <button type="button" class="btn btn-default">Left</button>
+    <button type="button" class="btn btn-secondary">Left</button>
   </div>
   <div class="btn-group">
-    <button type="button" class="btn btn-default">Middle</button>
+    <button type="button" class="btn btn-secondary">Middle</button>
   </div>
   <div class="btn-group">
-    <button type="button" class="btn btn-default">Right</button>
+    <button type="button" class="btn btn-secondary">Right</button>
   </div>
 </div>
 {% endhighlight %}
diff --git a/docs/_includes/components/dropdowns.html b/docs/_includes/components/dropdowns.html
index 6edd98607..4462900ef 100644
--- a/docs/_includes/components/dropdowns.html
+++ b/docs/_includes/components/dropdowns.html
@@ -7,7 +7,7 @@
   <p>Wrap the dropdown's trigger and the dropdown menu within <code>.dropdown</code>, or another element that declares <code>position: relative;</code>. Then add the menu's HTML.</p>
   <div class="bs-example">
     <div class="dropdown clearfix">
-      <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
+      <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
         Dropdown
       </button>
       <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
@@ -21,7 +21,7 @@
   </div><!-- /example -->
 {% highlight html %}
 <div class="dropdown">
-  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
+  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
     Dropdown
   </button>
   <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
@@ -54,7 +54,7 @@
   <p>Add a header to label sections of actions in any dropdown menu.</p>
   <div class="bs-example">
     <div class="dropdown clearfix">
-      <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown">
+      <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown">
         Dropdown
       </button>
       <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu2">
@@ -82,7 +82,7 @@
   <p>Add <code>.disabled</code> to a <code>&lt;li&gt;</code> in the dropdown to disable the link.</p>
   <div class="bs-example">
     <div class="dropdown clearfix">
-      <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu3" data-toggle="dropdown">
+      <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu3" data-toggle="dropdown">
         Dropdown
       </button>
       <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu3">
diff --git a/docs/_includes/components/input-groups.html b/docs/_includes/components/input-groups.html
index 148cb957c..ae0ce4613 100644
--- a/docs/_includes/components/input-groups.html
+++ b/docs/_includes/components/input-groups.html
@@ -143,7 +143,7 @@
       <div class="col-lg-6">
         <div class="input-group">
           <span class="input-group-btn">
-            <button class="btn btn-default" type="button">Go!</button>
+            <button class="btn btn-secondary" type="button">Go!</button>
           </span>
           <input type="text" class="form-control">
         </div><!-- /input-group -->
@@ -152,7 +152,7 @@
         <div class="input-group">
           <input type="text" class="form-control">
           <span class="input-group-btn">
-            <button class="btn btn-default" type="button">Go!</button>
+            <button class="btn btn-secondary" type="button">Go!</button>
           </span>
         </div><!-- /input-group -->
       </div><!-- /.col-lg-6 -->
@@ -163,7 +163,7 @@
   <div class="col-lg-6">
     <div class="input-group">
       <span class="input-group-btn">
-        <button class="btn btn-default" type="button">Go!</button>
+        <button class="btn btn-secondary" type="button">Go!</button>
       </span>
       <input type="text" class="form-control">
     </div><!-- /input-group -->
@@ -172,7 +172,7 @@
     <div class="input-group">
       <input type="text" class="form-control">
       <span class="input-group-btn">
-        <button class="btn btn-default" type="button">Go!</button>
+        <button class="btn btn-secondary" type="button">Go!</button>
       </span>
     </div><!-- /input-group -->
   </div><!-- /.col-lg-6 -->
@@ -186,7 +186,7 @@
       <div class="col-lg-6">
         <div class="input-group">
           <div class="input-group-btn">
-            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action</button>
+            <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">Action</button>
             <ul class="dropdown-menu" role="menu">
               <li><a href="#">Action</a></li>
               <li><a href="#">Another action</a></li>
@@ -202,7 +202,7 @@
         <div class="input-group">
           <input type="text" class="form-control">
           <div class="input-group-btn">
-            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action</button>
+            <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">Action</button>
             <ul class="dropdown-menu dropdown-menu-right" role="menu">
               <li><a href="#">Action</a></li>
               <li><a href="#">Another action</a></li>
@@ -220,7 +220,7 @@
   <div class="col-lg-6">
     <div class="input-group">
       <div class="input-group-btn">
-        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action</button>
+        <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">Action</button>
         <ul class="dropdown-menu" role="menu">
           <li><a href="#">Action</a></li>
           <li><a href="#">Another action</a></li>
@@ -236,7 +236,7 @@
     <div class="input-group">
       <input type="text" class="form-control">
       <div class="input-group-btn">
-        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action</button>
+        <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">Action</button>
         <ul class="dropdown-menu dropdown-menu-right" role="menu">
           <li><a href="#">Action</a></li>
           <li><a href="#">Another action</a></li>
@@ -256,8 +256,8 @@
       <div class="col-lg-6">
         <div class="input-group">
           <div class="input-group-btn">
-            <button type="button" class="btn btn-default" tabindex="-1">Action</button>
-            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" tabindex="-1">
+            <button type="button" class="btn btn-secondary" tabindex="-1">Action</button>
+            <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" tabindex="-1">
               <span class="sr-only">Toggle Dropdown</span>
             </button>
             <ul class="dropdown-menu" role="menu">
@@ -275,8 +275,8 @@
         <div class="input-group">
           <input type="text" class="form-control">
           <div class="input-group-btn">
-            <button type="button" class="btn btn-default" tabindex="-1">Action</button>
-            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" tabindex="-1">
+            <button type="button" class="btn btn-secondary" tabindex="-1">Action</button>
+            <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" tabindex="-1">
               <span class="sr-only">Toggle Dropdown</span>
             </button>
             <ul class="dropdown-menu dropdown-menu-right" role="menu">
diff --git a/docs/_includes/components/navbar.html b/docs/_includes/components/navbar.html
index 81097b0b0..7e6a9c89f 100644
--- a/docs/_includes/components/navbar.html
+++ b/docs/_includes/components/navbar.html
@@ -58,7 +58,7 @@
             <div class="form-group">
               <input type="text" class="form-control" placeholder="Search">
             </div>
-            <button type="submit" class="btn btn-default">Submit</button>
+            <button type="submit" class="btn btn-secondary">Submit</button>
           </form>
           <ul class="nav navbar-nav navbar-right">
             <li><a href="#">Link</a></li>
@@ -113,7 +113,7 @@
         <div class="form-group">
           <input type="text" class="form-control" placeholder="Search">
         </div>
-        <button type="submit" class="btn btn-default">Submit</button>
+        <button type="submit" class="btn btn-secondary">Submit</button>
       </form>
       <ul class="nav navbar-nav navbar-right">
         <li><a href="#">Link</a></li>
@@ -190,7 +190,7 @@
             <div class="form-group">
               <input type="text" class="form-control" placeholder="Search">
             </div>
-            <button type="submit" class="btn btn-default">Submit</button>
+            <button type="submit" class="btn btn-secondary">Submit</button>
           </form>
         </div>
       </div>
@@ -201,7 +201,7 @@
   <div class="form-group">
     <input type="text" class="form-control" placeholder="Search">
   </div>
-  <button type="submit" class="btn btn-default">Submit</button>
+  <button type="submit" class="btn btn-secondary">Submit</button>
 </form>
 {% endhighlight %}
 
@@ -231,13 +231,13 @@
           <a class="navbar-brand" href="#">Brand</a>
         </div>
         <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-3">
-          <button type="button" class="btn btn-default navbar-btn">Sign in</button>
+          <button type="button" class="btn btn-secondary navbar-btn">Sign in</button>
         </div>
       </div>
     </nav>
   </div>
 {% highlight html %}
-<button type="button" class="btn btn-default navbar-btn">Sign in</button>
+<button type="button" class="btn btn-secondary navbar-btn">Sign in</button>
 {% endhighlight %}
 
   <div class="bs-callout bs-callout-warning">