Merge branch 'v3.4.0-dev' of https://github.com/twbs/bootstrap-3 into v3.4.0-dev

28 files changed, 290 insertions, 271 deletions

diff --git a/docs/_includes/footer.html b/docs/_includes/footer.html
index 3b4a026de..6acc4a9f1 100644
--- a/docs/_includes/footer.html
+++ b/docs/_includes/footer.html
@@ -6,8 +6,8 @@
     <ul class="bs-docs-footer-links">
       <li><a href="{{ site.repo }}">GitHub</a></li>
       <li><a href="https://twitter.com/getbootstrap">Twitter</a></li>
-      <li><a href="{{ site.baseurl }}/getting-started/#examples">Examples</a></li>
-      <li><a href="{{ site.baseurl }}/about/">About</a></li>
+      <li><a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/#examples">Examples</a></li>
+      <li><a href="{{ site.baseurl }}/docs/{{ site.docs_version }}/about">About</a></li>
     </ul>
 
     <p>Designed and built with all the love in the world by <a href="https://twitter.com/mdo" target="_blank">@mdo</a> and <a href="https://twitter.com/fat" target="_blank">@fat</a>. Maintained by the <a href="https://github.com/orgs/twbs/people">core team</a> with the help of <a href="https://github.com/twbs/bootstrap/graphs/contributors">our contributors</a>.</p>
diff --git a/docs/_includes/js/buttons.html b/docs/_includes/js/buttons.html
index 2249bbd70..e6ddba2db 100644
--- a/docs/_includes/js/buttons.html
+++ b/docs/_includes/js/buttons.html
@@ -16,12 +16,12 @@
     <p>For the sake of this demonstration, we are using <code>data-loading-text</code> and <code>$().button('loading')</code>, but that's not the only state you can use. <a href="#buttons-methods">See more on this below in the <code>$().button(string)</code> documentation</a>.</p>
   </div>
   <div class="bs-example">
-    <button type="button" id="loading-example-btn" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off">
+    <button type="button" id="loading-example-btn" data-loading-text="Loading..." class="btn btn-primary">
       Loading state
     </button>
   </div><!-- /example -->
 {% highlight html %}
-<button type="button" id="myButton" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off">
+<button type="button" id="myButton" data-loading-text="Loading..." class="btn btn-primary">
   Loading state
 </button>
 
@@ -41,12 +41,12 @@
     <p>For pre-toggled buttons, you must add the <code>.active</code> class and the <code>aria-pressed="true"</code> attribute to the <code>button</code> yourself.</p>
   </div>
   <div class="bs-example">
-    <button type="button" class="btn btn-primary" data-toggle="button" aria-pressed="false" autocomplete="off">
+    <button type="button" class="btn btn-primary" data-toggle="button" aria-pressed="false">
       Single toggle
     </button>
   </div><!-- /example -->
 {% highlight html %}
-<button type="button" class="btn btn-primary" data-toggle="button" aria-pressed="false" autocomplete="off">
+<button type="button" class="btn btn-primary" data-toggle="button" aria-pressed="false">
   Single toggle
 </button>
 {% endhighlight %}
@@ -64,26 +64,26 @@
   <div class="bs-example" data-example-id="buttons-checkbox">
     <div class="btn-group" data-toggle="buttons">
       <label class="btn btn-primary active">
-        <input type="checkbox" checked autocomplete="off"> Checkbox 1 (pre-checked)
+        <input type="checkbox" checked> Checkbox 1 (pre-checked)
       </label>
       <label class="btn btn-primary">
-        <input type="checkbox" autocomplete="off"> Checkbox 2
+        <input type="checkbox"> Checkbox 2
       </label>
       <label class="btn btn-primary">
-        <input type="checkbox" autocomplete="off"> Checkbox 3
+        <input type="checkbox"> Checkbox 3
       </label>
     </div>
   </div><!-- /example -->
 {% highlight html %}
 <div class="btn-group" data-toggle="buttons">
   <label class="btn btn-primary active">
-    <input type="checkbox" autocomplete="off" checked> Checkbox 1 (pre-checked)
+    <input type="checkbox" checked> Checkbox 1 (pre-checked)
   </label>
   <label class="btn btn-primary">
-    <input type="checkbox" autocomplete="off"> Checkbox 2
+    <input type="checkbox"> Checkbox 2
   </label>
   <label class="btn btn-primary">
-    <input type="checkbox" autocomplete="off"> Checkbox 3
+    <input type="checkbox"> Checkbox 3
   </label>
 </div>
 {% endhighlight %}
@@ -91,26 +91,26 @@
   <div class="bs-example" data-example-id="buttons-radio">
     <div class="btn-group" data-toggle="buttons">
       <label class="btn btn-primary active">
-        <input type="radio" name="options" id="option1" autocomplete="off" checked> Radio 1 (preselected)
+        <input type="radio" name="options" id="option1" checked> Radio 1 (preselected)
       </label>
       <label class="btn btn-primary">
-        <input type="radio" name="options" id="option2" autocomplete="off"> Radio 2
+        <input type="radio" name="options" id="option2"> Radio 2
       </label>
       <label class="btn btn-primary">
-        <input type="radio" name="options" id="option3" autocomplete="off"> Radio 3
+        <input type="radio" name="options" id="option3"> Radio 3
       </label>
     </div>
   </div><!-- /example -->
 {% highlight html %}
 <div class="btn-group" data-toggle="buttons">
   <label class="btn btn-primary active">
-    <input type="radio" name="options" id="option1" autocomplete="off" checked> Radio 1 (preselected)
+    <input type="radio" name="options" id="option1" checked> Radio 1 (preselected)
   </label>
   <label class="btn btn-primary">
