diff options
Diffstat (limited to 'vendor/twbs/bootstrap/scss')
57 files changed, 640 insertions, 401 deletions
diff --git a/vendor/twbs/bootstrap/scss/_badge.scss b/vendor/twbs/bootstrap/scss/_badge.scss index 2082f058e..42c5d08d7 100644 --- a/vendor/twbs/bootstrap/scss/_badge.scss +++ b/vendor/twbs/bootstrap/scss/_badge.scss @@ -16,7 +16,7 @@ @include transition($badge-transition); @at-root a#{&} { - @include hover-focus { + @include hover-focus() { text-decoration: none; } } diff --git a/vendor/twbs/bootstrap/scss/_breadcrumb.scss b/vendor/twbs/bootstrap/scss/_breadcrumb.scss index be3095069..a0cf7e29b 100644 --- a/vendor/twbs/bootstrap/scss/_breadcrumb.scss +++ b/vendor/twbs/bootstrap/scss/_breadcrumb.scss @@ -3,12 +3,15 @@ flex-wrap: wrap; padding: $breadcrumb-padding-y $breadcrumb-padding-x; margin-bottom: $breadcrumb-margin-bottom; + @include font-size($breadcrumb-font-size); list-style: none; background-color: $breadcrumb-bg; @include border-radius($breadcrumb-border-radius); } .breadcrumb-item { + display: flex; + // The separator between breadcrumbs (by default, a forward-slash: "/") + .breadcrumb-item { padding-left: $breadcrumb-item-padding; @@ -17,7 +20,7 @@ display: inline-block; // Suppress underlining of the separator in modern browsers padding-right: $breadcrumb-item-padding; color: $breadcrumb-divider-color; - content: $breadcrumb-divider; + content: escape-svg($breadcrumb-divider); } } diff --git a/vendor/twbs/bootstrap/scss/_button-group.scss b/vendor/twbs/bootstrap/scss/_button-group.scss index d7220029a..da02d7931 100644 --- a/vendor/twbs/bootstrap/scss/_button-group.scss +++ b/vendor/twbs/bootstrap/scss/_button-group.scss @@ -13,7 +13,7 @@ // Bring the hover, focused, and "active" buttons to the front to overlay // the borders properly - @include hover { + @include hover() { z-index: 1; } &:focus, diff --git a/vendor/twbs/bootstrap/scss/_buttons.scss b/vendor/twbs/bootstrap/scss/_buttons.scss index 2a7d94ad2..6ee24ba1f 100644 --- a/vendor/twbs/bootstrap/scss/_buttons.scss +++ b/vendor/twbs/bootstrap/scss/_buttons.scss @@ -10,6 +10,8 @@ font-weight: $btn-font-weight; color: $body-color; text-align: center; + text-decoration: if($link-decoration == none, null, none); + white-space: $btn-white-space; vertical-align: middle; user-select: none; background-color: transparent; @@ -17,7 +19,7 @@ @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius); @include transition($btn-transition); - @include hover { + @include hover() { color: $body-color; text-decoration: none; } @@ -35,12 +37,16 @@ @include box-shadow(none); } - &:not(:disabled):not(.disabled):active, - &:not(:disabled):not(.disabled).active { - @include box-shadow($btn-active-box-shadow); + &:not(:disabled):not(.disabled) { + cursor: if($enable-pointer-cursor-for-buttons, pointer, null); - &:focus { - @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow); + &:active, + &.active { + @include box-shadow($btn-active-box-shadow); + + &:focus { + @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow); + } } } } @@ -79,7 +85,7 @@ fieldset:disabled a.btn { color: $link-color; text-decoration: $link-decoration; - @include hover { + @include hover() { color: $link-hover-color; text-decoration: $link-hover-decoration; } @@ -87,7 +93,6 @@ fieldset:disabled a.btn { &:focus, &.focus { text-decoration: $link-hover-decoration; - box-shadow: none; } &:disabled, diff --git a/vendor/twbs/bootstrap/scss/_card.scss b/vendor/twbs/bootstrap/scss/_card.scss index c6b67ce05..7c35f7ed8 100644 --- a/vendor/twbs/bootstrap/scss/_card.scss +++ b/vendor/twbs/bootstrap/scss/_card.scss @@ -7,6 +7,7 @@ display: flex; flex-direction: column; min-width: 0; // See https://github.com/twbs/bootstrap/pull/22740#issuecomment-305868106 + height: $card-height; word-wrap: break-word; background-color: $card-bg; background-clip: border-box; @@ -18,23 +19,36 @@ margin-left: 0; } - > .list-group:first-child { - .list-group-item:first-child { - @include border-top-radius($card-border-radius); + > .list-group { + border-top: inherit; + border-bottom: inherit; + + &:first-child { + border-top-width: 0; + @include border-top-radius($card-inner-border-radius); } - } - > .list-group:last-child { - .list-group-item:last-child { - @include border-bottom-radius($card-border-radius); + &:last-child { + border-bottom-width: 0; + @include border-bottom-radius($card-inner-border-radius); } } + + // Due to specificity of the above selector (`.card > .list-group`), we must + // use a child selector here to prevent double borders. + > .card-header + .list-group, + > .list-group + .card-footer { + border-top: 0; + } } .card-body { // Enable `flex-grow: 1` for decks and groups so that card blocks take up // as much space as possible, ensuring footers are aligned to the bottom. flex: 1 1 auto; + // Workaround for the image size bug in IE + // See: https://github.com/twbs/bootstrap/pull/28855 + min-height: 1px; padding: $card-spacer-x; color: $card-color; } @@ -53,7 +67,7 @@ } .card-link { - @include hover { + @include hover() { text-decoration: none; } @@ -76,16 +90,11 @@ &:first-child { @include border-radius($card-inner-border-radius $card-inner-border-radius 0 0); } - - + .list-group { - .list-group-item:first-child { - border-top: 0; - } - } } .card-footer { padding: $card-spacer-y $card-spacer-x; + color: $card-cap-color; background-color: $card-cap-bg; border-top: $card-border-width solid $card-border-color; @@ -119,21 +128,23 @@ bottom: 0; left: 0; padding: $card-img-overlay-padding; + @include border-radius($card-inner-border-radius); } -.card-img { +.card-img, +.card-img-top, +.card-img-bottom { + flex-shrink: 0; // For IE: https://github.com/twbs/bootstrap/issues/29396 width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch - @include border-radius($card-inner-border-radius); } -// Card image caps +.card-img, .card-img-top { - width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch @include border-top-radius($card-inner-border-radius); } +.card-img, .card-img-bottom { - width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch @include border-bottom-radius($card-inner-border-radius); } @@ -141,23 +152,19 @@ // Card deck .card-deck { - display: flex; - flex-direction: column; - .card { margin-bottom: $card-deck-margin; } @include media-breakpoint-up(sm) { + display: flex; flex-flow: row wrap; margin-right: -$card-deck-margin; margin-left: -$card-deck-margin; .card { - display: flex; // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4 flex: 1 0 0%; - flex-direction: column; margin-right: $card-deck-margin; margin-bottom: 0; // Override the default margin-left: $card-deck-margin; @@ -171,9 +178,6 @@ // .card-group { - display: flex; - flex-direction: column; - // The child selector allows nested `.card` within `.card-group` // to display properly. > .card { @@ -181,6 +185,7 @@ } @include media-breakpoint-up(sm) { + display: flex; flex-flow: row wrap; // The child selector allows nested `.card` within `.card-group` // to display properly. @@ -259,30 +264,22 @@ // .accordion { + overflow-anchor: none; + > .card { overflow: hidden; - &:not(:first-of-type) { - .card-header:first-child { - @include border-radius(0); - } - - &:not(:last-of-type) { - border-bottom: 0; - @include border-radius(0); - } - } - - &:first-of-type { + &:not(:last-of-type) { border-bottom: 0; @include border-bottom-radius(0); } - &:last-of-type { + &:not(:first-of-type) { @include border-top-radius(0); } - .card-header { + > .card-header { + @include border-radius(0); margin-bottom: -$card-border-width; } } diff --git a/vendor/twbs/bootstrap/scss/_carousel.scss b/vendor/twbs/bootstrap/scss/_carousel.scss index 20ea04baf..fb5e9f856 100644 --- a/vendor/twbs/bootstrap/scss/_carousel.scss +++ b/vendor/twbs/bootstrap/scss/_carousel.scss @@ -75,7 +75,7 @@ .active.carousel-item-right { z-index: 0; opacity: 0; - @include transition(0s $carousel-transition-duration opacity); + @include transition(opacity 0s $carousel-transition-duration); } } @@ -101,7 +101,7 @@ @include transition($carousel-control-transition); // Hover/focus state - @include hover-focus { + @include hover-focus() { color: $carousel-control-color; text-decoration: none; outline: 0; @@ -111,13 +111,13 @@ .carousel-control-prev { left: 0; @if $enable-gradients { - background: linear-gradient(90deg, rgba($black, .25), rgba($black, .001)); + background-image: linear-gradient(90deg, rgba($black, .25), rgba($black, .001)); } } .carousel-control-next { right: 0; @if $enable-gradients { - background: linear-gradient(270deg, rgba($black, .25), rgba($black, .001)); + background-image: linear-gradient(270deg, rgba($black, .25), rgba($black, .001)); } } @@ -130,10 +130,10 @@ background: no-repeat 50% / 100% 100%; } .carousel-control-prev-icon { - background-image: $carousel-control-prev-icon-bg; + background-image: escape-svg($carousel-control-prev-icon-bg); } .carousel-control-next-icon { - background-image: $carousel-control-next-icon-bg; + background-image: escape-svg($carousel-control-next-icon-bg); } diff --git a/vendor/twbs/bootstrap/scss/_close.scss b/vendor/twbs/bootstrap/scss/_close.scss index 5cc96f573..82e9593ef 100644 --- a/vendor/twbs/bootstrap/scss/_close.scss +++ b/vendor/twbs/bootstrap/scss/_close.scss @@ -8,13 +8,13 @@ opacity: .5; // Override <a>'s hover style - @include hover { + @include hover() { color: $close-color; text-decoration: none; } &:not(:disabled):not(.disabled) { - @include hover-focus { + @include hover-focus() { opacity: .75; } } @@ -30,7 +30,6 @@ button.close { padding: 0; background-color: transparent; border: 0; - appearance: none; } // Future-proof disabling of clicks on `<a>` elements diff --git a/vendor/twbs/bootstrap/scss/_code.scss b/vendor/twbs/bootstrap/scss/_code.scss index 74b6e1c89..4bc117a96 100644 --- a/vendor/twbs/bootstrap/scss/_code.scss +++ b/vendor/twbs/bootstrap/scss/_code.scss @@ -2,7 +2,7 @@ code { @include font-size($code-font-size); color: $code-color; - word-break: break-word; + word-wrap: break-word; // Streamline the style when inside anchors to avoid broken underline and more a > & { diff --git a/vendor/twbs/bootstrap/scss/_custom-forms.scss b/vendor/twbs/bootstrap/scss/_custom-forms.scss index 03f3fc5be..9aeeeda7f 100644 --- a/vendor/twbs/bootstrap/scss/_custom-forms.scss +++ b/vendor/twbs/bootstrap/scss/_custom-forms.scss @@ -9,6 +9,7 @@ .custom-control { position: relative; + z-index: 1; display: block; min-height: $font-size-base * $line-height-base; padding-left: $custom-control-gutter + $custom-control-indicator-size; @@ -21,7 +22,10 @@ .custom-control-input { position: absolute; + left: 0; z-index: -1; // Put the input behind the label so it doesn't overlay text + width: $custom-control-indicator-size; + height: ($font-size-base * $line-height-base + $custom-control-indicator-size) / 2; opacity: 0; &:checked ~ .custom-control-label::before { @@ -51,6 +55,8 @@ @include box-shadow($custom-control-indicator-active-box-shadow); } + // Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247 + &[disabled], &:disabled { ~ .custom-control-label { color: $custom-control-label-disabled-color; @@ -69,7 +75,9 @@ .custom-control-label { position: relative; margin-bottom: 0; + color: $custom-control-label-color; vertical-align: top; + cursor: $custom-control-cursor; // Background-color and (when enabled) gradient &::before { @@ -111,7 +119,7 @@ .custom-control-input:checked ~ .custom-control-label { &::after { - background-image: $custom-checkbox-indicator-icon-checked; + background-image: escape-svg($custom-checkbox-indicator-icon-checked); } } @@ -122,16 +130,16 @@ @include box-shadow($custom-checkbox-indicator-indeterminate-box-shadow); } &::after { - background-image: $custom-checkbox-indicator-icon-indeterminate; + background-image: escape-svg($custom-checkbox-indicator-icon-indeterminate); } } .custom-control-input:disabled { &:checked ~ .custom-control-label::before { - background-color: $custom-control-indicator-checked-disabled-bg; + @include gradient-bg($custom-control-indicator-checked-disabled-bg); } &:indeterminate ~ .custom-control-label::before { - background-color: $custom-control-indicator-checked-disabled-bg; + @include gradient-bg($custom-control-indicator-checked-disabled-bg); } } } @@ -148,13 +156,13 @@ .custom-control-input:checked ~ .custom-control-label { &::after { - background-image: $custom-radio-indicator-icon-checked; + background-image: escape-svg($custom-radio-indicator-icon-checked); } } .custom-control-input:disabled { &:checked ~ .custom-control-label::before { - background-color: $custom-control-indicator-checked-disabled-bg; + @include gradient-bg($custom-control-indicator-checked-disabled-bg); } } } @@ -177,8 +185,8 @@ } &::after { - top: calc(#{(($font-size-base * $line-height-base - $custom-control-indicator-size) / 2)} + #{$custom-control-indicator-border-width * 2}); - left: calc(#{-($custom-switch-width + $custom-control-gutter)} + #{$custom-control-indicator-border-width * 2}); + top: add(($font-size-base * $line-height-base - $custom-control-indicator-size) / 2, $custom-control-indicator-border-width * 2); + left: add(-($custom-switch-width + $custom-control-gutter), $custom-control-indicator-border-width * 2); width: $custom-switch-indicator-size; height: $custom-switch-indicator-size; background-color: $custom-control-indicator-border-color; @@ -197,7 +205,7 @@ .custom-control-input:disabled { &:checked ~ .custom-control-label::before { - background-color: $custom-control-indicator-checked-disabled-bg; + @include gradient-bg($custom-control-indicator-checked-disabled-bg); } } } @@ -220,8 +228,7 @@ line-height: $custom-select-line-height; color: $custom-select-color; vertical-align: middle; - background: $custom-select-background; - background-color: $custom-select-bg; + background: $custom-select-bg $custom-select-background; border: $custom-select-border-width solid $custom-select-border-color; @include border-radius($custom-select-border-radius, 0); @include box-shadow($custom-select-box-shadow); @@ -231,8 +238,9 @@ border-color: $custom-select-focus-border-color; outline: 0; @if $enable-shadows { - box-shadow: $custom-select-box-shadow, $custom-select-focus-box-shadow; + @include box-shadow($custom-select-box-shadow, $custom-select-focus-box-shadow); } @else { + // Avoid using mixin so we can pass custom focus shadow properly box-shadow: $custom-select-focus-box-shadow; } @@ -263,6 +271,12 @@ &::-ms-expand { display: none; } + + // Remove outline from select box in FF + &:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 $custom-select-color; + } } .custom-select-sm { @@ -307,6 +321,8 @@ box-shadow: $custom-file-focus-box-shadow; } + // Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247 + &[disabled] ~ .custom-file-label, &:disabled ~ .custom-file-label { background-color: $custom-file-disabled-bg; } @@ -365,7 +381,7 @@ .custom-range { width: 100%; - height: calc(#{$custom-range-thumb-height} + #{$custom-range-thumb-focus-box-shadow-width * 2}); + height: add($custom-range-thumb-height, $custom-range-thumb-focus-box-shadow-width * 2); padding: 0; // Need to reset padding background-color: transparent; appearance: none; diff --git a/vendor/twbs/bootstrap/scss/_dropdown.scss b/vendor/twbs/bootstrap/scss/_dropdown.scss index ac3c8c8a2..2ab7536e1 100644 --- a/vendor/twbs/bootstrap/scss/_dropdown.scss +++ b/vendor/twbs/bootstrap/scss/_dropdown.scss @@ -10,7 +10,7 @@ white-space: nowrap; // Generate the caret automatically - @include caret; + @include caret(); } // The dropdown menu @@ -114,7 +114,7 @@ // Dividers (basically an `<hr>`) within the dropdown .dropdown-divider { - @include nav-divider($dropdown-divider-bg, $dropdown-divider-margin-y); + @include nav-divider($dropdown-divider-bg, $dropdown-divider-margin-y, true); } // Links, buttons, and more within the dropdown menu @@ -128,6 +128,7 @@ font-weight: $font-weight-normal; color: $dropdown-link-color; text-align: inherit; // For `<button>`s + text-decoration: if($link-decoration == none, null, none); white-space: nowrap; // prevent links from randomly breaking onto new lines background-color: transparent; // For `<button>`s border: 0; // For `<button>`s @@ -144,7 +145,7 @@ } } - @include hover-focus { + @include hover-focus() { color: $dropdown-link-hover-color; text-decoration: none; @include gradient-bg($dropdown-link-hover-bg); @@ -176,7 +177,7 @@ // Dropdown section headers .dropdown-header { display: block; - padding: $dropdown-padding-y $dropdown-item-padding-x; + padding: $dropdown-header-padding; margin-bottom: 0; // for use with heading elements @include font-size($font-size-sm); color: $dropdown-header-color; diff --git a/vendor/twbs/bootstrap/scss/_forms.scss b/vendor/twbs/bootstrap/scss/_forms.scss index ec9c33559..66a4efe1d 100644 --- a/vendor/twbs/bootstrap/scss/_forms.scss +++ b/vendor/twbs/bootstrap/scss/_forms.scss @@ -30,8 +30,14 @@ border: 0; } + // Remove select outline from select box in FF + &:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 $input-color; + } + // Customize the `:focus` state to imitate native WebKit styles. - @include form-control-focus(); + @include form-control-focus($ignore-warning: true); // Placeholder &::placeholder { @@ -53,6 +59,15 @@ } } +input[type="date"], +input[type="time"], +input[type="datetime-local"], +input[type="month"] { + &.form-control { + appearance: none; // Fix appearance for date inputs in Safari + } +} + select.form-control { &:focus::-ms-value { // Suppress the nested default white text on blue background highlight given to @@ -80,23 +95,23 @@ select.form-control { // For use with horizontal and inline forms, when you need the label (or legend) // text to align with the form controls. .col-form-label { - padding-top: calc(#{$input-padding-y} + #{$input-border-width}); - padding-bottom: calc(#{$input-padding-y} + #{$input-border-width}); + padding-top: add($input-padding-y, $input-border-width); + padding-bottom: add($input-padding-y, $input-border-width); margin-bottom: 0; // Override the `<label>/<legend>` default @include font-size(inherit); // Override the `<legend>` default line-height: $input-line-height; } .col-form-label-lg { - padding-top: calc(#{$input-padding-y-lg} + #{$input-border-width}); - padding-bottom: calc(#{$input-padding-y-lg} + #{$input-border-width}); + padding-top: add($input-padding-y-lg, $input-border-width); + padding-bottom: add($input-padding-y-lg, $input-border-width); @include font-size($input-font-size-lg); line-height: $input-line-height-lg; } .col-form-label-sm { - padding-top: calc(#{$input-padding-y-sm} + #{$input-border-width}); - padding-bottom: calc(#{$input-padding-y-sm} + #{$input-border-width}); + padding-top: add($input-padding-y-sm, $input-border-width); + padding-bottom: add($input-padding-y-sm, $input-border-width); @include font-size($input-font-size-sm); line-height: $input-line-height-sm; } @@ -110,9 +125,9 @@ select.form-control { .form-control-plaintext { display: block; width: 100%; - padding-top: $input-padding-y; - padding-bottom: $input-padding-y; + padding: $input-padding-y 0; margin-bottom: 0; // match inputs if this class comes on inputs with default margins + @include font-size($input-font-size); line-height: $input-line-height; color: $input-plaintext-color; background-color: transparent; @@ -210,6 +225,8 @@ textarea.form-control { margin-top: $form-check-input-margin-y; margin-left: -$form-check-input-gutter; + // Use [disabled] and :disabled for workaround https://github.com/twbs/bootstrap/issues/28247 + &[disabled] ~ .form-check-label, &:disabled ~ .form-check-label { color: $text-muted; } diff --git a/vendor/twbs/bootstrap/scss/_functions.scss b/vendor/twbs/bootstrap/scss/_functions.scss index d2cc91d57..eb2471d75 100644 --- a/vendor/twbs/bootstrap/scss/_functions.scss +++ b/vendor/twbs/bootstrap/scss/_functions.scss @@ -8,7 +8,7 @@ $prev-key: null; $prev-num: null; @each $key, $num in $map { - @if $prev-num == null or unit($num) == "%" { + @if $prev-num == null or unit($num) == "%" or unit($prev-num) == "%" { // Do nothing } @else if not comparable($prev-num, $num) { @warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !"; @@ -23,10 +23,12 @@ // Starts at zero // Used to ensure the min-width of the lowest breakpoint starts at 0. @mixin _assert-starts-at-zero($map, $map-name: "$grid-breakpoints") { - $values: map-values($map); - $first-value: nth($values, 1); - @if $first-value != 0 { - @warn "First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}."; + @if length($map) > 0 { + $values: map-values($map); + $first-value: nth($values, 1); + @if $first-value != 0 { + @warn "First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}."; + } } } @@ -48,6 +50,22 @@ @return $string; } +// See https://codepen.io/kevinweber/pen/dXWoRw +@function escape-svg($string) { + @if str-index($string, "data:image/svg+xml") { + @each $char, $encoded in $escaped-characters { + // Do not escape the url brackets + @if str-index($string, "url(") == 1 { + $string: url("#{str-replace(str-slice($string, 6, -3), $char, $encoded)}"); + } @else { + $string: str-replace($string, $char, $encoded); + } + } + } + + @return $string; +} + // Color contrast @function color-yiq($color, $dark: $yiq-text-dark, $light: $yiq-text-light) { $r: red($color); @@ -84,3 +102,40 @@ @return mix($color-base, $color, $level * $theme-color-interval); } + +// Return valid calc +@function add($value1, $value2, $return-calc: true) { + @if $value1 == null { + @return $value2; + } + + @if $value2 == null { + @return $value1; + } + + @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) { + @return $value1 + $value2; + } + + @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(" + ") + $value2); +} + +@function subtract($value1, $value2, $return-calc: true) { + @if $value1 == null and $value2 == null { + @return null; + } + + @if $value1 == null { + @return -$value2; + } + + @if $value2 == null { + @return $value1; + } + + @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) { + @return $value1 - $value2; + } + + @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(" - ") + $value2); +} diff --git a/vendor/twbs/bootstrap/scss/_grid.scss b/vendor/twbs/bootstrap/scss/_grid.scss index a22751537..0bfe5303b 100644 --- a/vendor/twbs/bootstrap/scss/_grid.scss +++ b/vendor/twbs/bootstrap/scss/_grid.scss @@ -3,26 +3,47 @@ // Set the container width, and override it for fixed navbars in media queries. @if $enable-grid-classes { - .container { + // Single container class with breakpoint max-widths + .container, + // 100% wide container at all breakpoints + .container-fluid { @include make-container(); - @include make-container-max-widths(); } -} -// Fluid container -// -// Utilizes the mixin meant for fixed width containers, but with 100% width for -// fluid, full width layouts. + // Responsive containers that are 100% wide until a breakpoint + @each $breakpoint, $container-max-width in $container-max-widths { + .container-#{$breakpoint} { + @extend .container-fluid; + } -@if $enable-grid-classes { - .container-fluid { - @include make-container(); + @include media-breakpoint-up($breakpoint, $grid-breakpoints) { + %responsive-container-#{$breakpoint} { + max-width: $container-max-width; + } + + // Extend each breakpoint which is smaller or equal to the current breakpoint + $extend-breakpoint: true; + + @each $name, $width in $grid-breakpoints { + @if ($extend-breakpoint) { + .container#{breakpoint-infix($name, $grid-breakpoints)} { + @extend %responsive-container-#{$breakpoint}; + } + + // Once the current breakpoint is reached, stop extending + @if ($breakpoint == $name) { + $extend-breakpoint: false; + } + } + } + } } } + // Row // -// Rows contain and clear the floats of your columns. +// Rows contain your columns. @if $enable-grid-classes { .row { diff --git a/vendor/twbs/bootstrap/scss/_images.scss b/vendor/twbs/bootstrap/scss/_images.scss index cb9795e27..b11b45a37 100644 --- a/vendor/twbs/bootstrap/scss/_images.scss +++ b/vendor/twbs/bootstrap/scss/_images.scss @@ -6,7 +6,7 @@ // which weren't expecting the images within themselves to be involuntarily resized. // See also https://github.com/twbs/bootstrap/issues/18178 .img-fluid { - @include img-fluid; + @include img-fluid(); } @@ -19,7 +19,7 @@ @include box-shadow($thumbnail-box-shadow); // Keep them at most 100% wide - @include img-fluid; + @include img-fluid(); } // diff --git a/vendor/twbs/bootstrap/scss/_input-group.scss b/vendor/twbs/bootstrap/scss/_input-group.scss index ac49f696c..cad8ea367 100644 --- a/vendor/twbs/bootstrap/scss/_input-group.scss +++ b/vendor/twbs/bootstrap/scss/_input-group.scss @@ -17,9 +17,8 @@ > .custom-file { position: relative; // For focus state's z-index flex: 1 1 auto; - // Add width 1% and flex-basis auto to ensure that button will not wrap out - // the column. Applies to IE Edge+ and Firefox. Chrome does not require this. width: 1%; + min-width: 0; // https://stackoverflow.com/questions/36247140/why-dont-flex-items-shrink-past-content-size margin-bottom: 0; + .form-control, diff --git a/vendor/twbs/bootstrap/scss/_list-group.scss b/vendor/twbs/bootstrap/scss/_list-group.scss index 3f80687ab..37c307e22 100644 --- a/vendor/twbs/bootstrap/scss/_list-group.scss +++ b/vendor/twbs/bootstrap/scss/_list-group.scss @@ -9,6 +9,7 @@ // No need to set list-style: none; since .list-group-item is block level padding-left: 0; // reset padding because ul and ol margin-bottom: 0; + @include border-radius($list-group-border-radius); } @@ -23,7 +24,7 @@ text-align: inherit; // For `<button>`s (anchors inherit) // Hover state - @include hover-focus { + @include hover-focus() { z-index: 1; // Place hover/focus items above their siblings for proper border styling color: $list-group-action-hover-color; text-decoration: none; @@ -45,19 +46,17 @@ position: relative; display: block; padding: $list-group-item-padding-y $list-group-item-padding-x; - // Place the border on the list items and negative margin up for better styling - margin-bottom: -$list-group-border-width; color: $list-group-color; + text-decoration: if($link-decoration == none, null, none); background-color: $list-group-bg; border: $list-group-border-width solid $list-group-border-color; &:first-child { - @include border-top-radius($list-group-border-radius); + @include border-top-radius(inherit); } &:last-child { - margin-bottom: 0; - @include border-bottom-radius($list-group-border-radius); + @include border-bottom-radius(inherit); } &.disabled, @@ -74,6 +73,15 @@ background-color: $list-group-active-bg; border-color: $list-group-active-border-color; } + + & + & { + border-top-width: 0; + + &.active { + margin-top: -$list-group-border-width; + border-top-width: $list-group-border-width; + } + } } @@ -88,20 +96,30 @@ .list-group-horizontal#{$infix} { flex-direction: row; - .list-group-item { - margin-right: -$list-group-border-width; - margin-bottom: 0; - + > .list-group-item { &:first-child { - @include border-left-radius($list-group-border-radius); + @include border-bottom-left-radius($list-group-border-radius); @include border-top-right-radius(0); } &:last-child { - margin-right: 0; - @include border-right-radius($list-group-border-radius); + @include border-top-right-radius($list-group-border-radius); @include border-bottom-left-radius(0); } + + &.active { + margin-top: 0; + } + + & + .list-group-item { + border-top-width: $list-group-border-width; + border-left-width: 0; + + &.active { + margin-left: -$list-group-border-width; + border-left-width: $list-group-border-width; + } + } } } } @@ -114,26 +132,13 @@ // useful within other components (e.g., cards). .list-group-flush { - .list-group-item { - border-right: 0; - border-left: 0; - @include border-radius(0); + @include border-radius(0); - &:last-child { - margin-bottom: -$list-group-border-width; - } - } + > .list-group-item { + border-width: 0 0 $list-group-border-width; - &:first-child { - .list-group-item:first-child { - border-top: 0; - } - } - - &:last-child { - .list-group-item:last-child { - margin-bottom: 0; - border-bottom: 0; + &:last-child { + border-bottom-width: 0; } } } diff --git a/vendor/twbs/bootstrap/scss/_mixins.scss b/vendor/twbs/bootstrap/scss/_mixins.scss index cc957843f..7e7a23d25 100644 --- a/vendor/twbs/bootstrap/scss/_mixins.scss +++ b/vendor/twbs/bootstrap/scss/_mixins.scss @@ -22,7 +22,7 @@ @import "mixins/text-truncate"; @import "mixins/visibility"; -// // Components +// Components @import "mixins/alert"; @import "mixins/buttons"; @import "mixins/caret"; @@ -33,14 +33,14 @@ @import "mixins/forms"; @import "mixins/table-row"; -// // Skins +// Skins @import "mixins/background-variant"; @import "mixins/border-radius"; @import "mixins/box-shadow"; @import "mixins/gradients"; @import "mixins/transition"; -// // Layout +// Layout @import "mixins/clearfix"; @import "mixins/grid-framework"; @import "mixins/grid"; diff --git a/vendor/twbs/bootstrap/scss/_modal.scss b/vendor/twbs/bootstrap/scss/_modal.scss index 6b6770b32..e43c70fbb 100644 --- a/vendor/twbs/bootstrap/scss/_modal.scss +++ b/vendor/twbs/bootstrap/scss/_modal.scss @@ -48,14 +48,19 @@ .modal.show & { transform: $modal-show-transform; } + + // When trying to close, animate focus to scale + .modal.modal-static & { + transform: $modal-scale-transform; + } } .modal-dialog-scrollable { display: flex; // IE10/11 - max-height: calc(100% - #{$modal-dialog-margin * 2}); + max-height: subtract(100%, $modal-dialog-margin * 2); .modal-content { - max-height: calc(100vh - #{$modal-dialog-margin * 2}); // IE10/11 + max-height: subtract(100vh, $modal-dialog-margin * 2); // IE10/11 overflow: hidden; } @@ -72,12 +77,13 @@ .modal-dialog-centered { display: flex; align-items: center; - min-height: calc(100% - #{$modal-dialog-margin * 2}); + min-height: subtract(100%, $modal-dialog-margin * 2); // Ensure `modal-dialog-centered` extends the full height of the view (IE10/11) &::before { display: block; // IE10 - height: calc(100vh - #{$modal-dialog-margin * 2}); + height: subtract(100vh, $modal-dialog-margin * 2); + height: min-content; // Reset height to 0 except on IE content: ""; } @@ -138,7 +144,7 @@ justify-content: space-between; // Put modal header elements (title and dismiss) on opposite ends padding: $modal-header-padding; border-bottom: $modal-header-border-width solid $modal-header-border-color; - @include border-top-radius($modal-content-border-radius); + @include border-top-radius($modal-content-inner-border-radius); .close { padding: $modal-header-padding; @@ -158,7 +164,7 @@ .modal-body { position: relative; // Enable `flex-grow: 1` so that the body take up as much space as possible - // when should there be a fixed height on `.modal-dialog`. + // when there should be a fixed height on `.modal-dialog`. flex: 1 1 auto; padding: $modal-inner-padding; } @@ -166,15 +172,19 @@ // Footer (for actions) .modal-footer { display: flex; + flex-wrap: wrap; align-items: center; // vertically center justify-content: flex-end; // Right align buttons with flex property because text-align doesn't work on flex items - padding: $modal-inner-padding; + padding: $modal-inner-padding - $modal-footer-margin-between / 2; border-top: $modal-footer-border-width solid $modal-footer-border-color; - @include border-bottom-radius($modal-content-border-radius); + @include border-bottom-radius($modal-content-inner-border-radius); - // Easily place margin between footer elements - > :not(:first-child) { margin-left: .25rem; } - > :not(:last-child) { margin-right: .25rem; } + // Place margin between footer elements + // This solution is far from ideal because of the universal selector usage, + // but is needed to fix https://github.com/twbs/bootstrap/issues/24800 + > * { + margin: $modal-footer-margin-between / 2; + } } // Measure scrollbar width for padding body during modal show/hide @@ -195,18 +205,19 @@ } .modal-dialog-scrollable { - max-height: calc(100% - #{$modal-dialog-margin-y-sm-up * 2}); + max-height: subtract(100%, $modal-dialog-margin-y-sm-up * 2); .modal-content { - max-height: calc(100vh - #{$modal-dialog-margin-y-sm-up * 2}); + max-height: subtract(100vh, $modal-dialog-margin-y-sm-up * 2); } } .modal-dialog-centered { - min-height: calc(100% - #{$modal-dialog-margin-y-sm-up * 2}); + min-height: subtract(100%, $modal-dialog-margin-y-sm-up * 2); &::before { - height: calc(100vh - #{$modal-dialog-margin-y-sm-up * 2}); + height: subtract(100vh, $modal-dialog-margin-y-sm-up * 2); + height: min-content; } } diff --git a/vendor/twbs/bootstrap/scss/_nav.scss b/vendor/twbs/bootstrap/scss/_nav.scss index e5519b3a4..d866c9841 100644 --- a/vendor/twbs/bootstrap/scss/_nav.scss +++ b/vendor/twbs/bootstrap/scss/_nav.scss @@ -1,7 +1,7 @@ // Base class // // Kickstart any navigation component with a set of style resets. Works with -// `<nav>`s or `<ul>`s. +// `<nav>`s, `<ul>`s or `<ol>`s. .nav { display: flex; @@ -14,8 +14,9 @@ .nav-link { display: block; padding: $nav-link-padding-y $nav-link-padding-x; + text-decoration: if($link-decoration == none, null, none); - @include hover-focus { + @include hover-focus() { text-decoration: none; } @@ -42,7 +43,7 @@ border: $nav-tabs-border-width solid transparent; @include border-top-radius($nav-tabs-border-radius); - @include hover-focus { + @include hover-focus() { border-color: $nav-tabs-link-hover-border-color; } @@ -91,6 +92,7 @@ // .nav-fill { + > .nav-link, .nav-item { flex: 1 1 auto; text-align: center; @@ -98,6 +100,7 @@ } .nav-justified { + > .nav-link, .nav-item { flex-basis: 0; flex-grow: 1; diff --git a/vendor/twbs/bootstrap/scss/_navbar.scss b/vendor/twbs/bootstrap/scss/_navbar.scss index 5c6e96399..5f10a62f1 100644 --- a/vendor/twbs/bootstrap/scss/_navbar.scss +++ b/vendor/twbs/bootstrap/scss/_navbar.scss @@ -25,13 +25,23 @@ // Because flex properties aren't inherited, we need to redeclare these first // few properties so that content nested within behave properly. - > .container, - > .container-fluid { + %container-flex-properties { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } + + .container, + .container-fluid { + @extend %container-flex-properties; + } + + @each $breakpoint, $container-max-width in $container-max-widths { + > .container#{breakpoint-infix($breakpoint, $container-max-widths)} { + @extend %container-flex-properties; + } + } } @@ -48,7 +58,7 @@ line-height: inherit; white-space: nowrap; - @include hover-focus { + @include hover-focus() { text-decoration: none; } } @@ -113,7 +123,7 @@ border: $border-width solid transparent; // remove default button style @include border-radius($navbar-toggler-border-radius); - @include hover-focus { + @include hover-focus() { text-decoration: none; } } @@ -139,11 +149,21 @@ &#{$infix} { @include media-breakpoint-down($breakpoint) { - > .container, - > .container-fluid { + %container-navbar-expand-#{$breakpoint} { padding-right: 0; padding-left: 0; } + + > .container, + > .container-fluid { + @extend %container-navbar-expand-#{$breakpoint}; + } + + @each $size, $container-max-width in $container-max-widths { + > .container#{breakpoint-infix($size, $container-max-widths)} { + @extend %container-navbar-expand-#{$breakpoint}; + } + } } @include media-breakpoint-up($next) { @@ -164,9 +184,19 @@ } // For nesting containers, have to redeclare for alignment purposes + %container-nesting-#{$breakpoint} { + flex-wrap: nowrap; + } + > .container, > .container-fluid { - flex-wrap: nowrap; + @extend %container-nesting-#{$breakpoint}; + } + + @each $size, $container-max-width in $container-max-widths { + > .container#{breakpoint-infix($size, $container-max-widths)} { + @extend %container-nesting-#{$breakpoint}; + } } .navbar-collapse { @@ -194,7 +224,7 @@ .navbar-brand { color: $navbar-light-brand-color; - @include hover-focus { + @include hover-focus() { color: $navbar-light-brand-hover-color; } } @@ -203,7 +233,7 @@ .nav-link { color: $navbar-light-color; - @include hover-focus { + @include hover-focus() { color: $navbar-light-hover-color; } @@ -226,7 +256,7 @@ } .navbar-toggler-icon { - background-image: $navbar-light-toggler-icon-bg; + background-image: escape-svg($navbar-light-toggler-icon-bg); } .navbar-text { @@ -234,7 +264,7 @@ a { color: $navbar-light-active-color; - @include hover-focus { + @include hover-focus() { color: $navbar-light-active-color; } } @@ -246,7 +276,7 @@ .navbar-brand { color: $navbar-dark-brand-color; - @include hover-focus { + @include hover-focus() { color: $navbar-dark-brand-hover-color; } } @@ -255,7 +285,7 @@ .nav-link { color: $navbar-dark-color; - @include hover-focus { + @include hover-focus() { color: $navbar-dark-hover-color; } @@ -278,7 +308,7 @@ } .navbar-toggler-icon { - background-image: $navbar-dark-toggler-icon-bg; + background-image: escape-svg($navbar-dark-toggler-icon-bg); } .navbar-text { @@ -286,7 +316,7 @@ a { color: $navbar-dark-active-color; - @include hover-focus { + @include hover-focus() { color: $navbar-dark-active-color; } } diff --git a/vendor/twbs/bootstrap/scss/_pagination.scss b/vendor/twbs/bootstrap/scss/_pagination.scss index b4345311d..d7d553cca 100644 --- a/vendor/twbs/bootstrap/scss/_pagination.scss +++ b/vendor/twbs/bootstrap/scss/_pagination.scss @@ -11,6 +11,7 @@ margin-left: -$pagination-border-width; line-height: $pagination-line-height; color: $pagination-color; + text-decoration: if($link-decoration == none, null, none); background-color: $pagination-bg; border: $pagination-border-width solid $pagination-border-color; @@ -23,7 +24,7 @@ } &:focus { - z-index: 2; + z-index: 3; outline: $pagination-focus-outline; box-shadow: $pagination-focus-box-shadow; } @@ -43,7 +44,7 @@ } &.active .page-link { - z-index: 1; + z-index: 3; color: $pagination-active-color; background-color: $pagination-active-bg; border-color: $pagination-active-border-color; diff --git a/vendor/twbs/bootstrap/scss/_popover.scss b/vendor/twbs/bootstrap/scss/_popover.scss index f205e6681..0ad76af3e 100644 --- a/vendor/twbs/bootstrap/scss/_popover.scss +++ b/vendor/twbs/bootstrap/scss/_popover.scss @@ -22,7 +22,7 @@ display: block; width: $popover-arrow-width; height: $popover-arrow-height; - margin: 0 $border-radius-lg; + margin: 0 $popover-border-radius; &::before, &::after { @@ -39,7 +39,7 @@ margin-bottom: $popover-arrow-height; > .arrow { - bottom: calc((#{$popover-arrow-height} + #{$popover-border-width}) * -1); + bottom: subtract(-$popover-arrow-height, $popover-border-width); &::before { bottom: 0; @@ -59,10 +59,10 @@ margin-left: $popover-arrow-height; > .arrow { - left: calc((#{$popover-arrow-height} + #{$popover-border-width}) * -1); + left: subtract(-$popover-arrow-height, $popover-border-width); width: $popover-arrow-height; height: $popover-arrow-width; - margin: $border-radius-lg 0; // make sure the arrow does not touch the popover's rounded corners + margin: $popover-border-radius 0; // make sure the arrow does not touch the popover's rounded corners &::before { left: 0; @@ -82,7 +82,7 @@ margin-top: $popover-arrow-height; > .arrow { - top: calc((#{$popover-arrow-height} + #{$popover-border-width}) * -1); + top: subtract(-$popover-arrow-height, $popover-border-width); &::before { top: 0; @@ -114,10 +114,10 @@ margin-right: $popover-arrow-height; > .arrow { - right: calc((#{$popover-arrow-height} + #{$popover-border-width}) * -1); + right: subtract(-$popover-arrow-height, $popover-border-width); width: $popover-arrow-height; height: $popover-arrow-width; - margin: $border-radius-lg 0; // make sure the arrow does not touch the popover's rounded corners + margin: $popover-border-radius 0; // make sure the arrow does not touch the popover's rounded corners &::before { right: 0; @@ -157,8 +157,7 @@ color: $popover-header-color; background-color: $popover-header-bg; border-bottom: $popover-border-width solid darken($popover-header-bg, 5%); - $offset-border-width: calc(#{$border-radius-lg} - #{$popover-border-width}); - @include border-top-radius($offset-border-width); + @include border-top-radius($popover-inner-border-radius); &:empty { display: none; diff --git a/vendor/twbs/bootstrap/scss/_print.scss b/vendor/twbs/bootstrap/scss/_print.scss index 61b60b980..8f73024a8 100644 --- a/vendor/twbs/bootstrap/scss/_print.scss +++ b/vendor/twbs/bootstrap/scss/_print.scss @@ -1,6 +1,6 @@ // stylelint-disable declaration-no-important, selector-no-qualifying-type -// Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css +// Source: https://github.com/h5bp/main.css/blob/master/src/_print.css // ========================================================================== // Print styles. @@ -57,7 +57,7 @@ // // Printing Tables: - // http://css-discuss.incutio.com/wiki/Printing_Tables + // https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables // thead { diff --git a/vendor/twbs/bootstrap/scss/_progress.scss b/vendor/twbs/bootstrap/scss/_progress.scss index ab9ea0ffb..1a037045a 100644 --- a/vendor/twbs/bootstrap/scss/_progress.scss +++ b/vendor/twbs/bootstrap/scss/_progress.scss @@ -10,6 +10,7 @@ display: flex; height: $progress-height; overflow: hidden; // force rounded corners by cropping it + line-height: 0; @include font-size($progress-font-size); background-color: $progress-bg; @include border-radius($progress-border-radius); @@ -20,6 +21,7 @@ display: flex; flex-direction: column; justify-content: center; + overflow: hidden; color: $progress-bar-color; text-align: center; white-space: nowrap; @@ -36,8 +38,10 @@ .progress-bar-animated { animation: progress-bar-stripes $progress-bar-animation-timing; - @media (prefers-reduced-motion: reduce) { - animation: none; + @if $enable-prefers-reduced-motion-media-query { + @media (prefers-reduced-motion: reduce) { + animation: none; + } } } } diff --git a/vendor/twbs/bootstrap/scss/_reboot.scss b/vendor/twbs/bootstrap/scss/_reboot.scss index c55d42e44..4444ff0f0 100644 --- a/vendor/twbs/bootstrap/scss/_reboot.scss +++ b/vendor/twbs/bootstrap/scss/_reboot.scss @@ -54,12 +54,16 @@ body { background-color: $body-bg; // 2 } -// Suppress the focus outline on elements that cannot be accessed via keyboard. -// This prevents an unwanted focus outline from appearing around elements that -// might still respond to pointer events. -// -// Credit: https://github.com/suitcss/base -[tabindex="-1"]:focus { +// 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; } @@ -184,30 +188,25 @@ a { text-decoration: $link-decoration; background-color: transparent; // Remove the gray background on active links in IE 10. - @include hover { + @include hover() { color: $link-hover-color; text-decoration: $link-hover-decoration; } } -// And undo these styles for placeholder links/named anchors (without href) -// which have not been made explicitly keyboard-focusable (without tabindex). +// And undo these styles for placeholder links/named anchors (without href). // 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]) { +a:not([href]):not([class]) { color: inherit; text-decoration: none; - @include hover-focus { + @include hover() { color: inherit; text-decoration: none; } - - &:focus { - outline: 0; - } } @@ -230,6 +229,9 @@ pre { margin-bottom: 1rem; // Don't allow content to break outside overflow: auto; + // Disable auto-hiding scrollbar in IE & legacy Edge to avoid overlap, + // making it impossible to interact with the content + -ms-overflow-style: scrollbar; } @@ -331,6 +333,13 @@ select { text-transform: none; // Remove the inheritance of text transform in Firefox } +// Set the cursor for non-`<button>` buttons +// +// Details at https://github.com/twbs/bootstrap/pull/30562 +[role="button"] { + cursor: pointer; +} + // Remove the inheritance of word-wrap in Safari. // // Details at https://github.com/twbs/bootstrap/issues/24990 @@ -377,18 +386,6 @@ input[type="checkbox"] { } -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. - // See https://bugs.webkit.org/show_bug.cgi?id=139848 - // and https://github.com/twbs/bootstrap/issues/11266 - -webkit-appearance: listbox; -} - textarea { overflow: auto; // Remove the default vertical scrollbar in IE. // Textareas should really only resize vertically so they don't break their (horizontal) containers. diff --git a/vendor/twbs/bootstrap/scss/_root.scss b/vendor/twbs/bootstrap/scss/_root.scss index ad550df3b..8110030c6 100644 --- a/vendor/twbs/bootstrap/scss/_root.scss +++ b/vendor/twbs/bootstrap/scss/_root.scss @@ -1,3 +1,4 @@ +// Do not forget to update getting-started/theming.md! :root { // Custom variable values only support SassScript inside `#{}`. @each $color, $value in $colors { diff --git a/vendor/twbs/bootstrap/scss/_spinners.scss b/vendor/twbs/bootstrap/scss/_spinners.scss index 364a5c1a6..27c9241a7 100644 --- a/vendor/twbs/bootstrap/scss/_spinners.scss +++ b/vendor/twbs/bootstrap/scss/_spinners.scss @@ -34,6 +34,7 @@ } 50% { opacity: 1; + transform: none; } } diff --git a/vendor/twbs/bootstrap/scss/_tables.scss b/vendor/twbs/bootstrap/scss/_tables.scss index b7ab3d506..5fd77a4eb 100644 --- a/vendor/twbs/bootstrap/scss/_tables.scss +++ b/vendor/twbs/bootstrap/scss/_tables.scss @@ -84,7 +84,7 @@ .table-hover { tbody tr { - @include hover { + @include hover() { color: $table-hover-color; background-color: $table-hover-bg; } @@ -142,14 +142,14 @@ } &.table-striped { - tbody tr:nth-of-type(odd) { + tbody tr:nth-of-type(#{$table-striped-order}) { background-color: $table-dark-accent-bg; } } &.table-hover { tbody tr { - @include hover { + @include hover() { color: $table-dark-hover-color; background-color: $table-dark-hover-bg; } diff --git a/vendor/twbs/bootstrap/scss/_toasts.scss b/vendor/twbs/bootstrap/scss/_toasts.scss index 6aa5352a3..f9ca8d91c 100644 --- a/vendor/twbs/bootstrap/scss/_toasts.scss +++ b/vendor/twbs/bootstrap/scss/_toasts.scss @@ -1,13 +1,14 @@ .toast { + // Prevents from shrinking in IE11, when in a flex container + // See https://github.com/twbs/bootstrap/issues/28341 + flex-basis: $toast-max-width; max-width: $toast-max-width; - overflow: hidden; // cheap rounded corners on nested items @include font-size($toast-font-size); color: $toast-color; background-color: $toast-background-color; background-clip: padding-box; border: $toast-border-width solid $toast-border-color; box-shadow: $toast-box-shadow; - backdrop-filter: blur(10px); opacity: 0; @include border-radius($toast-border-radius); @@ -37,6 +38,7 @@ background-color: $toast-header-background-color; background-clip: padding-box; border-bottom: $toast-border-width solid $toast-header-border-color; + @include border-top-radius(subtract($toast-border-radius, $toast-border-width)); } .toast-body { diff --git a/vendor/twbs/bootstrap/scss/_type.scss b/vendor/twbs/bootstrap/scss/_type.scss index f8ed09065..43dde7d0f 100644 --- a/vendor/twbs/bootstrap/scss/_type.scss +++ b/vendor/twbs/bootstrap/scss/_type.scss @@ -82,12 +82,12 @@ mark, // .list-unstyled { - @include list-unstyled; + @include list-unstyled(); } // Inline turns list items into inline-block .list-inline { - @include list-unstyled; + @include list-unstyled(); } .list-inline-item { display: inline-block; diff --git a/vendor/twbs/bootstrap/scss/_utilities.scss b/vendor/twbs/bootstrap/scss/_utilities.scss index a5de31ba6..10e31dd7e 100644 --- a/vendor/twbs/bootstrap/scss/_utilities.scss +++ b/vendor/twbs/bootstrap/scss/_utilities.scss @@ -6,12 +6,13 @@ @import "utilities/embed"; @import "utilities/flex"; @import "utilities/float"; +@import "utilities/interactions"; @import "utilities/overflow"; @import "utilities/position"; @import "utilities/screenreaders"; @import "utilities/shadows"; @import "utilities/sizing"; -@import "utilities/stretched-link"; @import "utilities/spacing"; +@import "utilities/stretched-link"; @import "utilities/text"; @import "utilities/visibility"; diff --git a/vendor/twbs/bootstrap/scss/_variables.scss b/vendor/twbs/bootstrap/scss/_variables.scss index d9e88df9a..3ff0c65b3 100644 --- a/vendor/twbs/bootstrap/scss/_variables.scss +++ b/vendor/twbs/bootstrap/scss/_variables.scss @@ -18,7 +18,6 @@ $gray-900: #212529 !default; $black: #000 !default; $grays: () !default; -// stylelint-disable-next-line scss/dollar-variable-default $grays: map-merge( ( "100": $gray-100, @@ -46,7 +45,6 @@ $teal: #20c997 !default; $cyan: #17a2b8 !default; $colors: () !default; -// stylelint-disable-next-line scss/dollar-variable-default $colors: map-merge( ( "blue": $blue, @@ -76,7 +74,6 @@ $light: $gray-100 !default; $dark: $gray-800 !default; $theme-colors: () !default; -// stylelint-disable-next-line scss/dollar-variable-default $theme-colors: map-merge( ( "primary": $primary, @@ -101,6 +98,15 @@ $yiq-contrasted-threshold: 150 !default; $yiq-text-dark: $gray-900 !default; $yiq-text-light: $white !default; +// Characters which are escaped by the escape-svg function +$escaped-characters: ( + ("<", "%3c"), + (">", "%3e"), + ("#", "%23"), + ("(", "%28"), + (")", "%29"), +) !default; + // Options // @@ -129,7 +135,6 @@ $enable-deprecation-messages: true !default; $spacer: 1rem !default; $spacers: () !default; -// stylelint-disable-next-line scss/dollar-variable-default $spacers: map-merge( ( 0: 0, @@ -144,7 +149,6 @@ $spacers: map-merge( // This variable affects the `.h-*` and `.w-*` classes. $sizes: () !default; -// stylelint-disable-next-line scss/dollar-variable-default $sizes: map-merge( ( 25: 25%, @@ -220,6 +224,7 @@ $container-max-widths: ( $grid-columns: 12 !default; $grid-gutter-width: 30px !default; +$grid-row-columns: 6 !default; // Components @@ -254,7 +259,6 @@ $transition-fade: opacity .15s linear !default; $transition-collapse: height .35s ease !default; $embed-responsive-aspect-ratios: () !default; -// stylelint-disable-next-line scss/dollar-variable-default $embed-responsive-aspect-ratios: join( ( (21 9), @@ -366,7 +370,6 @@ $table-dark-accent-bg: rgba($white, .05) !default; $table-dark-hover-color: $table-dark-color !default; $table-dark-hover-bg: rgba($white, .075) !default; $table-dark-border-color: lighten($table-dark-bg, 7.5%) !default; -$table-dark-color: $white !default; $table-striped-order: odd !default; @@ -412,6 +415,7 @@ $btn-padding-x: $input-btn-padding-x !default; $btn-font-family: $input-btn-font-family !default; $btn-font-size: $input-btn-font-size !default; $btn-line-height: $input-btn-line-height !default; +$btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping $btn-padding-y-sm: $input-btn-padding-y-sm !default; $btn-padding-x-sm: $input-btn-padding-x-sm !default; @@ -488,13 +492,13 @@ $input-plaintext-color: $body-color !default; $input-height-border: $input-border-width * 2 !default; -$input-height-inner: calc(#{$input-line-height * 1em} + #{$input-padding-y * 2}) !default; -$input-height-inner-half: calc(#{$input-line-height * .5em} + #{$input-padding-y}) !default; -$input-height-inner-quarter: calc(#{$input-line-height * .25em} + #{$input-padding-y / 2}) !default; +$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default; +$input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default; +$input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y / 2) !default; -$input-height: calc(#{$input-line-height * 1em} + #{$input-padding-y * 2} + #{$input-height-border}) !default; -$input-height-sm: calc(#{$input-line-height-sm * 1em} + #{$input-btn-padding-y-sm * 2} + #{$input-height-border}) !default; -$input-height-lg: calc(#{$input-line-height-lg * 1em} + #{$input-btn-padding-y-lg * 2} + #{$input-height-border}) !default; +$input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default; +$input-height-sm: add($input-line-height-sm * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default; +$input-height-lg: add($input-line-height-lg * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default; $input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; @@ -518,6 +522,7 @@ $custom-forms-transition: background-color .15s ease-in-out, borde $custom-control-gutter: .5rem !default; $custom-control-spacer-x: 1rem !default; +$custom-control-cursor: null !default; $custom-control-indicator-size: 1rem !default; $custom-control-indicator-bg: $input-bg !default; @@ -527,13 +532,15 @@ $custom-control-indicator-box-shadow: $input-box-shadow !default; $custom-control-indicator-border-color: $gray-500 !default; $custom-control-indicator-border-width: $input-border-width !default; +$custom-control-label-color: null !default; + $custom-control-indicator-disabled-bg: $input-disabled-bg !default; $custom-control-label-disabled-color: $gray-600 !default; $custom-control-indicator-checked-color: $component-active-color !default; $custom-control-indicator-checked-bg: $component-active-bg !default; $custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default; -$custom-control-indicator-checked-box-shadow: none !default; +$custom-control-indicator-checked-box-shadow: null !default; $custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default; $custom-control-indicator-focus-box-shadow: $input-focus-box-shadow !default; @@ -541,24 +548,24 @@ $custom-control-indicator-focus-border-color: $input-focus-border-color !defau $custom-control-indicator-active-color: $component-active-color !default; $custom-control-indicator-active-bg: lighten($component-active-bg, 35%) !default; -$custom-control-indicator-active-box-shadow: none !default; +$custom-control-indicator-active-box-shadow: null !default; $custom-control-indicator-active-border-color: $custom-control-indicator-active-bg !default; $custom-checkbox-indicator-border-radius: $border-radius !default; -$custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3e%3c/svg%3e"), "#", "%23") !default; +$custom-checkbox-indicator-icon-checked: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'><path fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/></svg>") !default; $custom-checkbox-indicator-indeterminate-bg: $component-active-bg !default; $custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default; -$custom-checkbox-indicator-icon-indeterminate: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3e%3cpath stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/%3e%3c/svg%3e"), "#", "%23") !default; -$custom-checkbox-indicator-indeterminate-box-shadow: none !default; +$custom-checkbox-indicator-icon-indeterminate: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'><path stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/></svg>") !default; +$custom-checkbox-indicator-indeterminate-box-shadow: null !default; $custom-checkbox-indicator-indeterminate-border-color: $custom-checkbox-indicator-indeterminate-bg !default; $custom-radio-indicator-border-radius: 50% !default; -$custom-radio-indicator-icon-checked: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3e%3c/svg%3e"), "#", "%23") !default; +$custom-radio-indicator-icon-checked: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'><circle r='3' fill='#{$custom-control-indicator-checked-color}'/></svg>") !default; $custom-switch-width: $custom-control-indicator-size * 1.75 !default; $custom-switch-indicator-border-radius: $custom-control-indicator-size / 2 !default; -$custom-switch-indicator-size: calc(#{$custom-control-indicator-size} - #{$custom-control-indicator-border-width * 4}) !default; +$custom-switch-indicator-size: subtract($custom-control-indicator-size, $custom-control-indicator-border-width * 4) !default; $custom-select-padding-y: $input-padding-y !default; $custom-select-padding-x: $input-padding-x !default; @@ -574,10 +581,10 @@ $custom-select-bg: $input-bg !default; $custom-select-disabled-bg: $gray-200 !default; $custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions $custom-select-indicator-color: $gray-800 !default; -$custom-select-indicator: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e"), "#", "%23") !default; -$custom-select-background: $custom-select-indicator no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon) +$custom-select-indicator: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'><path fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>") !default; +$custom-select-background: escape-svg($custom-select-indicator) no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon) -$custom-select-feedback-icon-padding-right: calc((1em + #{2 * $custom-select-padding-y}) * 3 / 4 + #{$custom-select-padding-x + $custom-select-indicator-padding}) !default; +$custom-select-feedback-icon-padding-right: add(1em * .75, (2 * $custom-select-padding-y * .75) + $custom-select-padding-x + $custom-select-indicator-padding) !default; $custom-select-feedback-icon-position: center right ($custom-select-padding-x + $custom-select-indicator-padding) !default; $custom-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default; @@ -650,12 +657,11 @@ $form-feedback-valid-color: theme-color("success") !default; $form-feedback-invalid-color: theme-color("danger") !default; $form-feedback-icon-valid-color: $form-feedback-valid-color !default; -$form-feedback-icon-valid: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e"), "#", "%23") !default; +$form-feedback-icon-valid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'><path fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/></svg>") !default; $form-feedback-icon-invalid-color: $form-feedback-invalid-color !default; -$form-feedback-icon-invalid: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$form-feedback-icon-invalid-color}' viewBox='-2 -2 7 7'%3e%3cpath stroke='#{$form-feedback-icon-invalid-color}' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E"), "#", "%23") !default; +$form-feedback-icon-invalid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='#{$form-feedback-icon-invalid-color}' viewBox='0 0 12 12'><circle cx='6' cy='6' r='4.5'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='#{$form-feedback-icon-invalid-color}' stroke='none'/></svg>") !default; $form-validation-states: () !default; -// stylelint-disable-next-line scss/dollar-variable-default $form-validation-states: map-merge( ( "valid": ( @@ -728,14 +734,14 @@ $navbar-dark-color: rgba($white, .5) !default; $navbar-dark-hover-color: rgba($white, .75) !default; $navbar-dark-active-color: $white !default; $navbar-dark-disabled-color: rgba($white, .25) !default; -$navbar-dark-toggler-icon-bg: str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default; +$navbar-dark-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default; $navbar-dark-toggler-border-color: rgba($white, .1) !default; $navbar-light-color: rgba($black, .5) !default; $navbar-light-hover-color: rgba($black, .7) !default; $navbar-light-active-color: rgba($black, .9) !default; $navbar-light-disabled-color: rgba($black, .3) !default; -$navbar-light-toggler-icon-bg: str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$navbar-light-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default; +$navbar-light-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><path stroke='#{$navbar-light-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default; $navbar-light-toggler-border-color: rgba($black, .1) !default; $navbar-light-brand-color: $navbar-light-active-color !default; @@ -757,7 +763,7 @@ $dropdown-bg: $white !default; $dropdown-border-color: rgba($black, .15) !default; $dropdown-border-radius: $border-radius !default; $dropdown-border-width: $border-width !default; -$dropdown-inner-border-radius: calc(#{$dropdown-border-radius} - #{$dropdown-border-width}) !default; +$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default; $dropdown-divider-bg: $gray-200 !default; $dropdown-divider-margin-y: $nav-divider-margin-y !default; $dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default; @@ -775,6 +781,7 @@ $dropdown-item-padding-y: .25rem !default; $dropdown-item-padding-x: 1.5rem !default; $dropdown-header-color: $gray-600 !default; +$dropdown-header-padding: $dropdown-padding-y $dropdown-item-padding-x !default; // Pagination @@ -822,9 +829,10 @@ $card-spacer-x: 1.25rem !default; $card-border-width: $border-width !default; $card-border-radius: $border-radius !default; $card-border-color: rgba($black, .125) !default; -$card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default; +$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default; $card-cap-bg: rgba($black, .03) !default; $card-cap-color: null !default; +$card-height: null !default; $card-color: null !default; $card-bg: $white !default; @@ -871,6 +879,7 @@ $popover-max-width: 276px !default; $popover-border-width: $border-width !default; $popover-border-color: rgba($black, .2) !default; $popover-border-radius: $border-radius-lg !default; +$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default; $popover-box-shadow: 0 .25rem .5rem rgba($black, .2) !default; $popover-header-bg: darken($popover-bg, 3%) !default; @@ -929,6 +938,9 @@ $badge-pill-border-radius: 10rem !default; // Padding applied to the modal body $modal-inner-padding: 1rem !default; +// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding +$modal-footer-margin-between: .5rem !default; + $modal-dialog-margin: .5rem !default; $modal-dialog-margin-y-sm-up: 1.75rem !default; @@ -939,6 +951,7 @@ $modal-content-bg: $white !default; $modal-content-border-color: rgba($black, .2) !default; $modal-content-border-width: $border-width !default; $modal-content-border-radius: $border-radius-lg !default; +$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default; $modal-content-box-shadow-xs: 0 .25rem .5rem rgba($black, .5) !default; $modal-content-box-shadow-sm-up: 0 .5rem 1rem rgba($black, .5) !default; @@ -960,6 +973,7 @@ $modal-sm: 300px !default; $modal-fade-transform: translate(0, -50px) !default; $modal-show-transform: none !default; $modal-transition: transform .3s ease-out !default; +$modal-scale-transform: scale(1.02) !default; // Alerts @@ -1035,6 +1049,8 @@ $figure-caption-color: $gray-600 !default; // Breadcrumbs +$breadcrumb-font-size: null !default; + $breadcrumb-padding-y: .75rem !default; $breadcrumb-padding-x: 1rem !default; $breadcrumb-item-padding: .5rem !default; @@ -1069,8 +1085,8 @@ $carousel-caption-color: $white !default; $carousel-control-icon-width: 20px !default; -$carousel-control-prev-icon-bg: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3e%3c/svg%3e"), "#", "%23") !default; -$carousel-control-next-icon-bg: str-replace(url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3e%3c/svg%3e"), "#", "%23") !default; +$carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/></svg>") !default; +$carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/></svg>") !default; $carousel-transition-duration: .6s !default; $carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`) @@ -1115,6 +1131,7 @@ $pre-scrollable-max-height: 340px !default; $displays: none, inline, inline-block, block, table, table-row, table-cell, flex, inline-flex !default; $overflows: auto, hidden !default; $positions: static, relative, absolute, fixed, sticky !default; +$user-selects: all, auto, none !default; // Printing diff --git a/vendor/twbs/bootstrap/scss/bootstrap-grid.scss b/vendor/twbs/bootstrap/scss/bootstrap-grid.scss index d5f92a16a..06c9e2c4b 100644 --- a/vendor/twbs/bootstrap/scss/bootstrap-grid.scss +++ b/vendor/twbs/bootstrap/scss/bootstrap-grid.scss @@ -1,8 +1,8 @@ /*! - * Bootstrap Grid v4.3.1 (https://getbootstrap.com/) - * Copyright 2011-2019 The Bootstrap Authors - * Copyright 2011-2019 Twitter, Inc. - * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * Bootstrap Grid v4.5.2 (https://getbootstrap.com/) + * Copyright 2011-2020 The Bootstrap Authors + * Copyright 2011-2020 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) */ html { diff --git a/vendor/twbs/bootstrap/scss/bootstrap-reboot.scss b/vendor/twbs/bootstrap/scss/bootstrap-reboot.scss index 2983f3f6d..d922d75fb 100644 --- a/vendor/twbs/bootstrap/scss/bootstrap-reboot.scss +++ b/vendor/twbs/bootstrap/scss/bootstrap-reboot.scss @@ -1,8 +1,8 @@ /*! - * Bootstrap Reboot v4.3.1 (https://getbootstrap.com/) - * Copyright 2011-2019 The Bootstrap Authors - * Copyright 2011-2019 Twitter, Inc. - * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * Bootstrap Reboot v4.5.2 (https://getbootstrap.com/) + * Copyright 2011-2020 The Bootstrap Authors + * Copyright 2011-2020 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md) */ diff --git a/vendor/twbs/bootstrap/scss/bootstrap.scss b/vendor/twbs/bootstrap/scss/bootstrap.scss index 9f15c2a8b..4d6521c0b 100644 --- a/vendor/twbs/bootstrap/scss/bootstrap.scss +++ b/vendor/twbs/bootstrap/scss/bootstrap.scss @@ -1,8 +1,8 @@ /*! - * Bootstrap v4.3.1 (https://getbootstrap.com/) - * Copyright 2011-2019 The Bootstrap Authors - * Copyright 2011-2019 Twitter, Inc. - * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * Bootstrap v4.5.2 (https://getbootstrap.com/) + * Copyright 2011-2020 The Bootstrap Authors + * Copyright 2011-2020 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) */ @import "functions"; diff --git a/vendor/twbs/bootstrap/scss/mixins/_background-variant.scss b/vendor/twbs/bootstrap/scss/mixins/_background-variant.scss index 494439d2b..80580189a 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_background-variant.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_background-variant.scss @@ -2,20 +2,22 @@ // Contextual backgrounds -@mixin bg-variant($parent, $color) { +@mixin bg-variant($parent, $color, $ignore-warning: false) { #{$parent} { background-color: $color !important; } a#{$parent}, button#{$parent} { - @include hover-focus { + @include hover-focus() { background-color: darken($color, 10%) !important; } } + @include deprecate("The `bg-variant` mixin", "v4.4.0", "v5", $ignore-warning); } -@mixin bg-gradient-variant($parent, $color) { +@mixin bg-gradient-variant($parent, $color, $ignore-warning: false) { #{$parent} { background: $color linear-gradient(180deg, mix($body-bg, $color, 15%), $color) repeat-x !important; } + @include deprecate("The `bg-gradient-variant` mixin", "v4.5.0", "v5", $ignore-warning); } diff --git a/vendor/twbs/bootstrap/scss/mixins/_badge.scss b/vendor/twbs/bootstrap/scss/mixins/_badge.scss index 64b29cb57..f1c499141 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_badge.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_badge.scss @@ -3,7 +3,7 @@ background-color: $bg; @at-root a#{&} { - @include hover-focus { + @include hover-focus() { color: color-yiq($bg); background-color: darken($bg, 10%); } diff --git a/vendor/twbs/bootstrap/scss/mixins/_border-radius.scss b/vendor/twbs/bootstrap/scss/mixins/_border-radius.scss index 88aeb37d8..aee9bf3d3 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_border-radius.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_border-radius.scss @@ -1,9 +1,22 @@ // stylelint-disable property-blacklist // Single side border-radius +// Helper function to replace negative values with 0 +@function valid-radius($radius) { + $return: (); + @each $value in $radius { + @if type-of($value) == number { + $return: append($return, max($value, 0)); + } @else { + $return: append($return, $value); + } + } + @return $return; +} + @mixin border-radius($radius: $border-radius, $fallback-border-radius: false) { @if $enable-rounded { - border-radius: $radius; + border-radius: valid-radius($radius); } @else if $fallback-border-radius != false { border-radius: $fallback-border-radius; @@ -12,52 +25,52 @@ @mixin border-top-radius($radius) { @if $enable-rounded { - border-top-left-radius: $radius; - border-top-right-radius: $radius; + border-top-left-radius: valid-radius($radius); + border-top-right-radius: valid-radius($radius); } } @mixin border-right-radius($radius) { @if $enable-rounded { - border-top-right-radius: $radius; - border-bottom-right-radius: $radius; + border-top-right-radius: valid-radius($radius); + border-bottom-right-radius: valid-radius($radius); } } @mixin border-bottom-radius($radius) { @if $enable-rounded { - border-bottom-right-radius: $radius; - border-bottom-left-radius: $radius; + border-bottom-right-radius: valid-radius($radius); + border-bottom-left-radius: valid-radius($radius); } } @mixin border-left-radius($radius) { @if $enable-rounded { - border-top-left-radius: $radius; - border-bottom-left-radius: $radius; + border-top-left-radius: valid-radius($radius); + border-bottom-left-radius: valid-radius($radius); } } @mixin border-top-left-radius($radius) { @if $enable-rounded { - border-top-left-radius: $radius; + border-top-left-radius: valid-radius($radius); } } @mixin border-top-right-radius($radius) { @if $enable-rounded { - border-top-right-radius: $radius; + border-top-right-radius: valid-radius($radius); } } @mixin border-bottom-right-radius($radius) { @if $enable-rounded { - border-bottom-right-radius: $radius; + border-bottom-right-radius: valid-radius($radius); } } @mixin border-bottom-left-radius($radius) { @if $enable-rounded { - border-bottom-left-radius: $radius; + border-bottom-left-radius: valid-radius($radius); } } diff --git a/vendor/twbs/bootstrap/scss/mixins/_buttons.scss b/vendor/twbs/bootstrap/scss/mixins/_buttons.scss index eee903f83..d6235aa27 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_buttons.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_buttons.scss @@ -9,7 +9,7 @@ border-color: $border; @include box-shadow($btn-box-shadow); - @include hover { + @include hover() { color: color-yiq($hover-background); @include gradient-bg($hover-background); border-color: $hover-border; @@ -17,10 +17,13 @@ &:focus, &.focus { - // Avoid using mixin so we can pass custom focus shadow properly + color: color-yiq($hover-background); + @include gradient-bg($hover-background); + border-color: $hover-border; @if $enable-shadows { - box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5); + @include box-shadow($btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5)); } @else { + // Avoid using mixin so we can pass custom focus shadow properly box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5); } } @@ -48,10 +51,10 @@ border-color: $active-border; &:focus { - // Avoid using mixin so we can pass custom focus shadow properly @if $enable-shadows and $btn-active-box-shadow != none { - box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5); + @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5)); } @else { + // Avoid using mixin so we can pass custom focus shadow properly box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5); } } @@ -62,7 +65,7 @@ color: $color; border-color: $color; - @include hover { + @include hover() { color: $color-hover; background-color: $active-background; border-color: $active-border; @@ -87,10 +90,10 @@ border-color: $active-border; &:focus { - // Avoid using mixin so we can pass custom focus shadow properly @if $enable-shadows and $btn-active-box-shadow != none { - box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, .5); + @include box-shadow($btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, .5)); } @else { + // Avoid using mixin so we can pass custom focus shadow properly box-shadow: 0 0 0 $btn-focus-width rgba($color, .5); } } diff --git a/vendor/twbs/bootstrap/scss/mixins/_caret.scss b/vendor/twbs/bootstrap/scss/mixins/_caret.scss index 8ecef65b4..27466495b 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_caret.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_caret.scss @@ -1,25 +1,25 @@ -@mixin caret-down { +@mixin caret-down() { border-top: $caret-width solid; border-right: $caret-width solid transparent; border-bottom: 0; border-left: $caret-width solid transparent; } -@mixin caret-up { +@mixin caret-up() { border-top: 0; border-right: $caret-width solid transparent; border-bottom: $caret-width solid; border-left: $caret-width solid transparent; } -@mixin caret-right { +@mixin caret-right() { border-top: $caret-width solid transparent; border-right: 0; border-bottom: $caret-width solid transparent; border-left: $caret-width solid; } -@mixin caret-left { +@mixin caret-left() { border-top: $caret-width solid transparent; border-right: $caret-width solid; border-bottom: $caret-width solid transparent; @@ -33,11 +33,11 @@ vertical-align: $caret-vertical-align; content: ""; @if $direction == down { - @include caret-down; + @include caret-down(); } @else if $direction == up { - @include caret-up; + @include caret-up(); } @else if $direction == right { - @include caret-right; + @include caret-right(); } } @@ -51,7 +51,7 @@ margin-right: $caret-spacing; vertical-align: $caret-vertical-align; content: ""; - @include caret-left; + @include caret-left(); } } diff --git a/vendor/twbs/bootstrap/scss/mixins/_float.scss b/vendor/twbs/bootstrap/scss/mixins/_float.scss index adff88e79..6b376a258 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_float.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_float.scss @@ -1,14 +1,14 @@ // stylelint-disable declaration-no-important -@mixin float-left { +@mixin float-left() { float: left !important; @include deprecate("The `float-left` mixin", "v4.3.0", "v5"); } -@mixin float-right { +@mixin float-right() { float: right !important; @include deprecate("The `float-right` mixin", "v4.3.0", "v5"); } -@mixin float-none { +@mixin float-none() { float: none !important; @include deprecate("The `float-none` mixin", "v4.3.0", "v5"); } diff --git a/vendor/twbs/bootstrap/scss/mixins/_forms.scss b/vendor/twbs/bootstrap/scss/mixins/_forms.scss index ea8a91a02..39b52f3ca 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_forms.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_forms.scss @@ -10,21 +10,36 @@ // // Example usage: change the default blue border and shadow to white for better // contrast against a dark gray background. -@mixin form-control-focus() { +@mixin form-control-focus($ignore-warning: false) { &:focus { color: $input-focus-color; background-color: $input-focus-bg; border-color: $input-focus-border-color; outline: 0; - // Avoid using mixin so we can pass custom focus shadow properly @if $enable-shadows { - box-shadow: $input-box-shadow, $input-focus-box-shadow; + @include box-shadow($input-box-shadow, $input-focus-box-shadow); } @else { + // Avoid using mixin so we can pass custom focus shadow properly box-shadow: $input-focus-box-shadow; } } + @include deprecate("The `form-control-focus()` mixin", "v4.4.0", "v5", $ignore-warning); } +// This mixin uses an `if()` technique to be compatible with Dart Sass +// See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details +@mixin form-validation-state-selector($state) { + @if ($state == "valid" or $state == "invalid") { + .was-validated #{if(&, "&", "")}:#{$state}, + #{if(&, "&", "")}.is-#{$state} { + @content; + } + } @else { + #{if(&, "&", "")}.is-#{$state} { + @content; + } + } +} @mixin form-validation-state($state, $color, $icon) { .#{$state}-feedback { @@ -38,6 +53,7 @@ .#{$state}-tooltip { position: absolute; top: 100%; + left: 0; z-index: 5; display: none; max-width: 100%; // Contain to parent when possible @@ -50,16 +66,22 @@ @include border-radius($form-feedback-tooltip-border-radius); } + @include form-validation-state-selector($state) { + ~ .#{$state}-feedback, + ~ .#{$state}-tooltip { + display: block; + } + } + .form-control { - .was-validated &:#{$state}, - &.is-#{$state} { + @include form-validation-state-selector($state) { border-color: $color; @if $enable-validation-icons { padding-right: $input-height-inner; - background-image: $icon; + background-image: escape-svg($icon); background-repeat: no-repeat; - background-position: center right $input-height-inner-quarter; + background-position: right $input-height-inner-quarter center; background-size: $input-height-inner-half $input-height-inner-half; } @@ -67,18 +89,12 @@ border-color: $color; box-shadow: 0 0 0 $input-focus-width rgba($color, .25); } - - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } } } // stylelint-disable-next-line selector-no-qualifying-type textarea.form-control { - .was-validated &:#{$state}, - &.is-#{$state} { + @include form-validation-state-selector($state) { @if $enable-validation-icons { padding-right: $input-height-inner; background-position: top $input-height-inner-quarter right $input-height-inner-quarter; @@ -87,41 +103,23 @@ } .custom-select { - .was-validated &:#{$state}, - &.is-#{$state} { + @include form-validation-state-selector($state) { border-color: $color; @if $enable-validation-icons { padding-right: $custom-select-feedback-icon-padding-right; - background: $custom-select-background, $icon $custom-select-bg no-repeat $custom-select-feedback-icon-position / $custom-select-feedback-icon-size; + background: $custom-select-background, escape-svg($icon) $custom-select-bg no-repeat $custom-select-feedback-icon-position / $custom-select-feedback-icon-size; } &:focus { border-color: $color; box-shadow: 0 0 0 $input-focus-width rgba($color, .25); } - - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } - } - } - - - .form-control-file { - .was-validated &:#{$state}, - &.is-#{$state} { - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } } } .form-check-input { - .was-validated &:#{$state}, - &.is-#{$state} { + @include form-validation-state-selector($state) { ~ .form-check-label { color: $color; } @@ -134,8 +132,7 @@ } .custom-control-input { - .was-validated &:#{$state}, - &.is-#{$state} { + @include form-validation-state-selector($state) { ~ .custom-control-label { color: $color; @@ -144,11 +141,6 @@ } } - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } - &:checked { ~ .custom-control-label::before { border-color: lighten($color, 10%); @@ -170,17 +162,11 @@ // custom file .custom-file-input { - .was-validated &:#{$state}, - &.is-#{$state} { + @include form-validation-state-selector($state) { ~ .custom-file-label { border-color: $color; } - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } - &:focus { ~ .custom-file-label { border-color: $color; diff --git a/vendor/twbs/bootstrap/scss/mixins/_grid-framework.scss b/vendor/twbs/bootstrap/scss/mixins/_grid-framework.scss index 649c28bf7..6fc8e8561 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_grid-framework.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_grid-framework.scss @@ -15,12 +15,15 @@ @each $breakpoint in map-keys($breakpoints) { $infix: breakpoint-infix($breakpoint, $breakpoints); - // Allow columns to stretch full width below their breakpoints - @for $i from 1 through $columns { - .col#{$infix}-#{$i} { - @extend %grid-column; + @if $columns > 0 { + // Allow columns to stretch full width below their breakpoints + @for $i from 1 through $columns { + .col#{$infix}-#{$i} { + @extend %grid-column; + } } } + .col#{$infix}, .col#{$infix}-auto { @extend %grid-column; @@ -33,15 +36,24 @@ flex-grow: 1; max-width: 100%; } + + @if $grid-row-columns > 0 { + @for $i from 1 through $grid-row-columns { + .row-cols#{$infix}-#{$i} { + @include row-cols($i); + } + } + } + .col#{$infix}-auto { - flex: 0 0 auto; - width: auto; - max-width: 100%; // Reset earlier grid tiers + @include make-col-auto(); } - @for $i from 1 through $columns { - .col#{$infix}-#{$i} { - @include make-col($i, $columns); + @if $columns > 0 { + @for $i from 1 through $columns { + .col#{$infix}-#{$i} { + @include make-col($i, $columns); + } } } @@ -53,11 +65,13 @@ .order#{$infix}-#{$i} { order: $i; } } - // `$columns - 1` because offsetting by the width of an entire row isn't possible - @for $i from 0 through ($columns - 1) { - @if not ($infix == "" and $i == 0) { // Avoid emitting useless .offset-0 - .offset#{$infix}-#{$i} { - @include make-col-offset($i, $columns); + @if $columns > 0 { + // `$columns - 1` because offsetting by the width of an entire row isn't possible + @for $i from 0 through ($columns - 1) { + @if not ($infix == "" and $i == 0) { // Avoid emitting useless .offset-0 + .offset#{$infix}-#{$i} { + @include make-col-offset($i, $columns); + } } } } diff --git a/vendor/twbs/bootstrap/scss/mixins/_grid.scss b/vendor/twbs/bootstrap/scss/mixins/_grid.scss index 924eb0cfc..b72d150e4 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_grid.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_grid.scss @@ -10,6 +10,12 @@ margin-left: auto; } +@mixin make-row($gutter: $grid-gutter-width) { + display: flex; + flex-wrap: wrap; + margin-right: -$gutter / 2; + margin-left: -$gutter / 2; +} // For each breakpoint, define the maximum width of the container in a media query @mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) { @@ -18,13 +24,7 @@ max-width: $container-max-width; } } -} - -@mixin make-row($gutter: $grid-gutter-width) { - display: flex; - flex-wrap: wrap; - margin-right: -$gutter / 2; - margin-left: -$gutter / 2; + @include deprecate("The `make-container-max-widths` mixin", "v4.5.2", "v5"); } @mixin make-col-ready($gutter: $grid-gutter-width) { @@ -45,7 +45,25 @@ max-width: percentage($size / $columns); } +@mixin make-col-auto() { + flex: 0 0 auto; + width: auto; + max-width: 100%; // Reset earlier grid tiers +} + @mixin make-col-offset($size, $columns: $grid-columns) { $num: $size / $columns; margin-left: if($num == 0, 0, percentage($num)); } + +// Row columns +// +// Specify on a parent element(e.g., .row) to force immediate children into NN +// numberof columns. Supports wrapping to new lines, but does not do a Masonry +// style grid. +@mixin row-cols($count) { + & > * { + flex: 0 0 100% / $count; + max-width: 100% / $count; + } +} diff --git a/vendor/twbs/bootstrap/scss/mixins/_hover.scss b/vendor/twbs/bootstrap/scss/mixins/_hover.scss index 192f847e1..409f8244e 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_hover.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_hover.scss @@ -9,18 +9,18 @@ // // Issue: https://github.com/twbs/bootstrap/issues/25195 -@mixin hover { +@mixin hover() { &:hover { @content; } } -@mixin hover-focus { +@mixin hover-focus() { &:hover, &:focus { @content; } } -@mixin plain-hover-focus { +@mixin plain-hover-focus() { &, &:hover, &:focus { @@ -28,7 +28,7 @@ } } -@mixin hover-focus-active { +@mixin hover-focus-active() { &:hover, &:focus, &:active { diff --git a/vendor/twbs/bootstrap/scss/mixins/_image.scss b/vendor/twbs/bootstrap/scss/mixins/_image.scss index a76a6082b..c971e038b 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_image.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_image.scss @@ -7,7 +7,7 @@ // // Keep images from scaling beyond the width of their parents. -@mixin img-fluid { +@mixin img-fluid() { // Part 1: Set a maximum relative to the parent max-width: 100%; // Part 2: Override the height to auto, otherwise images will be stretched diff --git a/vendor/twbs/bootstrap/scss/mixins/_list-group.scss b/vendor/twbs/bootstrap/scss/mixins/_list-group.scss index cd47a4e9f..0da353156 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_list-group.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_list-group.scss @@ -6,7 +6,7 @@ background-color: $background; &.list-group-item-action { - @include hover-focus { + @include hover-focus() { color: $color; background-color: darken($background, 5%); } diff --git a/vendor/twbs/bootstrap/scss/mixins/_lists.scss b/vendor/twbs/bootstrap/scss/mixins/_lists.scss index 251856266..251cb0733 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_lists.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_lists.scss @@ -1,7 +1,7 @@ // Lists // Unstyled keeps list items block level, just removes default browser padding and list-style -@mixin list-unstyled { +@mixin list-unstyled() { padding-left: 0; list-style: none; } diff --git a/vendor/twbs/bootstrap/scss/mixins/_nav-divider.scss b/vendor/twbs/bootstrap/scss/mixins/_nav-divider.scss index 4fb37b622..3e0cceafe 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_nav-divider.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_nav-divider.scss @@ -2,9 +2,10 @@ // // Dividers (basically an hr) within dropdowns and nav lists -@mixin nav-divider($color: $nav-divider-color, $margin-y: $nav-divider-margin-y) { +@mixin nav-divider($color: $nav-divider-color, $margin-y: $nav-divider-margin-y, $ignore-warning: false) { height: 0; margin: $margin-y 0; overflow: hidden; border-top: 1px solid $color; + @include deprecate("The `nav-divider()` mixin", "v4.4.0", "v5", $ignore-warning); } diff --git a/vendor/twbs/bootstrap/scss/mixins/_reset-text.scss b/vendor/twbs/bootstrap/scss/mixins/_reset-text.scss index bfa9f6e9a..15b4407a0 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_reset-text.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_reset-text.scss @@ -1,4 +1,4 @@ -@mixin reset-text { +@mixin reset-text() { font-family: $font-family-base; // We deliberately do NOT reset font-size or word-wrap. font-style: normal; diff --git a/vendor/twbs/bootstrap/scss/mixins/_screen-reader.scss b/vendor/twbs/bootstrap/scss/mixins/_screen-reader.scss index 812591bc5..21230390e 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_screen-reader.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_screen-reader.scss @@ -3,11 +3,12 @@ // See: https://a11yproject.com/posts/how-to-hide-content/ // See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/ -@mixin sr-only { +@mixin sr-only() { position: absolute; width: 1px; height: 1px; padding: 0; + margin: -1px; // Fix for https://github.com/twbs/bootstrap/issues/25686 overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; @@ -20,7 +21,7 @@ // // Credit: HTML5 Boilerplate -@mixin sr-only-focusable { +@mixin sr-only-focusable() { &:active, &:focus { position: static; diff --git a/vendor/twbs/bootstrap/scss/mixins/_table-row.scss b/vendor/twbs/bootstrap/scss/mixins/_table-row.scss index f8d61869a..1ccde6b6c 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_table-row.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_table-row.scss @@ -26,7 +26,7 @@ $hover-background: darken($background, 5%); .table-#{$state} { - @include hover { + @include hover() { background-color: $hover-background; > td, diff --git a/vendor/twbs/bootstrap/scss/mixins/_text-emphasis.scss b/vendor/twbs/bootstrap/scss/mixins/_text-emphasis.scss index 155d6ca8c..5eb8a5515 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_text-emphasis.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_text-emphasis.scss @@ -2,15 +2,16 @@ // Typography -@mixin text-emphasis-variant($parent, $color) { +@mixin text-emphasis-variant($parent, $color, $ignore-warning: false) { #{$parent} { color: $color !important; } @if $emphasized-link-hover-darken-percentage != 0 { a#{$parent} { - @include hover-focus { + @include hover-focus() { color: darken($color, $emphasized-link-hover-darken-percentage) !important; } } } + @include deprecate("`text-emphasis-variant()`", "v4.4.0", "v5", $ignore-warning); } diff --git a/vendor/twbs/bootstrap/scss/mixins/_transition.scss b/vendor/twbs/bootstrap/scss/mixins/_transition.scss index 8ce35a6b8..54553deb9 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_transition.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_transition.scss @@ -1,16 +1,26 @@ // stylelint-disable property-blacklist @mixin transition($transition...) { + @if length($transition) == 0 { + $transition: $transition-base; + } + + @if length($transition) > 1 { + @each $value in $transition { + @if $value == null or $value == none { + @warn "The keyword 'none' or 'null' must be used as a single argument."; + } + } + } + @if $enable-transitions { - @if length($transition) == 0 { - transition: $transition-base; - } @else { + @if nth($transition, 1) != null { transition: $transition; } - } - @if $enable-prefers-reduced-motion-media-query { - @media (prefers-reduced-motion: reduce) { - transition: none; + @if $enable-prefers-reduced-motion-media-query and nth($transition, 1) != null and nth($transition, 1) != none { + @media (prefers-reduced-motion: reduce) { + transition: none; + } } } } diff --git a/vendor/twbs/bootstrap/scss/utilities/_background.scss b/vendor/twbs/bootstrap/scss/utilities/_background.scss index 1f18b2f3f..3accbc4fd 100644 --- a/vendor/twbs/bootstrap/scss/utilities/_background.scss +++ b/vendor/twbs/bootstrap/scss/utilities/_background.scss @@ -1,12 +1,12 @@ // stylelint-disable declaration-no-important @each $color, $value in $theme-colors { - @include bg-variant(".bg-#{$color}", $value); + @include bg-variant(".bg-#{$color}", $value, true); } @if $enable-gradients { @each $color, $value in $theme-colors { - @include bg-gradient-variant(".bg-gradient-#{$color}", $value); + @include bg-gradient-variant(".bg-gradient-#{$color}", $value, true); } } diff --git a/vendor/twbs/bootstrap/scss/utilities/_interactions.scss b/vendor/twbs/bootstrap/scss/utilities/_interactions.scss new file mode 100644 index 000000000..cc75fc21b --- /dev/null +++ b/vendor/twbs/bootstrap/scss/utilities/_interactions.scss @@ -0,0 +1,5 @@ +// stylelint-disable declaration-no-important + +@each $value in $user-selects { + .user-select-#{$value} { user-select: $value !important; } +} diff --git a/vendor/twbs/bootstrap/scss/utilities/_text.scss b/vendor/twbs/bootstrap/scss/utilities/_text.scss index 589e5687a..5d0f1c845 100644 --- a/vendor/twbs/bootstrap/scss/utilities/_text.scss +++ b/vendor/twbs/bootstrap/scss/utilities/_text.scss @@ -11,7 +11,7 @@ .text-justify { text-align: justify !important; } .text-wrap { white-space: normal !important; } .text-nowrap { white-space: nowrap !important; } -.text-truncate { @include text-truncate; } +.text-truncate { @include text-truncate(); } // Responsive alignment @@ -45,7 +45,7 @@ .text-white { color: $white !important; } @each $color, $value in $theme-colors { - @include text-emphasis-variant(".text-#{$color}", $value); + @include text-emphasis-variant(".text-#{$color}", $value, true); } .text-body { color: $body-color !important; } |