bootstrap 5.0.0.beta2 → 5.0.0.beta3

data/assets/stylesheets/_bootstrap-grid.scss

@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Grid v5.0.0-beta2 (https://getbootstrap.com/)
+ * Bootstrap Grid v5.0.0-beta3 (https://getbootstrap.com/)
  * Copyright 2011-2021 The Bootstrap Authors
  * Copyright 2011-2021 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)

data/assets/stylesheets/_bootstrap-reboot.scss

@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Reboot v5.0.0-beta2 (https://getbootstrap.com/)
+ * Bootstrap Reboot v5.0.0-beta3 (https://getbootstrap.com/)
  * Copyright 2011-2021 The Bootstrap Authors
  * Copyright 2011-2021 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)

data/assets/stylesheets/_bootstrap.scss

@@ -1,5 +1,5 @@
 /*!
- * Bootstrap v5.0.0-beta2 (https://getbootstrap.com/)
+ * Bootstrap v5.0.0-beta3 (https://getbootstrap.com/)
  * Copyright 2011-2021 The Bootstrap Authors
  * Copyright 2011-2021 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
@@ -42,6 +42,7 @@
 @import "bootstrap/popover";
 @import "bootstrap/carousel";
 @import "bootstrap/spinners";
+@import "bootstrap/offcanvas";
 
 // Helpers
 @import "bootstrap/helpers";

data/assets/stylesheets/bootstrap/_accordion.scss

@@ -12,18 +12,15 @@
   color: $accordion-button-color;
   text-align: left; // Reset button style
   background-color: $accordion-button-bg;
-  border: $accordion-border-width solid $accordion-border-color;
+  border: 0;
   @include border-radius(0);
   overflow-anchor: none;
   @include transition($accordion-transition);
 
-  &.collapsed {
-    border-bottom-width: 0;
-  }
-
   &:not(.collapsed) {
     color: $accordion-button-active-color;
     background-color: $accordion-button-active-bg;
+    box-shadow: inset 0 ($accordion-border-width * -1) 0 $accordion-border-color;
 
     &::after {
       background-image: escape-svg($accordion-button-active-icon);
@@ -61,33 +58,35 @@
 }
 
 .accordion-item {
+  margin-bottom: -$accordion-border-width;
+  background-color: $accordion-bg;
+  border: $accordion-border-width solid $accordion-border-color;
+
   &:first-of-type {
+    @include border-top-radius($accordion-border-radius);
+
     .accordion-button {
-      @include border-top-radius($accordion-border-radius);
+      @include border-top-radius($accordion-inner-border-radius);
     }
   }
 
+  // Only set a border-radius on the last item if the accordion is collapsed
   &:last-of-type {
+    margin-bottom: 0;
+    @include border-bottom-radius($accordion-border-radius);
+
     .accordion-button {
-      // Only set a border-radius on the last item if the accordion is collapsed
       &.collapsed {
-        border-bottom-width: $accordion-border-width;
-        @include border-bottom-radius($accordion-border-radius);
+        @include border-bottom-radius($accordion-inner-border-radius);
       }
     }
 
     .accordion-collapse {
-      border-bottom-width: $accordion-border-width;
       @include border-bottom-radius($accordion-border-radius);
     }
   }
 }
 
-.accordion-collapse {
-  border: solid $accordion-border-color;
-  border-width: 0 $accordion-border-width;
-}
-
 .accordion-body {
   padding: $accordion-body-padding-y $accordion-body-padding-x;
 }
@@ -98,29 +97,20 @@
 // Remove borders and border-radius to keep accordion items edge-to-edge.
 
 .accordion-flush {
-  .accordion-button {
-    border-right: 0;
-    border-left: 0;
-    @include border-radius(0);
-  }
-
   .accordion-collapse {
     border-width: 0;
   }
 
   .accordion-item {
-    &:first-of-type {
-      .accordion-button {
-        border-top-width: 0;
-        @include border-top-radius(0);
-      }
-    }
+    border-right: 0;
+    border-left: 0;
+    @include border-radius(0);
 
-    &:last-of-type {
-      .accordion-button.collapsed {
-        border-bottom-width: 0;
-        @include border-bottom-radius(0);
-      }
+    &:first-child { border-top: 0; }
+    &:last-child { border-bottom: 0; }
+
+    .accordion-button {
+      @include border-radius(0);
     }
   }
 }

data/assets/stylesheets/bootstrap/_buttons.scss

@@ -55,6 +55,7 @@
 // Alternate buttons
 //
 
+// scss-docs-start btn-variant-loops
 @each $color, $value in $theme-colors {
   .btn-#{$color} {
     @include button-variant($value, $value);
@@ -66,6 +67,7 @@
     @include button-outline-variant($value);
   }
 }
+// scss-docs-end btn-variant-loops
 
 
 //

data/assets/stylesheets/bootstrap/_card.scss

@@ -69,7 +69,7 @@
   }
 
   + .card-link {
-    margin-left: $card-spacer-x #{"/* rtl:ignore */"};
+    margin-left: $card-spacer-x;
   }
 }
 

