update themes to 3.0.0-rc2

2 files changed, 99 insertions, 81 deletions

diff --git a/tests/components.html b/tests/components.html
index b4234e94..836260f0 100644
--- a/tests/components.html
+++ b/tests/components.html
@@ -12,13 +12,15 @@
 
     <div class="navbar navbar-fixed-top">
       <div class="container">
-        <a href="../" class="navbar-brand">Bootswatch</a>
-        <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
-        <div class="nav-collapse collapse" id="navbar-main">
+        <div class="nav-header">
+          <a href="../" class="navbar-brand">Bootswatch</a>
+          <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </button>
+        </div>
+        <div class="navbar-collapse collapse" id="navbar-main">
           <ul class="nav navbar-nav">
             <li class="dropdown">
               <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="themes">Themes <span class="caret"></span></a>
@@ -57,7 +59,7 @@
             </li>
           </ul>
 
-          <ul class="nav navbar-nav pull-right">
+          <ul class="nav navbar-nav navbar-right">
             <li><a href="http://builtwithbootstrap.com/" target="_blank">Built With Bootstrap</a></li>
             <li><a href="https://wrapbootstrap.com/?ref=bsw" target="_blank">WrapBootstrap</a></li>
           </ul>
@@ -862,31 +864,31 @@
         </div>
 
         <h2 id="buttons-sizes">Button sizes</h2>
-        <p>Fancy larger or smaller buttons? Add <code>.btn-large</code> or <code>.btn-small</code> for additional sizes.</p>
+        <p>Fancy larger or smaller buttons? Add <code>.btn-lg</code> or <code>.btn-sm</code> for additional sizes.</p>
         <div class="bs-example">
           <p>
-            <button type="button" class="btn btn-primary btn-large">Large button</button>
-            <button type="button" class="btn btn-default btn-large">Large button</button>
+            <button type="button" class="btn btn-primary btn-lg">Large button</button>
+            <button type="button" class="btn btn-default btn-lg">Large button</button>
           </p>
           <p>
             <button type="button" class="btn btn-primary">Default button</button>
             <button type="button" class="btn btn-default">Default button</button>
           </p>
           <p>
-            <button type="button" class="btn btn-primary btn-small">Small button</button>
-            <button type="button" class="btn btn-default btn-small">Small button</button>
+            <button type="button" class="btn btn-primary btn-sm">Small button</button>
+            <button type="button" class="btn btn-default btn-sm">Small button</button>
           </p>
           <p>
-            <button type="button" class="btn btn-primary btn-mini">Mini button</button>
-            <button type="button" class="btn btn-default btn-mini">Mini button</button>
+            <button type="button" class="btn btn-primary btn-xs">Mini button</button>
+            <button type="button" class="btn btn-default btn-xs">Mini button</button>
           </p>
         </div>
 
         <p>Create block level buttons—those that span the full width of a parent— by adding <code>.btn-block</code>.</p>
         <div class="bs-example">
           <div class="well" style="max-width: 400px; margin: 0 auto 10px;">
-            <button type="button" class="btn btn-primary btn-large btn-block">Block level button</button>
-            <button type="button" class="btn btn-default btn-large btn-block">Block level button</button>
+            <button type="button" class="btn btn-primary btn-lg btn-block">Block level button</button>
+            <button type="button" class="btn btn-default btn-lg btn-block">Block level button</button>
           </div>
         </div>
 
@@ -897,15 +899,15 @@
         <h3>Button element</h3>
         <p>Add the <code>disabled</code> attribute to <code>&lt;button&gt;</code> buttons.</p>
         <p class="bs-example">
-          <button type="button" class="btn btn-primary btn-large" disabled="disabled">Primary button</button>
-          <button type="button" class="btn btn-default btn-large" disabled="disabled">Button</button>
+          <button type="button" class="btn btn-primary btn-lg" disabled="disabled">Primary button</button>
+          <button type="button" class="btn btn-default btn-lg" disabled="disabled">Button</button>
         </p>
 
         <h3>Anchor element</h3>
         <p>Add the <code>.disabled</code> class to <code>&lt;a&gt;</code> buttons.</p>
         <p class="bs-example">