-    <input type="radio" name="options" id="option2" autocomplete="off"> Radio 2
+    <input type="radio" name="options" id="option2"> Radio 2
   </label>
   <label class="btn btn-primary">
-    <input type="radio" name="options" id="option3" autocomplete="off"> Radio 3
+    <input type="radio" name="options" id="option3"> Radio 3
   </label>
 </div>
 {% endhighlight %}
@@ -126,7 +126,7 @@
   <p>Swaps text to any data defined text state.</p>
 
 {% highlight html %}
-<button type="button" id="myStateButton" data-complete-text="finished!" class="btn btn-primary" autocomplete="off">
+<button type="button" id="myStateButton" data-complete-text="finished!" class="btn btn-primary">
   ...
 </button>
 
diff --git a/docs/assets/less/ads.less b/docs/assets/less/ads.less
index 168a01fc6..9e64da520 100644
--- a/docs/assets/less/ads.less
+++ b/docs/assets/less/ads.less
@@ -1,3 +1,5 @@
+/* stylelint-disable selector-max-id, declaration-no-important */
+
 #carbonads {
   display: block;
   padding: 15px 15px 15px 160px;
diff --git a/docs/assets/less/algolia.less b/docs/assets/less/algolia.less
index b6484f04f..7cab59339 100644
--- a/docs/assets/less/algolia.less
+++ b/docs/assets/less/algolia.less
@@ -1,3 +1,5 @@
+/* stylelint-disable declaration-no-important, selector-attribute-quotes */
+
 // Docsearch overrides
 //
 // `!important` indicates overridden properties.
@@ -12,8 +14,9 @@
     padding: 10px 0 !important;
     background-color: #fff;
     background-clip: padding-box;
-    border: 1px solid rgba(0,0,0,.1);
-    box-shadow: 0 8px 15px rgba(0,0,0,.175);
+    border: 1px solid #ddd;
+    border: 1px solid rgba(0, 0, 0, .1);
+    box-shadow: 0 8px 15px rgba(0, 0, 0, .175);
 
     @media min-width(@screen-sm-min) {
       width: 175%;
@@ -79,7 +82,7 @@
       .algolia-docsearch-suggestion--category-header {
         padding-top: 10px !important;
         margin-top: 10px !important;
-        border-top: 1px solid rgba(0,0,0,.1);
+        border-top: 1px solid #eee;
       }
     }
 
@@ -100,7 +103,7 @@
     padding: 0 15px 8px !important;
     margin-top: -4px;
     font-size: 13px !important;
-    font-weight: normal;
+    font-weight: 400;
     line-height: 1.25 !important;
   }
 
@@ -112,7 +115,7 @@
     font-size: 10px !important;
     line-height: 1 !important;
     color: #767676 !important;
-    border-top: 1px solid rgba(0,0,0,.1);
+    border-top: 1px solid #eee;
   }
 
   .algolia-docsearch-footer--logo {
@@ -125,14 +128,14 @@
 
   .algolia-docsearch-suggestion--highlight {
     color: #5f2dab;
-    background-color: rgba(154, 132, 187, .12);
+    background-color: #eee;
   }
 
   .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight {
-    box-shadow: inset 0 -2px 0 0 rgba(95,45,171,.5) !important;
+    box-shadow: inset 0 -2px 0 0 rgba(95, 45, 171, .5) !important;
   }
 
   .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--content {
-    background-color: rgba(208,189,236,.15) !important;
+    background-color: #e5e5e5 !important;
   }
 }
diff --git a/docs/assets/less/anchor.less b/docs/assets/less/anchor.less
index b7718a837..3054ec8c0 100644
--- a/docs/assets/less/anchor.less
+++ b/docs/assets/less/anchor.less
@@ -1,3 +1,5 @@
+/* stylelint-disable property-no-vendor-prefix */
+
 .anchorjs-link {
   color: inherit;
 }
@@ -11,8 +13,8 @@
 *:hover > .anchorjs-link {
   opacity: .75;
   -webkit-transition: color .16s linear;
-       -o-transition: color .16s linear;
-          transition: color .16s linear;
+  -o-transition: color .16s linear;
+  transition: color .16s linear;
 }
 
 *:hover > .anchorjs-link:hover,
diff --git a/docs/assets/less/customizer.less b/docs/assets/less/customizer.less
index c36fbc15f..a87fca971 100644
--- a/docs/assets/less/customizer.less
+++ b/docs/assets/less/customizer.less
@@ -1,3 +1,5 @@
+/* stylelint-disable property-no-vendor-prefix, selector-max-id */
+
 .bs-customizer .toggle {
   float: right;
   margin-top: 25px;
@@ -36,7 +38,7 @@
 
 // For the variables, use regular weight
 #less-section label {
-  font-weight: normal;
+  font-weight: 400;
 }
 
 // Downloads
@@ -55,8 +57,8 @@
   color: #fff;
   background-color: #d9534f;
   border-bottom: 1px solid #b94441;
-  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
-          box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25);
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25);
 }
 .bs-customizer-alert .close {
   margin-top: -4px;
@@ -73,8 +75,8 @@
   color: #fff;
   background-color: #a83c3a;
   border-color: #973634;
-  -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
-          box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
+  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
+  box-shadow: inset 0 2px 4px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
 }
 
 .bs-dropzone {
@@ -97,7 +99,7 @@
 }
 .bs-dropzone .lead {
   margin-bottom: 10px;
-  font-weight: normal;
+  font-weight: 400;
   color: #333;
 }
 #import-manual-trigger {