data/assets/stylesheets/bootstrap/_dropdown.scss

@@ -70,14 +70,11 @@
 // Allow for dropdowns to go bottom up (aka, dropup-menu)
 // Just add .dropup after the standard .dropdown class and you're set.
 .dropup {
-  .dropdown-menu {
+  .dropdown-menu[data-bs-popper] {
     top: auto;
     bottom: 100%;
-
-    &[data-bs-popper] {
-      margin-top: 0;
-      margin-bottom: $dropdown-spacer;
-    }
+    margin-top: 0;
+    margin-bottom: $dropdown-spacer;
   }
 
   .dropdown-toggle {

data/assets/stylesheets/bootstrap/_list-group.scss

@@ -12,6 +12,17 @@
   @include border-radius($list-group-border-radius);
 }
 
+.list-group-numbered {
+  list-style-type: none;
+  counter-reset: section;
+
+  > li::before {
+    // Increments only this instance of the section counter
+    content: counters(section, ".") ". ";
+    counter-increment: section;
+  }
+}
+
 
 // Interactive list items
 //

data/assets/stylesheets/bootstrap/_modal.scss

@@ -202,6 +202,7 @@
   .modal-xl { max-width: $modal-xl; }
 }
 
+// scss-docs-start modal-fullscreen-loop
 @each $breakpoint in map-keys($grid-breakpoints) {
   $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
   $postfix: if($infix != "", $infix + "-down", "");
@@ -233,3 +234,4 @@
     }
   }
 }
+// scss-docs-end modal-fullscreen-loop

data/assets/stylesheets/bootstrap/_nav.scss

@@ -117,6 +117,13 @@
   }
 }
 
+.nav-fill,
+.nav-justified {
+  .nav-item .nav-link {
+    width: 100%; // Make sure button will grow
+  }
+}
+
 
 // Tabbable tabs
 //

data/assets/stylesheets/bootstrap/_navbar.scss

@@ -154,6 +154,7 @@
   overflow-y: auto;
 }
 
+// scss-docs-start navbar-expand-loop
 // Generate series of `.navbar-expand-*` responsive classes for configuring
 // where your navbar collapses.
 .navbar-expand {
@@ -196,6 +197,7 @@
     }
   }
 }
+// scss-docs-end navbar-expand-loop
 
 
 // Navbar themes

data/assets/stylesheets/bootstrap/_offcanvas.scss

@@ -0,0 +1,77 @@
+.offcanvas {
+  position: fixed;
+  bottom: 0;
+  z-index: $zindex-offcanvas;
+  display: flex;
+  flex-direction: column;
+  max-width: 100%;
+  color: $offcanvas-color;
+  visibility: hidden;
+  background-color: $offcanvas-bg-color;
+  background-clip: padding-box;
+  outline: 0;
+  @include box-shadow($offcanvas-box-shadow);
+  @include transition(transform $offcanvas-transition-duration ease-in-out);
+}
+
+.offcanvas-header {
+  display: flex;
+  justify-content: space-between;
+  padding: $offcanvas-padding-y $offcanvas-padding-x;
+
+  .btn-close {
+    padding: ($offcanvas-padding-y / 2) ($offcanvas-padding-x / 2);
+    margin: ($offcanvas-padding-y / -2) ($offcanvas-padding-x / -2) ($offcanvas-padding-y / -2) auto;
+  }
+}
+
+.offcanvas-title {
+  margin-bottom: 0;
+  line-height: $offcanvas-title-line-height;
+}
+
+.offcanvas-body {
+  flex-grow: 1;
+  padding: $offcanvas-padding-y $offcanvas-padding-x;
+  overflow-y: auto;
+}
+
+.offcanvas-start {
+  top: 0;
+  left: 0;
+  width: $offcanvas-horizontal-width;
+  border-right: $offcanvas-border-width solid $offcanvas-border-color;
+  transform: translateX(-100%);
+}
+
+.offcanvas-end {
+  top: 0;
+  right: 0;
+  width: $offcanvas-horizontal-width;
+  border-left: $offcanvas-border-width solid $offcanvas-border-color;
+  transform: translateX(100%);
+}
+
+.offcanvas-bottom {
+  right: 0;
+  left: 0;
+  height: $offcanvas-vertical-height;
+  max-height: 100%;
+  border-top: $offcanvas-border-width solid $offcanvas-border-color;
+  transform: translateY(100%);
+}
+
+.offcanvas.show {
+  transform: none;
+}
+
+.offcanvas-backdrop::before {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: $zindex-offcanvas - 1;
+  width: 100vw;
+  height: 100vh;
+  content: "";
+  background-color: $offcanvas-body-backdrop-color;
+}

