bootstrap 4.0.0.alpha3 → 4.0.0.alpha3.1

data/assets/stylesheets/bootstrap/_pagination.scss

@@ -34,6 +34,7 @@
   &.disabled .page-link {
     @include plain-hover-focus {
       color: $pagination-disabled-color;
+      pointer-events: none;
       cursor: $cursor-disabled;
       background-color: $pagination-disabled-bg;
       border-color: $pagination-disabled-border;
@@ -46,7 +47,6 @@
   float: left; // Collapse white-space
   padding: $pagination-padding-y $pagination-padding-x;
   margin-left: -1px;
-  line-height: $line-height;
   color: $pagination-color;
   text-decoration: none;
   background-color: $pagination-bg;

data/assets/stylesheets/bootstrap/_popover.scss

@@ -5,16 +5,18 @@
   z-index: $zindex-popover;
   display: block;
   max-width: $popover-max-width;
-  padding: 1px;
+  padding: $popover-inner-padding;
   // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.
   // So reset our font and text properties to avoid inheriting weird values.
   @include reset-text();
   font-size: $font-size-sm;
+  // Allow breaking very long words so they don't overflow the popover's bounds
+  word-wrap: break-word;
   background-color: $popover-bg;
   background-clip: padding-box;
   border: $popover-border-width solid $popover-border-color;
   @include border-radius($border-radius-lg);
-  @include box-shadow(0 5px 10px rgba(0,0,0,.2));
+  @include box-shadow($popover-box-shadow);
 
 
   // Popover directions
@@ -103,16 +105,21 @@
 
 // Offset the popover to account for the popover arrow
 .popover-title {
-  padding: 8px 14px;
+  padding: $popover-title-padding-y $popover-title-padding-x;
   margin: 0; // reset heading margin
   font-size: $font-size-base;
   background-color: $popover-title-bg;
   border-bottom: $popover-border-width solid darken($popover-title-bg, 5%);
-  @include border-radius(($border-radius-lg - 1) ($border-radius-lg - 1) 0 0);
+  $offset-border-width: ($border-width / $font-size-root);
+  @include border-radius(($border-radius-lg - $offset-border-width) ($border-radius-lg - $offset-border-width) 0 0);
+
+  &:empty {
+    display: none;
+  }
 }
 
 .popover-content {
-  padding: 9px 14px;
+  padding: $popover-content-padding-y $popover-content-padding-x;
 }
 
 

data/assets/stylesheets/bootstrap/_print.scss

@@ -1,88 +1,116 @@
+// scss-lint:disable ImportantRule, QualifyingElement
+
 // Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css
 
 // ==========================================================================
 // Print styles.
-// Inlined to avoid the additional HTTP request: h5bp.com/r
+// Inlined to avoid the additional HTTP request:
+// http://www.phpied.com/delay-loading-your-print-css/
 // ==========================================================================
 
-@media print {
-  *,
-  *::before,
-  *::after {
-    text-shadow: none !important;
-    box-shadow: none !important;
-  }
+@if $enable-print-styles {
+  @media print {
+    *,
+    *::before,
+    *::after,
+    *::first-letter,
+    *::first-line {
+      // Bootstrap specific; comment out `color` and `background`
+      //color: #000 !important; // Black prints faster:
+                                //   http://www.sanbeiji.com/archives/953
+      text-shadow: none !important;
+      //background: transparent !important;
+      box-shadow: none !important;
+    }
 
-  a,
-  a:visited {
-    text-decoration: underline;
-  }
+    a,
+    a:visited {
+      text-decoration: underline;
+    }
 
-  abbr[title]::after {
-    content: " (" attr(title) ")";
-  }
+    // Bootstrap specific; comment the following selector out
+    //a[href]::after {
+    //  content: " (" attr(href) ")";
+    //}
 
-  pre,
-  blockquote {
-    border: $border-width solid #999;
-    page-break-inside: avoid;
-  }
+    abbr[title]::after {
+      content: " (" attr(title) ")";
+    }
 
-  thead {
-    display: table-header-group; // h5bp.com/t
-  }
+    // Bootstrap specific; comment the following selector out
+    //
+    // Don't show links that are fragment identifiers,
+    // or use the `javascript:` pseudo protocol
+    //
 
-  tr,
-  img {
-    page-break-inside: avoid;
-  }
+    //a[href^="#"]::after,
+    //a[href^="javascript:"]::after {
+    //  content: "";
+    //}
 
-  img {
-    max-width: 100% !important;
-  }
+    pre,
+    blockquote {
+      border: $border-width solid #999;   // Bootstrap custom code; using `$border-width` instead of 1px
+      page-break-inside: avoid;
+    }
 
-  p,
-  h2,
-  h3 {
-    orphans: 3;
-    widows: 3;
-  }
+    //
+    // Printing Tables:
+    // http://css-discuss.incutio.com/wiki/Printing_Tables
+    //
 
-  h2,
-  h3 {
-    page-break-after: avoid;
-  }
+    thead {
+      display: table-header-group;
+    }
 
-  // Bootstrap specific changes start
+    tr,
+    img {
+      page-break-inside: avoid;
+    }
 
-  // Bootstrap components
-  .navbar {
-    display: none;
-  }
-  .btn,
-  .dropup > .btn {
-    > .caret {
-      border-top-color: #000 !important;
+    p,
+    h2,
+    h3 {
+      orphans: 3;
+      widows: 3;
     }
-  }
-  .label {
-    border: $border-width solid #000;
-  }
 
-  .table {
-    border-collapse: collapse !important;
+    h2,
+    h3 {
+      page-break-after: avoid;
+    }
+
+    // Bootstrap specific changes start
 
-    td,
-    th {
-      background-color: #fff !important;
+    // Bootstrap components
+    .navbar {
+      display: none;
     }
-  }
-  .table-bordered {
-    th,
-    td {
-      border: 1px solid #ddd !important;
+    .btn,
+    .dropup > .btn {
+      > .caret {
+        border-top-color: #000 !important;
+      }
+    }
+    .tag {
+      border: $border-width solid #000;
     }
-  }
 
-  // Bootstrap specific changes end
+    .table {
+      border-collapse: collapse !important;
+
+      td,
+      th {
+        background-color: #fff !important;
+      }
+    }
+    .table-bordered {
+      th,
+      td {
+        border: 1px solid #ddd !important;
+      }
+    }
+
+    // Bootstrap specific changes end
+  }
 }

data/assets/stylesheets/bootstrap/_progress.scss

@@ -3,8 +3,8 @@
 //
 
 @keyframes progress-bar-stripes {
-  from  { background-position: $spacer-y 0; }
-  to    { background-position: 0 0; }
+  from { background-position: $spacer-y 0; }
+  to { background-position: 0 0; }
 }
 
 
@@ -19,82 +19,67 @@
   margin-bottom: $spacer-y;
 }
 .progress[value] {
-  // IE10 uses `color` to set the bar background-color
-  color: #0074d9;
+  // Set overall background
+  background-color: $progress-bg;
   // Remove Firefox and Opera border
   border: 0;
   // Reset the default appearance
   appearance: none;
-}
-.progress[value]::-webkit-progress-bar {
-  background-color: #eee;
+  // Set overall border radius
   @include border-radius($border-radius);
-  @include box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1));
 }
-.progress[value]::-webkit-progress-value::before {
-  content: attr(value);
+
+// Filled-in portion of the bar
+.progress[value]::-ms-fill {
+  background-color: $progress-bar-color;
+  // Remove right-hand border of value bar from IE10+/Edge
+  border: 0;
+}
+.progress[value]::-moz-progress-bar {
+  background-color: $progress-bar-color;
+  @include border-left-radius($border-radius);
 }
 .progress[value]::-webkit-progress-value {
-  background-color: #0074d9;
-  border-top-left-radius: $border-radius;
-  border-bottom-left-radius: $border-radius;
+  background-color: $progress-bar-color;
+  @include border-left-radius($border-radius);
+}
+// Tweaks for full progress bar
+.progress[value="100"]::-moz-progress-bar {
+  @include border-right-radius($border-radius);
 }
 .progress[value="100"]::-webkit-progress-value {
-  border-top-right-radius: $border-radius;
-  border-bottom-right-radius: $border-radius;
+  @include border-right-radius($border-radius);
 }
 
-// Firefox styles must be entirely separate or it busts Webkit styles.
-//
-// Commented out for now because linter.
-//
-// $-moz-document url-prefix() {
-//   .progress[value] {
-//     background-color: #eee;
-//     .border-radius($border-radius);
-//     .box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1));
-//   }
-//   .progress[value]::-moz-progress-bar {
-//     background-color: #0074d9;
-//     border-top-left-radius: $border-radius;
-//     border-bottom-left-radius: $border-radius;
-//   }
-//   .progress[value="0"]::-moz-progress-bar {
-//     color: $gray-light;
-//     min-width: 2rem;
-//     background-color: transparent;
-//     background-image: none;
-//   }
-//   .progress[value="100"]::-moz-progress-bar {
-//     border-top-right-radius: $border-radius;
-//     border-bottom-right-radius: $border-radius;
-//   }
-// }
+// Unfilled portion of the bar
+.progress[value]::-webkit-progress-bar {
+  background-color: $progress-bg;
+  @include border-radius($border-radius);
+  @include box-shadow($progress-box-shadow);
+}
+base::-moz-progress-bar, // Absurd-but-syntactically-valid selector to make these styles Firefox-only
+.progress[value] {
+  background-color: $progress-bg;
+  @include border-radius($border-radius);
+  @include box-shadow($progress-box-shadow);
+}
 
 // IE9 hacks to accompany custom markup. We don't need to scope this via media queries, but I feel better doing it anyway.
 @media screen and (min-width:0\0) {
   .progress {
-    background-color: #eee;
+    background-color: $progress-bg;
     @include border-radius($border-radius);
-    @include box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1));
+    @include box-shadow($progress-box-shadow);
   }
   .progress-bar {
     display: inline-block;
     height: $spacer-y;
     text-indent: -999rem; // Simulate hiding of value as in native `<progress>`
-    background-color: #0074d9;
-    border-top-left-radius: $border-radius;
-    border-bottom-left-radius: $border-radius;
-  }
-  .progress[width^="0"] {
-    min-width: 2rem;
-    color: $gray-light;
-    background-color: transparent;
-    background-image: none;
+    background-color: $progress-bar-color;
+    @include border-left-radius($border-radius);
   }
   .progress[width="100%"] {
-    border-top-right-radius: $border-radius;
-    border-bottom-right-radius: $border-radius;
+    @include border-right-radius($border-radius);
   }
 }
 
@@ -111,6 +96,10 @@
   @include gradient-striped();
   background-size: $spacer-y $spacer-y;
 }
+.progress-striped[value]::-ms-fill {
+  @include gradient-striped();
+  background-size: $spacer-y $spacer-y;
+}
 // IE9
 @media screen and (min-width:0\0) {
   .progress-bar-striped {

data/assets/stylesheets/bootstrap/_reboot.scss

@@ -1,3 +1,5 @@
+// scss-lint:disable ImportantRule, QualifyingElement, DuplicateProperty
+
 // Reboot
 //
 // Global resets to common HTML elements and more for easier usage by Bootstrap.
@@ -32,8 +34,7 @@ html {
 //
 // @viewport is needed because IE 10+ doesn't honor <meta name="viewport"> in
 // some cases. See http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/.
-// Eventually @viewport will replace <meta name="viewport">. It's been manually
-// prefixed for forward-compatibility.
+// Eventually @viewport will replace <meta name="viewport">.
 //
 // However, `device-width` is broken on IE 10 on Windows (Phone) 8,
 // (see http://timkadlec.com/2013/01/windows-phone-8-and-device-width/ and https://github.com/twbs/bootstrap/issues/10497)
@@ -44,14 +45,8 @@ html {
 //
 // Wrap `@viewport` with `@at-root` for when folks do a nested import (e.g.,
 // `.class-name { @import "bootstrap"; }`).
-//
-// Includes future-proofed vendor prefixes as well.
 @at-root {
-  @-moz-viewport      { width: device-width; }
-  @-ms-viewport       { width: device-width; }
-  @-o-viewport        { width: device-width; }
-  @-webkit-viewport   { width: device-width; }
-  @viewport           { width: device-width; }
+  @-ms-viewport { width: device-width; }
 }
 
 
@@ -62,6 +57,13 @@ html {
 html {
   // Sets a specific default `font-size` for user with `rem` type scales.
   font-size: $font-size-root;
+  // As a side-effect of setting the @viewport above,
+  // IE11 & Edge make the scrollbar overlap the content and automatically hide itself when not in use.
+  // Unfortunately, the auto-showing of the scrollbar is sometimes too sensitive,
+  // thus making it hard to click on stuff near the right edge of the page.
+  // So we add this style to force IE11 & Edge to use a "normal", non-overlapping, non-auto-hiding scrollbar.
+  // See https://github.com/twbs/bootstrap/issues/18543
+  -ms-overflow-style: scrollbar;
   // Changes the default tap highlight to be completely transparent in iOS.
   -webkit-tap-highlight-color: rgba(0,0,0,0);
 }
@@ -70,7 +72,7 @@ body {
   // Make the `body` use the `font-size-root`
   font-family: $font-family-base;
   font-size: $font-size-base;
-  line-height: $line-height;
+  line-height: $line-height-base;
   // Go easy on the eyes and use something other than `#000` for text
   color: $body-color;
   // By default, `<body>` has no `background-color` so we set one as a best practice.
@@ -169,6 +171,26 @@ a {
   }
 }
 
+// And undo these styles for placeholder links/named anchors (without href)
+// which have not been made explicitly keyboard-focusable (without tabindex).
+// It would be more straightforward to just use a[href] in previous block, but that
+// causes specificity issues in many other styles that are too complex to fix.
+// See https://github.com/twbs/bootstrap/issues/19402
+
+a:not([href]):not([tabindex]) {
+  color: inherit;
+  text-decoration: none;
+
+  @include hover-focus {
+    color: inherit;
+    text-decoration: none;
+  }
+
+  &:focus {
+    outline: none;
+  }
+}
+
 
 //
 // Code
@@ -179,6 +201,8 @@ pre {
   margin-top: 0;
   // Reset browser default of `1em` to use `rem`s
   margin-bottom: 1rem;
+  // Normalize v4 removed this property, causing `<pre>` content to break out of wrapping code snippets
+  overflow: auto;
 }
 
 
@@ -245,6 +269,8 @@ textarea {
 //
 
 table {
+  // No longer part of Normalize since v4
+  border-collapse: collapse;
   // Reset for nesting within parents with `background-color`.
   background-color: $table-bg;
 }
@@ -296,6 +322,29 @@ textarea {
   border-radius: 0;
 }
 
+input[type="radio"],
+input[type="checkbox"] {
+  // Apply a disabled cursor for radios and checkboxes.
+  //
+  // Note: Neither radios nor checkboxes can be readonly.
+  &:disabled {
+    cursor: $cursor-disabled;
+  }
+}
+
+
+input[type="date"],
+input[type="time"],
+input[type="datetime-local"],
+input[type="month"] {
+  // Remove the default appearance of temporal inputs to avoid a Mobile Safari
+  // bug where setting a custom line-height prevents text from being vertically
+  // centered within the input.
+  //
+  // Bug report: https://github.com/twbs/bootstrap/issues/11266
+  -webkit-appearance: listbox;
+}
+
 textarea {
   // Textareas should really only resize vertically so they don't break their (horizontal) containers.
   resize: vertical;
@@ -320,12 +369,9 @@ legend {
   margin-bottom: .5rem;
   font-size: 1.5rem;
   line-height: inherit;
-//  border: 0;
 }
 
 input[type="search"] {
-  // Undo Normalize's default here to match our global overrides.
-  box-sizing: inherit;
   // This overrides the extra rounded corners on search inputs in iOS so that our
   // `.form-control` class can properly style them. Note that this cannot simply
   // be added to `.form-control` as it's not specific enough. For details, see