diff --git a/docs/assets/less/docs.less b/docs/assets/less/docs.less
index 8bf588ade..3b5968290 100644
--- a/docs/assets/less/docs.less
+++ b/docs/assets/less/docs.less
@@ -37,89 +37,4 @@
 @import "zero-clipboard.less";
 @import "anchor.less";
 @import "algolia.less";
-
-
-//
-// Misc
-//
-
-// For scrollspy
-body {
-  position: relative;
-}
-
-// Keep code small in tables on account of limited space
-.table code {
-  font-size: 13px;
-  font-weight: normal;
-}
-
-// Inline code within headings retain the heading's background-color
-h2 code,
-h3 code,
-h4 code {
-  background-color: inherit;
-}
-
-// Space docs sections out
-.bs-docs-section {
-  margin-bottom: 60px;
-}
-.bs-docs-section:last-child {
-  margin-bottom: 0;
-}
-
-h1[id] {
-  padding-top: 20px;
-  margin-top: 0;
-}
-
-// Wall of Browser Bugs
-.bs-docs-browser-bugs td p {
-  margin-bottom: 0;
-}
-
-.bs-docs-browser-bugs th:first-child {
-  width: 18%;
-}
-
-// Don't wrap event names in Events tables in JS plugin docs
-.bs-events-table > thead > tr > th:first-child,
-.bs-events-table > tbody > tr > td:first-child {
-  white-space: nowrap;
-}
-
-.bs-events-table > thead > tr > th:first-child {
-  width: 150px;
-}
-
-.js-options-table > thead > tr > th:nth-child(1),
-.js-options-table > thead > tr > th:nth-child(2) {
-  width: 100px;
-}
-
-.js-options-table > thead > tr > th:nth-child(3) {
-  width: 50px;
-}
-
-// v4 notice above main navbar
-.v4-tease {
-  display: block;
-  padding: 15px 20px;
-  font-weight: bold;
-  color: #fff;
-  text-align: center;
-  background-color: #0275d8;
-}
-.v4-tease:hover {
-  color: #fff;
-  text-decoration: none;
-  background-color: #0269c2;
-}
-
-/* Nullify ill-advised printing of hrefs; see #18711 */
-@media print {
-  a[href]:after {
-    content: "" !important;
-  }
-}
+@import "misc.less";
diff --git a/docs/assets/less/examples.less b/docs/assets/less/examples.less
index 6407cc97b..8d92ac52d 100644
--- a/docs/assets/less/examples.less
+++ b/docs/assets/less/examples.less
@@ -1,3 +1,5 @@
+/* stylelint-disable property-no-vendor-prefix, selector-max-id, selector-no-qualifying-type */
+
 // Grid examples
 //
 // Highlight the grid columns within the docs so folks can see their padding,
@@ -10,9 +12,9 @@
   padding-top: 10px;
   padding-bottom: 10px;
   background-color: #eee;
-  background-color: rgba(86,61,124,.15);
+  background-color: rgba(86, 61, 124, .15);
   border: 1px solid #ddd;
-  border: 1px solid rgba(86,61,124,.2);
+  border: 1px solid rgba(86, 61, 124, .2);
 }
 
 // Examples
@@ -27,16 +29,16 @@
   border-color: #e5e5e5 #eee #eee;
   border-style: solid;
   border-width: 1px 0;
-  -webkit-box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
-          box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
+  -webkit-box-shadow: inset 0 3px 6px rgba(0, 0, 0, .05);
+  box-shadow: inset 0 3px 6px rgba(0, 0, 0, .05);
 }
 // Echo out a label for the example