data/assets/stylesheets/bootstrap/_progress.scss

@@ -1,9 +1,12 @@
 // Disable animation if transitions are disabled
+
+// scss-docs-start progress-keyframes
 @if $enable-transitions {
   @keyframes progress-bar-stripes {
     0% { background-position-x: $progress-height; }
   }
 }
+// scss-docs-end progress-keyframes
 
 .progress {
   display: flex;

data/assets/stylesheets/bootstrap/_reboot.scss

@@ -57,20 +57,6 @@ body {
 }
 
 
-// Future-proof rule: in browsers that support :focus-visible, suppress the focus outline
-// on elements that programmatically receive focus but wouldn't normally show a visible
-// focus outline. In general, this would mean that the outline is only applied if the
-// interaction that led to the element receiving programmatic focus was a keyboard interaction,
-// or the browser has somehow determined that the user is primarily a keyboard user and/or
-// wants focus outlines to always be presented.
-// See https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible
-// and https://developer.paciellogroup.com/blog/2018/03/focus-visible-and-backwards-compatibility/
-
-[tabindex="-1"]:focus:not(:focus-visible) {
-  outline: 0 !important;
-}
-
-
 // Content grouping
 //
 // 1. Reset Firefox's gray color
@@ -156,7 +142,6 @@ p {
 
 abbr[title],
 abbr[data-bs-original-title] { // 1
-  text-decoration: underline; // 2
   text-decoration: underline dotted; // 2
   cursor: help; // 3
   text-decoration-skip-ink: none; // 4
@@ -434,12 +419,10 @@ textarea {
 }
 
 // Remove the inheritance of text transform in Firefox
-
 button,
 select {
   text-transform: none;
 }
-
 // Set the cursor for non-`<button>` buttons
 //
 // Details at https://github.com/twbs/bootstrap/pull/30562
@@ -447,11 +430,15 @@ select {
   cursor: pointer;
 }
 
-// Remove the inheritance of word-wrap in Safari.
-// See https://github.com/twbs/bootstrap/issues/24990
-
 select {
+  // Remove the inheritance of word-wrap in Safari.
+  // See https://github.com/twbs/bootstrap/issues/24990
   word-wrap: normal;
+
+  // Undo the opacity change from Chrome
+  &:disabled {
+    opacity: 1;
+  }
 }
 
 // Remove the dropdown arrow in Chrome from inputs built with datalists.
@@ -582,7 +569,6 @@ legend {
 
 // Inherit font family and line height for file input buttons
 
-// stylelint-disable-next-line selector-pseudo-element-no-unknown
 ::file-selector-button {
   font: inherit;
 }

data/assets/stylesheets/bootstrap/_spinners.scss

@@ -2,9 +2,11 @@
 // Rotating border
 //
 
+// scss-docs-start spinner-border-keyframes
 @keyframes spinner-border {
   to { transform: rotate(360deg) #{"/* rtl:ignore */"}; }
 }
+// scss-docs-end spinner-border-keyframes
 
 .spinner-border {
   display: inline-block;
@@ -28,6 +30,7 @@
 // Growing circle
 //
 
+// scss-docs-start spinner-grow-keyframes
 @keyframes spinner-grow {
   0% {
     transform: scale(0);
@@ -37,6 +40,7 @@
     transform: none;
   }
 }
+// scss-docs-end spinner-grow-keyframes
 
 .spinner-grow {
   display: inline-block;

data/assets/stylesheets/bootstrap/_transitions.scss

@@ -6,6 +6,7 @@
   }
 }
 
+// scss-docs-start collapse-classes
 .collapse {
   &:not(.show) {
     display: none;
@@ -17,3 +18,4 @@
   overflow: hidden;
   @include transition($transition-collapse);
 }
+// scss-docs-end collapse-classes