Merge branch 'v4' of github.com:twbs/derpstrap into v4

docs/components/scrollspy.md

@@ -14,35 +14,21 @@ group: components
 The ScrollSpy plugin is for automatically updating nav targets based on scroll position. Scroll the area below the navbar and watch the active class change. The dropdown sub items will be highlighted as well.
 
 <div class="bd-example">
-  <nav id="navbar-example2" class="navbar navbar-default navbar-static" role="navigation">
-    <div class="container-fluid">
-      <div class="navbar-header">
-        <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".bd-example-js-navbar-scrollspy">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
-        <a class="navbar-brand" href="#">Project Name</a>
-      </div>
-      <div class="collapse navbar-collapse bd-example-js-navbar-scrollspy">
-        <ul class="nav navbar-nav">
-          <li><a href="#fat">@fat</a></li>
-          <li><a href="#mdo">@mdo</a></li>
-          <li class="dropdown">
-            <a href="#" id="navbarDrop1" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-              Dropdown
-            </a>
-            <ul class="dropdown-menu" aria-labelledby="navbarDrop1">
-              <li><a href="#one">one</a></li>
-              <li><a href="#two">two</a></li>
-              <li role="separator" class="divider"></li>
-              <li><a href="#three">three</a></li>
-            </ul>
-          </li>
+  <nav id="navbar-example2" class="navbar navbar-default" role="navigation">
+    <h3 class="navbar-brand">Project Name</h3>
+    <ul class="nav nav-pills">
+      <li class="nav-item"><a class="nav-link" href="#fat">@fat</a></li>
+      <li class="nav-item"><a class="nav-link" href="#mdo">@mdo</a></li>
+      <li class="nav-item">
+        <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
+        <ul class="dropdown-menu">
+          <li><a href="#one">one</a></li>
+          <li><a href="#two">two</a></li>
+          <li role="separator" class="divider"></li>
+          <li><a href="#three">three</a></li>
         </ul>
-      </div>
-    </div>
+      </li>
+    </ul>
   </nav>
   <div data-spy="scroll" data-target="#navbar-example2" data-offset="0" class="scrollspy-example">
     <h4 id="fat">@fat</h4>

docs/content/typography.md

@@ -179,7 +179,7 @@ For quoting blocks of content from another source within your document. Wrap `<b
 Add a `<footer>` for identifying the source. Wrap the name of the source work in `<cite>`.
 
 {% example html %}
-<blockquote>
+<blockquote class="blockquote">
   <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
   <footer>Someone famous in <cite title="Source Title">Source Title</cite></footer>
 </blockquote>
@@ -190,7 +190,7 @@ Add a `<footer>` for identifying the source. Wrap the name of the source work in
 Add `.blockquote-reverse` for a blockquote with right-aligned content.
 
 {% example html %}
-<blockquote class="blockquote-reverse">
+<blockquote class="blockquote blockquote-reverse">
   <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
   <footer>Someone famous in <cite title="Source Title">Source Title</cite></footer>
 </blockquote>

docs/index.html

@@ -28,7 +28,7 @@ title: Bootstrap · The world's most popular mobile-first and responsive f
         <h4>Managed dependencies</h4>
         <p>Include Bootstrap's source Sass and JavaScript files via Bower, Composer, Meteor, or npm. Package managed installs don't include documentation, but do include our Gruntfile and readme.</p>
         <p>
-          <a class="btn btn-primary" href="">View install methods</a>
+          <a class="btn btn-bs btn-outline" href="">View install methods</a>
         </p>
       </div>
       <!-- <div class="col-sm-4">
@@ -51,7 +51,7 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
     <hr class="half-rule">
 
     <p class="lead">More customized builds of Bootstrap's CSS and JS are also available.</p>
-    <a href="{{ site.baseurl }}/getting-started/download" class="btn btn-outline btn-lg">More download options</a>
+    <a href="{{ site.baseurl }}/getting-started/download" class="btn btn-bs btn-outline btn-lg">More download options</a>
   </div>
 </div>
 
@@ -83,7 +83,7 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
     <hr class="half-rule">
 
     <p class="lead">Bootstrap is open source. It's hosted, developed, and maintained on GitHub.</p>
-    <a href="{{ site.repo }}" class="btn btn-outline btn-lg">View the GitHub project</a>
+    <a href="{{ site.repo }}" class="btn btn-bs btn-outline btn-lg">View the GitHub project</a>
   </div>
 </div>
 
@@ -107,6 +107,6 @@ title: Bootstrap &middot; The world's most popular mobile-first and responsive f
     <hr class="half-rule">
 
     <p class="lead">We showcase dozens of inspiring projects built with Bootstrap on the Bootstrap Expo.</p>
-    <a href="{{ site.expo }}" class="btn btn-outline btn-lg">Explore the Expo</a>
+    <a href="{{ site.expo }}" class="btn btn-bs btn-outline btn-lg">Explore the Expo</a>
   </div>
 </div>

scss/_variables.scss

@@ -14,6 +14,8 @@
 // Grid breakpoints
 // Grid containers
 // Grid columns
+// Fonts
+// Components
 
 
 // Colors
@@ -53,6 +55,7 @@ $enable-hover-media-query:  false !default;
 $spacer:                     1rem !default;
 $spacer-x:                   $spacer !default;
 $spacer-y:                   $spacer !default;
+$border-width:               .0625rem !default;
 
 
 // Body
@@ -152,7 +155,6 @@ $headings-font-weight:       500 !default;
 $headings-line-height:       1.1 !default;
 $headings-color:             inherit !default;
 
-$border-width:               .0625rem !default;
 
 
 // Components