Merge branch 'v4-dev' into v4-docs-streamlined

docs/assets/js/ie-emulation-modes-warning.js

@@ -10,7 +10,7 @@
  */
 // Intended to prevent false-positive bug reports about Bootstrap not working properly in old versions of IE due to folks testing using IE's unreliable emulation modes.
 (function () {
-  'use strict';
+  'use strict'
 
   function emulatedIEMajorVersion() {
     var groups = /MSIE ([0-9.]+)/.exec(window.navigator.userAgent)
@@ -49,4 +49,4 @@
   if (emulated !== nonEmulated) {
     window.alert('WARNING: You appear to be using IE' + nonEmulated + ' in IE' + emulated + ' emulation mode.\nIE emulation modes can behave significantly differently from ACTUAL older versions of IE.\nPLEASE DON\'T FILE BOOTSTRAP BUGS based on testing in IE emulation modes!')
   }
-})();
+}())

docs/assets/js/ie10-viewport-bug-workaround.js

@@ -1,7 +1,7 @@
 /*!
  * IE10 viewport hack for Surface/desktop Windows 8 bug
- * Copyright 2014-2015 The Bootstrap Authors
- * Copyright 2014-2015 Twitter, Inc.
+ * Copyright 2014-2017 The Bootstrap Authors
+ * Copyright 2014-2017 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  */
 
@@ -9,7 +9,7 @@
 // https://getbootstrap.com/getting-started/#support-ie10-width
 
 (function () {
-  'use strict';
+  'use strict'
 
   if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
     var msViewportStyle = document.createElement('style')
@@ -21,4 +21,4 @@
     document.head.appendChild(msViewportStyle)
   }
 
-})();
+}())

docs/assets/js/src/application.js

@@ -4,16 +4,16 @@
 
 /*!
  * JavaScript for Bootstrap's docs (https://getbootstrap.com)
- * Copyright 2011-2016 The Bootstrap Authors
- * Copyright 2011-2016 Twitter, Inc.
+ * Copyright 2011-2017 The Bootstrap Authors
+ * Copyright 2011-2017 Twitter, Inc.
  * Licensed under the Creative Commons Attribution 3.0 Unported License. For
  * details, see https://creativecommons.org/licenses/by/3.0/.
  */
 
 /* global Clipboard, anchors */
 
-!function ($) {
-  'use strict';
+(function ($) {
+  'use strict'
 
   $(function () {
 
@@ -48,11 +48,23 @@
       $modal.find('.modal-body input').val(recipient)
     })
 
+    // Activate animated progress bar
+    $('.bd-toggle-animated-progress').on('click', function () {
+      $(this).siblings('.progress').find('.progress-bar-striped').toggleClass('progress-bar-animated')
+    })
+
     // Insert copy to clipboard button before .highlight
     $('.highlight').each(function () {
-      var btnHtml = '<div class="bd-clipboard"><span class="btn-clipboard" title="Copy to clipboard">Copy</span></div>'
+      var btnHtml = '<div class="bd-clipboard"><button class="btn-clipboard" title="Copy to clipboard">Copy</button></div>'
       $(this).before(btnHtml)
-      $('.btn-clipboard').tooltip()
+      $('.btn-clipboard')
+        .tooltip()
+        .on('mouseleave', function () {
+          // explicitly hide tooltip, since after clicking it remains
+          // focused (as it's a button), so tooltip would otherwise
+          // remain visible until focus is moved away
+          $(this).tooltip('hide')
+        })
     })
 
     var clipboard = new Clipboard('.btn-clipboard', {
@@ -86,11 +98,11 @@
 
   })
 
-}(jQuery)
+}(jQuery))
 
 ;(function () {
-  'use strict';
+  'use strict'
 
-  anchors.options.placement = 'left';
+  anchors.options.placement = 'left'
   anchors.add('.bd-content > h1, .bd-content > h2, .bd-content > h3, .bd-content > h4, .bd-content > h5')
-})();
+}())

docs/assets/scss/_booticon.scss