-          <a href="http://getbootstrap.com/css/#" class="btn btn-primary btn-large disabled">Primary link</a>
-          <a href="http://getbootstrap.com/css/#" class="btn btn-default btn-large disabled">Link</a>
+          <a href="http://getbootstrap.com/css/#" class="btn btn-primary btn-lg disabled">Primary link</a>
+          <a href="http://getbootstrap.com/css/#" class="btn btn-default btn-lg disabled">Link</a>
         </p>
 
 
@@ -1228,7 +1230,7 @@
               </ul>
             </div><!-- /btn-group -->
             <div class="btn-group">
-              <button class="btn btn-default btn-small dropdown-toggle" type="button" data-toggle="dropdown">
+              <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
                 Small button <span class="caret"></span>
               </button>
               <ul class="dropdown-menu">
@@ -1623,14 +1625,14 @@
         <div class="bs-example">
 
           <div class="navbar">
-            <form class="navbar-form pull-left">
+            <form class="navbar-form navbar-left">
               <input type="text" class="form-control" style="width: 200px;">
               <button type="submit" class="btn btn-default">Submit</button>
             </form>
           </div>
 
           <div class="navbar">
-            <form class="navbar-form pull-left">
+            <form class="navbar-form navbar-left">
               <select name="" class="form-control" style="width: 200px;">
                 <option value="1">1</option>
                 <option value="2">2</option>
@@ -1642,7 +1644,7 @@
           </div>
 
           <div class="navbar">
-            <form class="navbar-form pull-left">
+            <form class="navbar-form navbar-left">
               <input type="text" class="form-control" style="width: 200px;">
               <input type="checkbox">
               <button type="submit" class="btn btn-default">Submit</button>
@@ -1650,7 +1652,7 @@
           </div>
 
           <div class="navbar">
-            <form class="navbar-form pull-left">
+            <form class="navbar-form navbar-left">
               <input type="text" class="form-control" style="width: 200px;">
               <label class="checkbox-inline">
                 <input type="checkbox"> Remember me
@@ -1708,17 +1710,19 @@
 
 
         <h2 id="navbar-responsive">Responsive navbar</h2>
-        <p>To implement a collapsing responsive navbar, wrap your navbar content in a containing div, <code>.nav-collapse.collapse</code>, and add the navbar toggle button, <code>.navbar-toggle</code>.</p>
+        <p>To implement a collapsing responsive navbar, wrap your navbar content in a containing div, <code>.navbar-collapse.collapse</code>, and add the navbar toggle button, <code>.navbar-toggle</code>.</p>
         <div class="bs-example">
           <div class="navbar">
             <div class="container">
-              <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
-                <span class="icon-bar"></span>
-                <span class="icon-bar"></span>
-                <span class="icon-bar"></span>
-              </button>
-              <a class="navbar-brand" href="#">Title</a>
-              <div class="nav-collapse collapse navbar-responsive-collapse">
+              <div class="nav-header">
+                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
+                  <span class="icon-bar"></span>
+                  <span class="icon-bar"></span>
+                  <span class="icon-bar"></span>
+                </button>
+                <a class="navbar-brand" href="#">Title</a>
+              </div>
+              <div class="navbar-collapse collapse navbar-responsive-collapse">
                 <ul class="nav navbar-nav">
                   <li class="active"><a href="#">Home</a></li>
                   <li><a href="#">Link</a></li>
@@ -1736,10 +1740,10 @@
                     </ul>
                   </li>
                 </ul>
-                <form class="navbar-form pull-left">
+                <form class="navbar-form navbar-left">
                   <input type="text" class="form-control col-lg-8" placeholder="Search">
                 </form>
-                <ul class="nav navbar-nav pull-right">
+                <ul class="nav navbar-nav navbar-right">
                   <li><a href="#">Link</a></li>
                   <li class="dropdown">
                     <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
@@ -1752,7 +1756,7 @@
                     </ul>
                   </li>
                 </ul>
-              </div><!-- /.nav-collapse -->
+              </div><!-- /.navbar-collapse -->
             </div><!-- /.container -->
           </div><!-- /.navbar -->
         </div><!-- /example -->