-.bs-example:after {
+.bs-example::after {
   position: absolute;
   top: 15px;
   left: 15px;
   font-size: 12px;
-  font-weight: bold;
+  font-weight: 700;
   color: #959595;
   text-transform: uppercase;
   letter-spacing: 1px;
@@ -65,7 +67,7 @@
     border-width: 1px;
     border-radius: 4px 4px 0 0;
     -webkit-box-shadow: none;
-            box-shadow: none;
+    box-shadow: none;
   }
   .bs-example + .highlight,
   .bs-example + .zero-clipboard + .highlight {
@@ -156,9 +158,11 @@
 }
 
 // Forms
-.bs-example-control-sizing select,
-.bs-example-control-sizing input[type="text"] + input[type="text"] {
-  margin-top: 10px;
+.bs-example-control-sizing {
+  select,
+  input[type="text"] + input[type="text"] {
+    margin-top: 10px;
+  }
 }
 .bs-example-form .input-group {
   margin-bottom: 10px;
@@ -195,7 +199,7 @@
 .bs-navbar-top-example {
   padding-bottom: 45px;
 }
-.bs-navbar-top-example:after {
+.bs-navbar-top-example::after {
   top: auto;
   bottom: 15px;
 }
@@ -311,10 +315,10 @@
 
 // Pseudo :focus state for showing how it looks in the docs
 #focusedInput {
-  border-color: rgb(204,204,204); // Restate unfocused value to make CSSLint happy that there's a pre-CSS3 fallback
-  border-color: rgba(82,168,236,.8);
+  border-color: rgb(204, 204, 204); // Restate unfocused value to make CSSLint happy that there's a pre-CSS3 fallback
+  border-color: rgba(82, 168, 236, .8);
   outline: 0;
   outline: thin dotted \9; // IE6-9
-  -webkit-box-shadow: 0 0 8px rgba(82,168,236,.6);
-          box-shadow: 0 0 8px rgba(82,168,236,.6);
+  -webkit-box-shadow: 0 0 8px rgba(82, 168, 236, .6);
+  box-shadow: 0 0 8px rgba(82, 168, 236, .6);
 }
diff --git a/docs/assets/less/featurettes.less b/docs/assets/less/featurettes.less
index 7df3e94d5..ec939c7b0 100644
--- a/docs/assets/less/featurettes.less
+++ b/docs/assets/less/featurettes.less
@@ -16,7 +16,7 @@
 .bs-docs-featurette-title {
   margin-bottom: 5px;
   font-size: 30px;
-  font-weight: normal;
+  font-weight: 400;
   color: #333;
 }
 .half-rule {
@@ -25,7 +25,7 @@
 }
 .bs-docs-featurette h3 {
   margin-bottom: 5px;
-  font-weight: normal;
+  font-weight: 400;
   color: #333;
 }
 .bs-docs-featurette-img {
diff --git a/docs/assets/less/ie10-viewport-bug-workaround.less b/docs/assets/less/ie10-viewport-bug-workaround.less
index 6ac824f93..a09b8d9ff 100644
--- a/docs/assets/less/ie10-viewport-bug-workaround.less
+++ b/docs/assets/less/ie10-viewport-bug-workaround.less
@@ -1,3 +1,5 @@
+/* stylelint-disable at-rule-no-vendor-prefix */
+
 /*!
  * IE10 viewport hack for Surface/desktop Windows 8 bug
  * Copyright 2014-2015 Twitter, Inc.
diff --git a/docs/assets/less/masthead.less b/docs/assets/less/masthead.less
index 20c9a2671..284fdece7 100644
--- a/docs/assets/less/masthead.less
+++ b/docs/assets/less/masthead.less
@@ -1,17 +1,19 @@
+/* stylelint-disable value-no-vendor-prefix, function-name-case */
+
 .bs-docs-masthead,
 .bs-docs-header {
   position: relative;
   padding: 30px 0;
   color: #cdbfe3;
   text-align: center;
-  text-shadow: 0 1px 0 rgba(0,0,0,.1);
+  text-shadow: 0 1px 0 rgba(0, 0, 0, .1);
   background-color: #6f5499;
   background-image: -webkit-gradient(linear, left top, left bottom, from(#563d7c), to(#6f5499));
   background-image: -webkit-linear-gradient(top, #563d7c 0%, #6f5499 100%);
-  background-image:      -o-linear-gradient(top, #563d7c 0%, #6f5499 100%);
-  background-image:         linear-gradient(to bottom, #563d7c 0%, #6f5499 100%);
-  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#563d7c', endColorstr='#6F5499', GradientType=0);
+  background-image: -o-linear-gradient(top, #563d7c 0%, #6f5499 100%);
+  background-image: linear-gradient(to bottom, #563d7c 0%, #6f5499 100%);
   background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#563d7c", endColorstr="#6F5499", GradientType=0);
 }
 
 // Masthead (headings and download button)
diff --git a/docs/assets/less/misc.less b/docs/assets/less/misc.less
new file mode 100644
index 000000000..bb2090310
--- /dev/null
+++ b/docs/assets/less/misc.less
@@ -0,0 +1,86 @@
+/* stylelint-disable selector-max-type, selector-no-qualifying-type, declaration-no-important */
+
+//
+// Misc
+//
+
+// For scrollspy
+body {
+  position: relative;
+}
+
+// Keep code small in tables on account of limited space
+.table code {
+  font-size: 13px;
+  font-weight: 400;
+}
+
+// Inline code within headings retain the heading's background-color
+h2 code,
+h3 code,
+h4 code {
+  background-color: inherit;
+}
+
+// Space docs sections out
+.bs-docs-section {
+  margin-bottom: 60px;
+}
+.bs-docs-section:last-child {
+  margin-bottom: 0;
+}
+
+h1[id] {
+  padding-top: 20px;
+  margin-top: 0;
+}
+
+// Wall of Browser Bugs
+.bs-docs-browser-bugs td p {
+  margin-bottom: 0;
+}
+
+.bs-docs-browser-bugs th:first-child {
+  width: 18%;
+}
+
+// Don't wrap event names in Events tables in JS plugin docs
+.bs-events-table > thead > tr > th:first-child,
+.bs-events-table > tbody > tr > td:first-child {
+  white-space: nowrap;
+}
+
+.bs-events-table > thead > tr > th:first-child {
+  width: 150px;
+}
+
+.js-options-table > thead > tr > th:nth-child(1),
+.js-options-table > thead > tr > th:nth-child(2) {
+  width: 100px;
+}
+
+.js-options-table > thead > tr > th:nth-child(3) {
+  width: 50px;
+}
+
+// v4 notice above main navbar
+.v4-tease {
+  display: block;
+  padding: 15px 20px;
+  font-weight: 700;
+  color: #fff;
+  text-align: center;
+  background-color: #0275d8;
+}
+.v4-tease:hover {
+  color: #fff;
+  text-decoration: none;
+  background-color: #0269c2;
+}
+
+/* Nullify ill-advised printing of hrefs; see #18711 */
+@media print {
+  a[href]::after {
+    content: "" !important;
+  }
+}
diff --git a/docs/assets/less/responsive-tests.less b/docs/assets/less/responsive-tests.less
index bf9d002d2..784fc6c46 100644
--- a/docs/assets/less/responsive-tests.less
+++ b/docs/assets/less/responsive-tests.less
@@ -1,3 +1,5 @@
+/* stylelint-disable selector-no-qualifying-type, declaration-no-important */
+
 // Responsive (scrollable) doc tables
 .table-responsive .highlight pre {
   white-space: normal;
@@ -7,11 +9,11 @@
 .bs-table th small,
 .responsive-utilities th small {
   display: block;
-  font-weight: normal;
+  font-weight: 400;
   color: #999;
 }
 .responsive-utilities tbody th {
-  font-weight: normal;
+  font-weight: 400;
 }
 .responsive-utilities td {
   text-align: center;
@@ -36,7 +38,7 @@
   display: block;
   padding: 15px 10px;
   font-size: 14px;
-  font-weight: bold;
+  font-weight: 700;
   line-height: 1.1;
   text-align: center;
   border-radius: 4px;
diff --git a/docs/assets/less/sidebar.less b/docs/assets/less/sidebar.less
index 5e9705257..fe36cd57d 100644
--- a/docs/assets/less/sidebar.less
+++ b/docs/assets/less/sidebar.less
@@ -1,3 +1,5 @@
+/* stylelint-disable selector-max-compound-selectors */
+
 // By default it's not affixed in mobile views, so undo that
 .bs-docs-sidebar.affix {
   position: static;
@@ -39,7 +41,7 @@
 .bs-docs-sidebar .nav > .active:hover > a,
 .bs-docs-sidebar .nav > .active:focus > a {
   padding-left: 18px;
-  font-weight: bold;
+  font-weight: 700;
   color: #563d7c;
   background-color: transparent;
   border-left: 2px solid #563d7c;
@@ -55,7 +57,7 @@
   padding-bottom: 1px;
   padding-left: 30px;
   font-size: 12px;
-  font-weight: normal;
+  font-weight: 400;
 }
 .bs-docs-sidebar .nav .nav > li > a:hover,
 .bs-docs-sidebar .nav .nav > li > a:focus {
diff --git a/docs/assets/less/skip-link.less b/docs/assets/less/skip-link.less
index 174a64fe0..a64f3319a 100644
--- a/docs/assets/less/skip-link.less
+++ b/docs/assets/less/skip-link.less
@@ -1,3 +1,5 @@
+/* stylelint-disable selector-max-id */
+
 #skippy {
   display: block;
   padding: 1em;
diff --git a/docs/assets/less/syntax.less b/docs/assets/less/syntax.less
index ab8cc6034..a43045fe9 100644
--- a/docs/assets/less/syntax.less
+++ b/docs/assets/less/syntax.less
@@ -1,64 +1,65 @@
-.hll { background-color: #ffffcc }
+/* stylelint-disable declaration-block-single-line-max-declarations */
+
+.hll { background-color: #ffc; }
 .c { color: #999; }
-.err { color: #AA0000; background-color: #FFAAAA }
-.k { color: #006699; }
-.o { color: #555555 }
+.err { color: #a00; background-color: #faa; }
+.k { color: #069; }
+.o { color: #555; }
 .cm { color: #999; }
-.cp { color: #009999 }
+.cp { color: #099; }
 .c1 { color: #999; }
 .cs { color: #999; }
-.gd { background-color: #FFCCCC; border: 1px solid #CC0000 }
-.ge { font-style: italic }
-.gr { color: #FF0000 }
-.gh { color: #003300; }
-.gi { background-color: #CCFFCC; border: 1px solid #00CC00 }
-.go { color: #AAAAAA }
-.gp { color: #000099; }
-.gs { }
-.gu { color: #003300; }
-.gt { color: #99CC66 }
-.kc { color: #006699; }
-.kd { color: #006699; }
-.kn { color: #006699; }
-.kp { color: #006699 }
-.kr { color: #006699; }
-.kt { color: #007788; }
-.m { color: #FF6600 }
-.s { color: #d44950 }
-.na { color: #4f9fcf }
-.nb { color: #336666 }
-.nc { color: #00AA88; }
-.no { color: #336600 }
-.nd { color: #9999FF }
-.ni { color: #999999; }
-.ne { color: #CC0000; }
-.nf { color: #CC00FF }
-.nl { color: #9999FF }
-.nn { color: #00CCFF; }
+.gd { background-color: #fcc; border: 1px solid #c00; }
+.ge { font-style: italic; }
+.gr { color: #f00; }
+.gh { color: #030; }
+.gi { background-color: #cfc; border: 1px solid #0c0; }
+.go { color: #aaa; }
+.gp { color: #009; }
+.gu { color: #030; }
+.gt { color: #9c6; }
+.kc { color: #069; }
+.kd { color: #069; }
+.kn { color: #069; }
+.kp { color: #069; }
+.kr { color: #069; }
+.kt { color: #078; }
+.m { color: #f60; }
+.s { color: #d44950; }
+.na { color: #4f9fcf; }
+.nb { color: #366; }
+.nc { color: #0a8; }
+.no { color: #360; }
+.nd { color: #99f; }
+.ni { color: #999; }
+.ne { color: #c00; }
+.nf { color: #c0f; }
+.nl { color: #99f; }
+.nn { color: #0cf; }
 .nt { color: #2f6f9f; }
-.nv { color: #003333 }
-.ow { color: #000000; }
-.w { color: #bbbbbb }
-.mf { color: #FF6600 }
-.mh { color: #FF6600 }
-.mi { color: #FF6600 }
-.mo { color: #FF6600 }
-.sb { color: #CC3300 }
-.sc { color: #CC3300 }
-.sd { color: #CC3300; font-style: italic }
-.s2 { color: #CC3300 }
-.se { color: #CC3300; }
-.sh { color: #CC3300 }
-.si { color: #AA0000 }
-.sx { color: #CC3300 }
-.sr { color: #33AAAA }
-.s1 { color: #CC3300 }
-.ss { color: #FFCC33 }
-.bp { color: #336666 }
-.vc { color: #003333 }
-.vg { color: #003333 }
-.vi { color: #003333 }
-.il { color: #FF6600 }
+.nv { color: #033; }
+.ow { color: #000; }
+.w { color: #bbb; }
+.mf { color: #f60; }
+.mh { color: #f60; }
+.mi { color: #f60; }
+.mo { color: #f60; }
+.sb { color: #c30; }
+.sc { color: #c30; }
+.sd { font-style: italic; color: #c30; }
+.s2 { color: #c30; }
+.se { color: #c30; }
+.sh { color: #c30; }
+.si { color: #a00; }
+.sx { color: #c30; }
+.sr { color: #3aa; }
+.s1 { color: #c30; }
+.ss { color: #fc3; }
+.bp { color: #366; }
+.vc { color: #033; }
+.vg { color: #033; }
+.vi { color: #033; }
+.il { color: #f60; }
 
 .css .o,
 .css .o + .nt,
diff --git a/docs/assets/less/zero-clipboard.less b/docs/assets/less/zero-clipboard.less
index 13cfb149b..688c8de77 100644
--- a/docs/assets/less/zero-clipboard.less
+++ b/docs/assets/less/zero-clipboard.less
@@ -14,7 +14,7 @@
   cursor: pointer;
   background-color: #fff;
   border: 1px solid #e1e1e8;
-  border-radius: 0 4px 0 4px;
+  border-radius: 0 4px;
 }
 .btn-clipboard-hover {
   color: #fff;
diff --git a/docs/examples/blog/blog.css b/docs/examples/blog/blog.css
index f9106eb47..e61ebb79b 100644
--- a/docs/examples/blog/blog.css
+++ b/docs/examples/blog/blog.css
@@ -1,3 +1,5 @@
+/* stylelint-disable selector-list-comma-newline-after, property-no-vendor-prefix */
+
 /*
  * Globals
  */
@@ -15,7 +17,7 @@ h5, .h5,
 h6, .h6 {
   margin-top: 0;
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-weight: normal;
+  font-weight: 400;
   color: #333;
 }
 
@@ -37,8 +39,8 @@ h6, .h6 {
 
 .blog-masthead {
   background-color: #428bca;
-  -webkit-box-shadow: inset 0 -2px 5px rgba(0,0,0,.1);
-          box-shadow: inset 0 -2px 5px rgba(0,0,0,.1);
+  -webkit-box-shadow: inset 0 -2px 5px rgba(0, 0, 0, .1);
+  box-shadow: inset 0 -2px 5px rgba(0, 0, 0, .1);
 }
 
 /* Nav links */
@@ -59,7 +61,7 @@ h6, .h6 {
 .blog-nav .active {
   color: #fff;
 }
-.blog-nav .active:after {
+.blog-nav .active::after {
   position: absolute;
   bottom: 0;
   left: 50%;
@@ -86,7 +88,7 @@ h6, .h6 {
   margin-top: 30px;
   margin-bottom: 0;
   font-size: 60px;
-  font-weight: normal;
+  font-weight: 400;
 }
 .blog-description {
   font-size: 20px;
diff --git a/docs/examples/carousel/carousel.css b/docs/examples/carousel/carousel.css
index 8833f82dd..8c61a68fd 100644
--- a/docs/examples/carousel/carousel.css
+++ b/docs/examples/carousel/carousel.css
@@ -1,6 +1,6 @@
 /* GLOBAL STYLES
--------------------------------------------------- */
-/* Padding below the footer and lighter body text */
+ * Padding below the footer and lighter body text
+* -------------------------------------------------- */
 
 body {
   padding-bottom: 40px;
@@ -42,9 +42,8 @@ body {
   height: 500px;
   margin-bottom: 60px;
 }
-/* Since positioning the image, we need to help out the caption */
 .carousel-caption {
-  z-index: 10;
+  z-index: 10; /* Since positioning the image, we need to help out the caption */
 }
 
 /* Declare heights because of positioning of img element */
@@ -70,7 +69,7 @@ body {
   text-align: center;
 }
 .marketing h2 {
-  font-weight: normal;
+  font-weight: 400;
 }
 .marketing .col-lg-4 p {
   margin-right: 10px;
@@ -108,11 +107,7 @@ body {
   .navbar-wrapper .navbar {
     padding-right: 0;
     padding-left: 0;
-  }
-
-  /* The navbar becomes detached from the top, so we round the corners */
-  .navbar-wrapper .navbar {
-    border-radius: 4px;
+    border-radius: 4px; /* The navbar becomes detached from the top, so we round the corners */
   }
 
   /* Bump up size of carousel content */
diff --git a/docs/examples/cover/cover.css b/docs/examples/cover/cover.css
index a199657bd..79fcaed2e 100644
--- a/docs/examples/cover/cover.css
+++ b/docs/examples/cover/cover.css
@@ -1,3 +1,5 @@
+/* stylelint-disable property-no-vendor-prefix */
+
 /*
  * Globals
  */
@@ -32,7 +34,7 @@ body {
 body {
   color: #fff;
   text-align: center;
-  text-shadow: 0 1px 3px rgba(0,0,0,.5);
+  text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
 }
 
 /* Extra markup and styles for table-esque vertical and horizontal centering */
@@ -41,8 +43,8 @@ body {
   width: 100%;
   height: 100%; /* For at least Firefox */
   min-height: 100%;
-  -webkit-box-shadow: inset 0 0 100px rgba(0,0,0,.5);
-          box-shadow: inset 0 0 100px rgba(0,0,0,.5);
+  -webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, .5);
+  box-shadow: inset 0 0 100px rgba(0, 0, 0, .5);
 }
 .site-wrapper-inner {
   display: table-cell;
@@ -77,16 +79,16 @@ body {
   padding-right: 0;
   padding-left: 0;
   font-size: 16px;
-  font-weight: bold;
+  font-weight: 700;
   color: #fff; /* IE8 proofing */
-  color: rgba(255,255,255,.75);
+  color: rgba(255, 255, 255, .75);
   border-bottom: 2px solid transparent;
 }
 .masthead-nav > li > a:hover,
 .masthead-nav > li > a:focus {
   background-color: transparent;
   border-bottom-color: #a9a9a9;
-  border-bottom-color: rgba(255,255,255,.25);
+  border-bottom-color: rgba(255, 255, 255, .25);
 }
 .masthead-nav > .active > a,
 .masthead-nav > .active > a:hover,
@@ -114,7 +116,7 @@ body {
 }
 .cover .btn-lg {
   padding: 10px 20px;
-  font-weight: bold;
+  font-weight: 700;
 }
 
 
@@ -124,7 +126,7 @@ body {
 
 .mastfoot {
   color: #999; /* IE8 proofing */
-  color: rgba(255,255,255,.5);
+  color: rgba(255, 255, 255, .5);
 }
 
 
@@ -142,11 +144,9 @@ body {
     position: fixed;
     bottom: 0;
   }
-  /* Start the vertical centering */
   .site-wrapper-inner {
-    vertical-align: middle;
+    vertical-align: middle; /* Start the vertical centering */
   }
-  /* Handle the widths */
   .masthead,
   .mastfoot,
   .cover-container {
diff --git a/docs/examples/grid/grid.css b/docs/examples/grid/grid.css
index b25263bc7..5df5ac86e 100644
--- a/docs/examples/grid/grid.css
+++ b/docs/examples/grid/grid.css
@@ -12,9 +12,9 @@ h4 {
   padding-top: 15px;
   padding-bottom: 15px;
   background-color: #eee;
-  background-color: rgba(86,61,124,.15);
+  background-color: rgba(86, 61, 124, .15);
   border: 1px solid #ddd;
-  border: 1px solid rgba(86,61,124,.2);
+  border: 1px solid rgba(86, 61, 124, .2);
 }
 
 hr {
diff --git a/docs/examples/jumbotron-narrow/jumbotron-narrow.css b/docs/examples/jumbotron-narrow/jumbotron-narrow.css
index 952adc5a0..dcc815969 100644
--- a/docs/examples/jumbotron-narrow/jumbotron-narrow.css
+++ b/docs/examples/jumbotron-narrow/jumbotron-narrow.css
@@ -17,11 +17,10 @@ body {
   padding-bottom: 20px;
   border-bottom: 1px solid #e5e5e5;
 }
-/* Make the masthead heading the same height as the navigation */
 .header h3 {
   margin-top: 0;
   margin-bottom: 0;
-  line-height: 40px;
+  line-height: 40px; /* Make the masthead heading the same height as the navigation */
 }
 
 /* Custom page footer */
@@ -68,11 +67,9 @@ body {
     padding-right: 0;
     padding-left: 0;
   }
-  /* Space out the masthead */
   .header {
     margin-bottom: 30px;
   }
-  /* Remove the bottom border on the jumbotron for visual effect */
   .jumbotron {
     border-bottom: 0;
   }
diff --git a/docs/examples/justified-nav/justified-nav.css b/docs/examples/justified-nav/justified-nav.css
index 7ba9cd75e..8e03ffb8c 100644
--- a/docs/examples/justified-nav/justified-nav.css
+++ b/docs/examples/justified-nav/justified-nav.css
@@ -1,3 +1,5 @@
+/* stylelint-disable value-no-vendor-prefix, function-name-case, property-no-vendor-prefix */
+
 body {
   padding-top: 20px;
 }
@@ -30,16 +32,16 @@ body {
   padding-top: 15px;
   padding-bottom: 15px;
   margin-bottom: 0;
-  font-weight: bold;
+  font-weight: 700;
   color: #777;
   text-align: center;
   background-color: #e5e5e5; /* Old browsers */
   background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e5e5e5));
   background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e5e5e5 100%);
-  background-image:      -o-linear-gradient(top, #f5f5f5 0%, #e5e5e5 100%);
-  background-image:         linear-gradient(to bottom, #f5f5f5 0%,#e5e5e5 100%);
-  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
+  background-image: -o-linear-gradient(top, #f5f5f5 0%, #e5e5e5 100%);
+  background-image: linear-gradient(to bottom, #f5f5f5 0%, #e5e5e5 100%);
   background-repeat: repeat-x; /* Repeat the gradient */
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f5f5f5", endColorstr="#e5e5e5", GradientType=0); /* IE6-9 */
   border-bottom: 1px solid #d5d5d5;
 }
 .nav-justified > .active > a,
@@ -47,8 +49,8 @@ body {
 .nav-justified > .active > a:focus {
   background-color: #ddd;
   background-image: none;
-  -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.15);
-          box-shadow: inset 0 3px 7px rgba(0,0,0,.15);
+  -webkit-box-shadow: inset 0 3px 7px rgba(0, 0, 0, .15);
+  box-shadow: inset 0 3px 7px rgba(0, 0, 0, .15);
 }
 .nav-justified > li:first-child > a {
   border-radius: 5px 5px 0 0;
diff --git a/docs/examples/non-responsive/non-responsive.css b/docs/examples/non-responsive/non-responsive.css
index 0a8e92d96..8faa63613 100644
--- a/docs/examples/non-responsive/non-responsive.css
+++ b/docs/examples/non-responsive/non-responsive.css
@@ -1,3 +1,5 @@
+/* stylelint-disable selector-max-class, selector-max-combinators, selector-max-compound-selectors, declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix */
+
 /* Template-specific stuff
  *
  * Customizations just for the template; these are not necessary for anything
@@ -47,9 +49,9 @@ body,
   padding-top: 15px;
   padding-bottom: 15px;
   background-color: #eee;
-  background-color: rgba(86,61,124,.15);
+  background-color: rgba(86, 61, 124, .15);
   border: 1px solid #ddd;
-  border: 1px solid rgba(86,61,124,.2);
+  border: 1px solid rgba(86, 61, 124, .2);
 }
 
 .container .navbar-header,
@@ -70,14 +72,12 @@ body,
   padding-bottom: 0;
   overflow: visible !important;
   visibility: visible !important;
+  border-top: 0;
 }
 
 .navbar-toggle {
   display: none;
 }
-.navbar-collapse {
-  border-top: 0;
-}
 
 .navbar-brand {
   margin-left: -15px;
@@ -110,7 +110,7 @@ body,
   border-width: 0 1px 1px;
   border-radius: 0 0 4px 4px;
   -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
-          box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
+  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
 }
 .navbar-default .navbar-nav .open .dropdown-menu > li > a {
   color: #333;
@@ -140,7 +140,7 @@ body,
   margin-left: 0;
   border: 0;
   -webkit-box-shadow: none;
-          box-shadow: none;
+  box-shadow: none;
 }
 
 /* Copy-pasted from forms.less since we mixin the .form-inline styles. */
diff --git a/docs/examples/offcanvas/offcanvas.css b/docs/examples/offcanvas/offcanvas.css
index 2a72199d5..157669ab8 100644
--- a/docs/examples/offcanvas/offcanvas.css
+++ b/docs/examples/offcanvas/offcanvas.css
@@ -1,3 +1,5 @@
+/* stylelint-disable property-no-vendor-prefix */
+
 /*
  * Style tweaks
  * --------------------------------------------------
@@ -21,8 +23,8 @@ footer {
   .row-offcanvas {
     position: relative;
     -webkit-transition: all .25s ease-out;
-         -o-transition: all .25s ease-out;
-            transition: all .25s ease-out;
+    -o-transition: all .25s ease-out;
+    transition: all .25s ease-out;
   }
 
   .row-offcanvas-right {
@@ -33,13 +35,11 @@ footer {
     left: 0;
   }
 
-  .row-offcanvas-right
-  .sidebar-offcanvas {
+  .row-offcanvas-right .sidebar-offcanvas {
     right: -50%; /* 6 columns */
   }
 
-  .row-offcanvas-left
-  .sidebar-offcanvas {
+  .row-offcanvas-left .sidebar-offcanvas {
     left: -50%; /* 6 columns */
   }
 
diff --git a/docs/examples/signin/signin.css b/docs/examples/signin/signin.css
index 995df48e9..164de43ce 100644
--- a/docs/examples/signin/signin.css
+++ b/docs/examples/signin/signin.css
@@ -1,3 +1,5 @@
+/* stylelint-disable selector-no-qualifying-type, property-no-vendor-prefix */
+
 body {
   padding-top: 40px;
   padding-bottom: 40px;
@@ -14,14 +16,14 @@ body {
   margin-bottom: 10px;
 }
 .form-signin .checkbox {
-  font-weight: normal;
+  font-weight: 400;
 }
 .form-signin .form-control {
   position: relative;
-  height: auto;
   -webkit-box-sizing: border-box;
-     -moz-box-sizing: border-box;
-          box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  height: auto;
   padding: 10px;
   font-size: 16px;
 }
diff --git a/docs/examples/sticky-footer-navbar/sticky-footer-navbar.css b/docs/examples/sticky-footer-navbar/sticky-footer-navbar.css
index ee8038063..830175147 100644
--- a/docs/examples/sticky-footer-navbar/sticky-footer-navbar.css
+++ b/docs/examples/sticky-footer-navbar/sticky-footer-navbar.css
@@ -5,22 +5,20 @@ html {
   min-height: 100%;
 }
 body {
-  /* Margin bottom by footer height */
-  margin-bottom: 60px;
+  margin-bottom: 60px; /* Margin bottom by footer height */
 }
 .footer {
   position: absolute;
   bottom: 0;
   width: 100%;
-  /* Set the fixed height of the footer here */
-  height: 60px;
+  height: 60px; /* Set the fixed height of the footer here */
   background-color: #f5f5f5;
 }
 
 
 /* Custom page CSS
--------------------------------------------------- */
-/* Not required for template or sticky footer method. */
+ * Not required for template or sticky footer method.
+ * -------------------------------------------------- */
 
 body > .container {
   padding: 60px 15px 0;
diff --git a/docs/examples/sticky-footer/sticky-footer.css b/docs/examples/sticky-footer/sticky-footer.css
index b6699e80e..433014541 100644
--- a/docs/examples/sticky-footer/sticky-footer.css
+++ b/docs/examples/sticky-footer/sticky-footer.css
@@ -5,22 +5,20 @@ html {
   min-height: 100%;
 }
 body {
-  /* Margin bottom by footer height */
-  margin-bottom: 60px;
+  margin-bottom: 60px; /* Margin bottom by footer height */
 }
 .footer {
   position: absolute;
   bottom: 0;
   width: 100%;
-  /* Set the fixed height of the footer here */
-  height: 60px;
+  height: 60px; /* Set the fixed height of the footer here */
   background-color: #f5f5f5;
 }
 
 
 /* Custom page CSS
--------------------------------------------------- */
-/* Not required for template or sticky footer method. */
+ * Not required for template or sticky footer method.
+ * -------------------------------------------------- */
 
 .container {
   width: auto;