@@ -1,25 +0,0 @@
-//
-// Bootstrap "B" Booticon
-//
-
-.bd-booticon {
-  display: block;
-  width: 9rem;
-  height: 9rem;
-  font-size: 6.5rem;
-  line-height: 9rem;
-  color: #fff;
-  text-align: center;
-  cursor: default;
-  background-color: $bd-purple;
-  border-radius: 15%;
-
-  &.inverse {
-    color: $bd-purple;
-    background-color: #fff;
-  }
-  &.outline {
-    background-color: transparent;
-    border: 1px solid $bd-purple-light;
-  }
-}

docs/assets/scss/_clipboard-js.scss

@@ -23,6 +23,7 @@
   color: #818a91;
   cursor: pointer;
   background-color: transparent;
+  border: 0;
   border-radius: .25rem;
 
   &:hover {

docs/assets/scss/_component-examples.scss

@@ -37,6 +37,40 @@
   border: 1px solid rgba($bd-purple, .15);
 }
 
+// Grid mixins
+.example-container {
+  width: 800px;
+  @include make-container();
+}
+
+.example-row {
+  @include make-row();
+}
+
+.example-content-main {
+  @include make-col-ready();
+
+  @include media-breakpoint-up(sm) {
+    @include make-col(6);
+  }
+
+  @include media-breakpoint-up(lg) {
+    @include make-col(8);
+  }
+}
+
+.example-content-secondary {
+  @include make-col-ready();
+
+  @include media-breakpoint-up(sm) {
+    @include make-col(6);
+  }
+
+  @include media-breakpoint-up(lg) {
+    @include make-col(4);
+  }
+}
+
 
 //
 // Container illustrations