@@ -1768,13 +1772,15 @@
         <div class="bs-example">
           <div class="navbar navbar-inverse">
             <div class="container">
-              <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-inverse-collapse">
-                <span class="icon-bar"></span>
-                <span class="icon-bar"></span>
-                <span class="icon-bar"></span>
-              </button>
-              <a class="navbar-brand" href="#">Title</a>
-              <div class="nav-collapse collapse navbar-inverse-collapse">
+              <div class="nav-header">
+                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-inverse-collapse">
+                  <span class="icon-bar"></span>
+                  <span class="icon-bar"></span>
+                  <span class="icon-bar"></span>
+                </button>
+                <a class="navbar-brand" href="#">Title</a>
+              </div>
+              <div class="navbar-collapse collapse navbar-inverse-collapse">
                 <ul class="nav navbar-nav">
                   <li class="active"><a href="#">Home</a></li>
                   <li><a href="#">Link</a></li>
@@ -1792,10 +1798,10 @@
                     </ul>
                   </li>
                 </ul>
-                <form class="navbar-form pull-left">
+                <form class="navbar-form navbar-left">
                   <input type="text" class="form-control col-lg-8" placeholder="Search">
                 </form>
-                <ul class="nav navbar-nav pull-right">
+                <ul class="nav navbar-nav navbar-right">
                   <li><a href="#">Link</a></li>
                   <li class="dropdown">
                     <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
@@ -1808,7 +1814,7 @@
                     </ul>
                   </li>
                 </ul>
-              </div><!-- /.nav-collapse -->
+              </div><!-- /.navbar-collapse -->
             </div><!-- /.container -->
           </div><!-- /.navbar -->
         </div><!-- /example -->
@@ -1976,7 +1982,7 @@
         <h3>Available variations</h3>
         <p>Add any of the below mentioned modifier classes to change the appearance of a label.</p>
         <div class="bs-example">
-          <span class="label">Default</span>
+          <span class="label label-default">Default</span>
           <span class="label label-success">Success</span>
           <span class="label label-warning">Warning</span>
           <span class="label label-danger">Danger</span>
@@ -2050,7 +2056,7 @@
           <div class="jumbotron">
             <h1>Hello, world!</h1>
             <p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
-            <p><a class="btn btn-primary btn-large">Learn more</a></p>
+            <p><a class="btn btn-primary btn-lg">Learn more</a></p>
           </div>
         </div>
 
@@ -2166,28 +2172,18 @@
           </div>
         </div>
 
-        <h3 id="alerts-block">Block alerts</h3>
-        <p>For longer messages, increase the padding on the top and bottom of the alert wrapper by adding <code>.alert-block</code>.</p>
-        <div class="bs-example">
-          <div class="alert alert-block">
-            <button type="button" class="close" data-dismiss="alert">×</button>
-            <h4>Warning!</h4>
-            <p>Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
-          </div>
-        </div>
-
         <h3 id="alerts-alternatives">Contextual alternatives</h3>
         <p>Add optional classes to change an alert's connotation.</p>
         <div class="bs-example">
-          <div class="alert alert-danger">
+          <div class="alert alert-dismissable alert-danger">
             <button type="button" class="close" data-dismiss="alert">×</button>
             <strong>Oh snap!</strong> Change a few things up and try submitting again.
           </div>
-          <div class="alert alert-success">
+          <div class="alert alert-dismissable alert-success">
             <button type="button" class="close" data-dismiss="alert">×</button>
             <strong>Well done!</strong> You successfully read this important alert message.
           </div>
-          <div class="alert alert-info">
+          <div class="alert alert-dismissable alert-info">
             <button type="button" class="close" data-dismiss="alert">×</button>
             <strong>Heads up!</strong> This alert needs your attention, but it's not super important.
           </div>
@@ -2196,15 +2192,15 @@
         <h3 id="alerts-links">Links in alerts</h3>
         <p>Use the <code>.alert-link</code> utility class to quickly provide matching colored links within any alert.</p>
         <div class="bs-example">
-          <div class="alert alert-danger">
+          <div class="alert alert-dismissable alert-danger">
             <button type="button" class="close" data-dismiss="alert">×</button>
             <strong>Oh snap!</strong> <a href="#" class="alert-link">Change a few things up</a> and try submitting again.
           </div>
-          <div class="alert alert-success">
+          <div class="alert alert-dismissable alert-success">
             <button type="button" class="close" data-dismiss="alert">×</button>
             <strong>Well done!</strong> You successfully read <a href="#" class="alert-link">this important alert message</a>.
           </div>
-          <div class="alert alert-info">
+          <div class="alert alert-dismissable alert-info">
             <button type="button" class="close" data-dismiss="alert">×</button>
             <strong>Heads up!</strong> This <a href="#" class="alert-link">alert needs your attention</a>, but it's not super important.
           </div>
@@ -2487,7 +2483,9 @@
         <p>By default, all the <code>.panel</code> does is apply some basic border and padding to contain some content.</p>
         <div class="bs-example">
           <div class="panel">
-            Basic panel example
+            <div class="panel-body">
+              Basic panel example
+            </div>
           </div>
         </div>
 
@@ -2496,13 +2494,17 @@
         <div class="bs-example">
           <div class="panel">
             <div class="panel-heading">Panel heading</div>
-            Panel content
+            <div class="panel-body">
+              Panel content
+            </div>
           </div>
           <div class="panel">
             <div class="panel-heading">
               <h3 class="panel-title">Panel title</h3>
             </div>
-            Panel content
+            <div class="panel-body">
+              Panel content
+            </div>
           </div>
         </div>
 
@@ -2510,7 +2512,9 @@
         <p>Wrap buttons or secondary text in <code>.panel-footer</code>.</p>
         <div class="bs-example">
           <div class="panel">
-            Panel content
+            <div class="panel-body">
+              Panel content
+            </div>
             <div class="panel-footer">Panel footer</div>
           </div>
         </div>
@@ -2522,31 +2526,41 @@
             <div class="panel-heading">
               <h3 class="panel-title">Panel title</h3>
             </div>
-            Panel content
+            <div class="panel-body">
+              Panel content
+            </div>
           </div>
           <div class="panel panel-success">
             <div class="panel-heading">
               <h3 class="panel-title">Panel title</h3>
             </div>
-            Panel content
+            <div class="panel-body">
+              Panel content
+            </div>
           </div>
           <div class="panel panel-warning">
             <div class="panel-heading">
               <h3 class="panel-title">Panel title</h3>
             </div>
-            Panel content
+            <div class="panel-body">
+              Panel content
+            </div>
           </div>
           <div class="panel panel-danger">
             <div class="panel-heading">
               <h3 class="panel-title">Panel title</h3>
             </div>
-            Panel content
+            <div class="panel-body">
+              Panel content
+            </div>
           </div>
           <div class="panel panel-info">
             <div class="panel-heading">
               <h3 class="panel-title">Panel title</h3>
             </div>
-            Panel content
+            <div class="panel-body">
+              Panel content
+            </div>
           </div>
         </div>
 
@@ -2556,7 +2570,9 @@
           <div class="panel">
             <!-- Default panel contents -->
             <div class="panel-heading">Panel heading</div>
-            <p>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+            <div class="panel-body">
+              <p>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+            </div>
 
             <!-- List group -->
             <ul class="list-group list-group-flush">
diff --git a/tests/thumbnail.html b/tests/thumbnail.html
index b576f1b7..a983ea50 100644
--- a/tests/thumbnail.html
+++ b/tests/thumbnail.html
@@ -32,12 +32,14 @@
 
     <div class="navbar navbar-fixed-top">
       <div class="container">
-        <a href="../" class="navbar-brand">Bootswatch</a>
-        <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
+        <div class="navbar-header">
+          <a href="../" class="navbar-brand">Bootswatch</a>
+          <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+            <span class="icon-bar"></span>
+          </button>
+        </div>
         <div class="nav-collapse collapse" id="navbar-main">
           <ul class="nav navbar-nav">
             <li class="dropdown active">