@@ -83,7 +117,7 @@
 .bd-example {
   position: relative;
   padding: 1rem;
-  margin: 1rem -1rem;
+  margin: 1rem (-$grid-gutter-width-base / 2);
   border: solid #f7f7f9;
   border-width: .2rem 0 0;
   @include clearfix();
@@ -203,20 +237,22 @@
 
 // Navbars
 .bd-example {
-  .navbar-fixed-top {
+  .fixed-top,
+  .sticky-top {
     position: static;
     margin: -1rem -1rem 1rem;
   }
-  .navbar-fixed-bottom {
+  .fixed-bottom {
     position: static;
     margin: 1rem -1rem -1rem;
   }
 
   @include media-breakpoint-up(sm) {
-    .navbar-fixed-top {
+    .fixed-top,
+    .sticky-top {
       margin: -1.5rem -1.5rem 1rem;
     }
-    .navbar-fixed-bottom {
+    .fixed-bottom {
       margin: 1rem -1.5rem -1.5rem;
     }
   }
@@ -249,17 +285,6 @@
   }
 }
 
-// Example dropdowns
-.bd-example > .dropdown > .dropdown-toggle {
-  float: left;
-}
-.bd-example > .dropdown > .dropdown-menu {
-  position: static;
-  display: block;
-  margin-bottom: .25rem;
-  clear: left;
-}
-
 // Example tabbable tabs
 .bd-example-tabs .nav-tabs {
   margin-bottom: 1rem;
@@ -273,6 +298,18 @@
   margin-top: .25rem;
   margin-bottom: .25rem;
 }
+.bs-tooltip-top-docs,
+.bs-tooltip-bottom-docs {
+  .arrow {
+    left: 50%;
+  }
+}
+.bs-tooltip-right-docs,
+.bs-tooltip-left-docs {
+  .arrow {
+    top: 50%;
+  }
+}
 
 // Popovers
 .bd-example-popover-static {
@@ -286,6 +323,18 @@
   width: 260px;
   margin: 1.25rem;
 }
+.bs-popover-top-docs,
+.bs-popover-bottom-docs {
+  .arrow {
+    left: 50%;
+  }
+}
+.bs-popover-right-docs,
+.bs-popover-left-docs {
+  .arrow {
+    top: 50%;
+  }
+}
 
 // Tooltips
 .tooltip-demo a {
@@ -307,6 +356,12 @@
   overflow: auto;
 }
 
+.scrollspy-example-2 {
+  position: relative;
+  height: 350px;
+  overflow: auto;
+}
+
 // Helpers
 .bd-example > {
   .bg-primary,
@@ -343,6 +398,7 @@
   padding: 1rem;
   margin: 1rem (-$grid-gutter-width-base / 2);
   background-color: #f7f7f9;
+  -ms-overflow-style: -ms-autohiding-scrollbar;
 
   @include media-breakpoint-up(sm) {
     padding: 1.5rem;

docs/assets/scss/_content.scss

@@ -6,11 +6,15 @@
 
 .bd-content {
   > table {
-    display: block;
     width: 100%;
     max-width: 100%;
-    margin-bottom: $spacer;
-    overflow-y: auto;
+    margin-bottom: 1rem;
+
+    @include media-breakpoint-down(md) {
+      display: block;
+      overflow-x: auto;
+      -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057
+    }
 
     // Cells
     > thead,

docs/assets/scss/_footer.scss

@@ -13,7 +13,8 @@
     font-weight: 500;
     color: $gray;
 
-    &:hover {
+    &:hover,
+    &:focus {
       color: $link-color;
     }
   }

docs/assets/scss/_masthead.scss

@@ -40,7 +40,8 @@
     color: $bd-yellow;
     border-color: $bd-yellow;
 
-    &:hover {
+    &:hover,
+    &:focus {
       color: $bd-graphite;
       background-color: $bd-yellow;
       border-color: $bd-yellow;

docs/assets/scss/_responsive-tests.scss

@@ -10,86 +10,8 @@
 }
 
 // Utility classes table
-.bd-table th small,
-.responsive-utilities th small {
+.bd-table th small {
   display: block;
   font-weight: normal;
   color: #999;
 }
-.responsive-utilities tbody th {
-  font-weight: normal;
-}
-.responsive-utilities td {
-  text-align: center;
-}
-.responsive-utilities .is-visible {
-  color: #468847;
-  background-color: #dff0d8 !important;
-}
-.responsive-utilities .is-hidden {
-  color: #ccc;
-  background-color: #f9f9f9 !important;
-}
-
-// Responsive tests
-.responsive-utilities-test {
-  margin-top: .25rem;
-}
-.responsive-utilities-test .col-6 {
-  margin-top: .5rem;
-  margin-bottom: .5rem;
-}
-.responsive-utilities-test span {
-  display: block;
-  padding: 1rem .5rem;
-  font-size: 1rem;
-  font-weight: bold;
-  line-height: 1.1;
-  text-align: center;
-  border-radius: .25rem;
-}
-.visible-on,
-.hidden-on {
-  .col-6 {
-    > .not-visible {
-      color: #999;
-      border: 1px solid #ddd;
-    }
-  }
-}
-.visible-on,
-.hidden-on {
-  .col-6 {
-    .visible {
-      color: #468847;
-      background-color: #dff0d8;
-      border: 1px solid #d6e9c6;
-    }
-  }
-}
-
-@include media-breakpoint-only(xs) {
-  .hidden-xs-only {
-    display: none !important;
-  }
-}
-@include media-breakpoint-only(sm) {
-  .hidden-sm-only {
-    display: none !important;
-  }
-}
-@include media-breakpoint-only(md) {
-  .hidden-md-only {
-    display: none !important;
-  }
-}
-@include media-breakpoint-only(lg) {
-  .hidden-lg-only {
-    display: none !important;
-  }
-}
-@include media-breakpoint-only(xl) {
-  .hidden-xl-only {
-    display: none !important;
-  }
-}

docs/assets/scss/_team.scss

@@ -6,8 +6,12 @@
     color: #555;
   }
 
-  .team-member:hover {
+  .team-member:hover,
+  .team-member:focus {
     color: #333;
+  }
+
+  .team-member:hover {
     text-decoration: none;
   }
 

docs/assets/scss/docs.scss

@@ -1,7 +1,7 @@
 /*!
  * Bootstrap Docs (https://getbootstrap.com)
- * Copyright 2011-2016 The Bootstrap Authors
- * Copyright 2011-2016 Twitter, Inc.
+ * Copyright 2011-2017 The Bootstrap Authors
+ * Copyright 2011-2017 Twitter, Inc.
  * Licensed under the Creative Commons Attribution 3.0 Unported License. For
  * details, see https://creativecommons.org/licenses/by/3.0/.
  */
@@ -39,7 +39,6 @@ $bd-warning:        #f0ad4e;
 $bd-info:           #5bc0de;
 
 // Load docs components
-@import "booticon";
 @import "nav";
 @import "masthead";
 @import "featurettes";