diff options
author | Mario <mario@mariovavti.com> | 2021-07-29 08:25:05 +0000 |
---|---|---|
committer | Mario <mario@mariovavti.com> | 2021-07-29 08:25:05 +0000 |
commit | d459dfac74e90c29950d49a82edc19fd913d435e (patch) | |
tree | 7bed5f2dbc318f87bbe0f4be2cde3dde09cd97c7 /vendor/twbs/bootstrap/scss | |
parent | cec2f0d894b80f3affeb60cff2d4afa49a2019a8 (diff) | |
download | volse-hubzilla-d459dfac74e90c29950d49a82edc19fd913d435e.tar.gz volse-hubzilla-d459dfac74e90c29950d49a82edc19fd913d435e.tar.bz2 volse-hubzilla-d459dfac74e90c29950d49a82edc19fd913d435e.zip |
update to bootstrap 5.0.2
Diffstat (limited to 'vendor/twbs/bootstrap/scss')
44 files changed, 1510 insertions, 79 deletions
diff --git a/vendor/twbs/bootstrap/scss/_accordion.scss b/vendor/twbs/bootstrap/scss/_accordion.scss new file mode 100644 index 000000000..fc62ceb88 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/_accordion.scss @@ -0,0 +1,118 @@ +// +// Base styles +// + +.accordion-button { + position: relative; + display: flex; + align-items: center; + width: 100%; + padding: $accordion-button-padding-y $accordion-button-padding-x; + @include font-size($font-size-base); + color: $accordion-button-color; + text-align: left; // Reset button style + background-color: $accordion-button-bg; + border: 0; + @include border-radius(0); + overflow-anchor: none; + @include transition($accordion-transition); + + &:not(.collapsed) { + color: $accordion-button-active-color; + background-color: $accordion-button-active-bg; + box-shadow: inset 0 ($accordion-border-width * -1) 0 $accordion-border-color; + + &::after { + background-image: escape-svg($accordion-button-active-icon); + transform: $accordion-icon-transform; + } + } + + // Accordion icon + &::after { + flex-shrink: 0; + width: $accordion-icon-width; + height: $accordion-icon-width; + margin-left: auto; + content: ""; + background-image: escape-svg($accordion-button-icon); + background-repeat: no-repeat; + background-size: $accordion-icon-width; + @include transition($accordion-icon-transition); + } + + &:hover { + z-index: 2; + } + + &:focus { + z-index: 3; + border-color: $accordion-button-focus-border-color; + outline: 0; + box-shadow: $accordion-button-focus-box-shadow; + } +} + +.accordion-header { + margin-bottom: 0; +} + +.accordion-item { + background-color: $accordion-bg; + border: $accordion-border-width solid $accordion-border-color; + + &:first-of-type { + @include border-top-radius($accordion-border-radius); + + .accordion-button { + @include border-top-radius($accordion-inner-border-radius); + } + } + + &:not(:first-of-type) { + border-top: 0; + } + + // Only set a border-radius on the last item if the accordion is collapsed + &:last-of-type { + @include border-bottom-radius($accordion-border-radius); + + .accordion-button { + &.collapsed { + @include border-bottom-radius($accordion-inner-border-radius); + } + } + + .accordion-collapse { + @include border-bottom-radius($accordion-border-radius); + } + } +} + +.accordion-body { + padding: $accordion-body-padding-y $accordion-body-padding-x; +} + + +// Flush accordion items +// +// Remove borders and border-radius to keep accordion items edge-to-edge. + +.accordion-flush { + .accordion-collapse { + border-width: 0; + } + + .accordion-item { + border-right: 0; + border-left: 0; + @include border-radius(0); + + &:first-child { border-top: 0; } + &:last-child { border-bottom: 0; } + + .accordion-button { + @include border-radius(0); + } + } +} diff --git a/vendor/twbs/bootstrap/scss/_card.scss b/vendor/twbs/bootstrap/scss/_card.scss index e3314219f..b077858c4 100644 --- a/vendor/twbs/bootstrap/scss/_card.scss +++ b/vendor/twbs/bootstrap/scss/_card.scss @@ -55,7 +55,7 @@ } .card-subtitle { - margin-top: -$card-title-spacer-y / 2; + margin-top: -$card-title-spacer-y * .5; margin-bottom: 0; } @@ -106,9 +106,9 @@ // .card-header-tabs { - margin-right: -$card-cap-padding-x / 2; + margin-right: -$card-cap-padding-x * .5; margin-bottom: -$card-cap-padding-y; - margin-left: -$card-cap-padding-x / 2; + margin-left: -$card-cap-padding-x * .5; border-bottom: 0; @if $nav-tabs-link-active-bg != $card-bg { @@ -120,8 +120,8 @@ } .card-header-pills { - margin-right: -$card-cap-padding-x / 2; - margin-left: -$card-cap-padding-x / 2; + margin-right: -$card-cap-padding-x * .5; + margin-left: -$card-cap-padding-x * .5; } // Card image diff --git a/vendor/twbs/bootstrap/scss/_carousel.scss b/vendor/twbs/bootstrap/scss/_carousel.scss index d389c3042..3d8fb15a0 100644 --- a/vendor/twbs/bootstrap/scss/_carousel.scss +++ b/vendor/twbs/bootstrap/scss/_carousel.scss @@ -202,9 +202,9 @@ .carousel-caption { position: absolute; - right: (100% - $carousel-caption-width) / 2; + right: (100% - $carousel-caption-width) * .5; bottom: $carousel-caption-spacer; - left: (100% - $carousel-caption-width) / 2; + left: (100% - $carousel-caption-width) * .5; padding-top: $carousel-caption-padding-y; padding-bottom: $carousel-caption-padding-y; color: $carousel-caption-color; diff --git a/vendor/twbs/bootstrap/scss/_containers.scss b/vendor/twbs/bootstrap/scss/_containers.scss new file mode 100644 index 000000000..f88f1e5f5 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/_containers.scss @@ -0,0 +1,41 @@ +// Container widths +// +// Set the container width, and override it for fixed navbars in media queries. + +@if $enable-grid-classes { + // Single container class with breakpoint max-widths + .container, + // 100% wide container at all breakpoints + .container-fluid { + @include make-container(); + } + + // Responsive containers that are 100% wide until a breakpoint + @each $breakpoint, $container-max-width in $container-max-widths { + .container-#{$breakpoint} { + @extend .container-fluid; + } + + @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; + } + } + } + } + } +} diff --git a/vendor/twbs/bootstrap/scss/_dropdown.scss b/vendor/twbs/bootstrap/scss/_dropdown.scss index 06e70f701..adc114327 100644 --- a/vendor/twbs/bootstrap/scss/_dropdown.scss +++ b/vendor/twbs/bootstrap/scss/_dropdown.scss @@ -50,8 +50,8 @@ --bs-position: start; &[data-bs-popper] { - right: auto #{"/* rtl:ignore */"}; - left: 0 #{"/* rtl:ignore */"}; + right: auto; + left: 0; } } @@ -59,8 +59,8 @@ --bs-position: end; &[data-bs-popper] { - right: 0 #{"/* rtl:ignore */"}; - left: auto #{"/* rtl:ignore */"}; + right: 0; + left: auto; } } } diff --git a/vendor/twbs/bootstrap/scss/_functions.scss b/vendor/twbs/bootstrap/scss/_functions.scss index 29114fc81..870f36790 100644 --- a/vendor/twbs/bootstrap/scss/_functions.scss +++ b/vendor/twbs/bootstrap/scss/_functions.scss @@ -95,7 +95,7 @@ // Color contrast // See https://github.com/twbs/bootstrap/pull/30168 -// A list of pre-calculated numbers of pow(($value / 255 + .055) / 1.055, 2.4). (from 0 to 255) +// A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255) // stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0123 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1; @@ -123,7 +123,7 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 $l1: luminance($background); $l2: luminance(opaque($background, $foreground)); - @return if($l1 > $l2, ($l1 + .05) / ($l2 + .05), ($l2 + .05) / ($l1 + .05)); + @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05)); } // Return WCAG2.0 relative luminance @@ -137,7 +137,7 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 ); @each $name, $value in $rgb { - $value: if($value / 255 < .03928, $value / 255 / 12.92, nth($_luminance-list, $value + 1)); + $value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1)); $rgb: map-merge($rgb, ($name: $value)); } @@ -181,6 +181,14 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 @return $value1 + $value2; } + @if type-of($value1) != number { + $value1: unquote("(") + $value1 + unquote(")"); + } + + @if type-of($value2) != number { + $value2: unquote("(") + $value2 + unquote(")"); + } + @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(" + ") + $value2); } @@ -201,5 +209,55 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 @return $value1 - $value2; } + @if type-of($value1) != number { + $value1: unquote("(") + $value1 + unquote(")"); + } + + @if type-of($value2) != number { + $value2: unquote("(") + $value2 + unquote(")"); + } + @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(" - ") + $value2); } + +@function divide($dividend, $divisor, $precision: 10) { + $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1); + $dividend: abs($dividend); + $divisor: abs($divisor); + @if $dividend == 0 { + @return 0; + } + @if $divisor == 0 { + @error "Cannot divide by 0"; + } + $remainder: $dividend; + $result: 0; + $factor: 10; + @while ($remainder > 0 and $precision >= 0) { + $quotient: 0; + @while ($remainder >= $divisor) { + $remainder: $remainder - $divisor; + $quotient: $quotient + 1; + } + $result: $result * 10 + $quotient; + $factor: $factor * .1; + $remainder: $remainder * 10; + $precision: $precision - 1; + @if ($precision < 0 and $remainder >= $divisor * 5) { + $result: $result + 1; + } + } + $result: $result * $factor * $sign; + $dividend-unit: unit($dividend); + $divisor-unit: unit($divisor); + $unit-map: ( + "px": 1px, + "rem": 1rem, + "em": 1em, + "%": 1% + ); + @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) { + $result: $result * map-get($unit-map, $dividend-unit); + } + @return $result; +} diff --git a/vendor/twbs/bootstrap/scss/_helpers.scss b/vendor/twbs/bootstrap/scss/_helpers.scss new file mode 100644 index 000000000..8f566d12f --- /dev/null +++ b/vendor/twbs/bootstrap/scss/_helpers.scss @@ -0,0 +1,7 @@ +@import "helpers/clearfix"; +@import "helpers/colored-links"; +@import "helpers/ratio"; +@import "helpers/position"; +@import "helpers/visually-hidden"; +@import "helpers/stretched-link"; +@import "helpers/text-truncation"; diff --git a/vendor/twbs/bootstrap/scss/_images.scss b/vendor/twbs/bootstrap/scss/_images.scss index b11b45a37..3d6a1014c 100644 --- a/vendor/twbs/bootstrap/scss/_images.scss +++ b/vendor/twbs/bootstrap/scss/_images.scss @@ -32,7 +32,7 @@ } .figure-img { - margin-bottom: $spacer / 2; + margin-bottom: $spacer * .5; line-height: 1; } diff --git a/vendor/twbs/bootstrap/scss/_modal.scss b/vendor/twbs/bootstrap/scss/_modal.scss index 4a0e3b861..77473085c 100644 --- a/vendor/twbs/bootstrap/scss/_modal.scss +++ b/vendor/twbs/bootstrap/scss/_modal.scss @@ -110,8 +110,8 @@ @include border-top-radius($modal-content-inner-border-radius); .btn-close { - padding: ($modal-header-padding-y / 2) ($modal-header-padding-x / 2); - margin: ($modal-header-padding-y / -2) ($modal-header-padding-x / -2) ($modal-header-padding-y / -2) auto; + padding: ($modal-header-padding-y * .5) ($modal-header-padding-x * .5); + margin: ($modal-header-padding-y * -.5) ($modal-header-padding-x * -.5) ($modal-header-padding-y * -.5) auto; } } @@ -138,7 +138,7 @@ flex-shrink: 0; 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 - $modal-footer-margin-between / 2; + padding: $modal-inner-padding - $modal-footer-margin-between * .5; border-top: $modal-footer-border-width solid $modal-footer-border-color; @include border-bottom-radius($modal-content-inner-border-radius); @@ -146,7 +146,7 @@ // 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; + margin: $modal-footer-margin-between * .5; } } diff --git a/vendor/twbs/bootstrap/scss/_offcanvas.scss b/vendor/twbs/bootstrap/scss/_offcanvas.scss new file mode 100644 index 000000000..91db68643 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/_offcanvas.scss @@ -0,0 +1,79 @@ +.offcanvas { + position: fixed; + bottom: 0; + z-index: $zindex-offcanvas; + display: flex; + flex-direction: column; + max-width: 100%; + color: $offcanvas-color; + visibility: hidden; + background-color: $offcanvas-bg-color; + background-clip: padding-box; + outline: 0; + @include box-shadow($offcanvas-box-shadow); + @include transition(transform $offcanvas-transition-duration ease-in-out); +} + +.offcanvas-header { + display: flex; + align-items: center; + justify-content: space-between; + padding: $offcanvas-padding-y $offcanvas-padding-x; + + .btn-close { + padding: ($offcanvas-padding-y * .5) ($offcanvas-padding-x * .5); + margin-top: $offcanvas-padding-y * -.5; + margin-right: $offcanvas-padding-x * -.5; + margin-bottom: $offcanvas-padding-y * -.5; + } +} + +.offcanvas-title { + margin-bottom: 0; + line-height: $offcanvas-title-line-height; +} + +.offcanvas-body { + flex-grow: 1; + padding: $offcanvas-padding-y $offcanvas-padding-x; + overflow-y: auto; +} + +.offcanvas-start { + top: 0; + left: 0; + width: $offcanvas-horizontal-width; + border-right: $offcanvas-border-width solid $offcanvas-border-color; + transform: translateX(-100%); +} + +.offcanvas-end { + top: 0; + right: 0; + width: $offcanvas-horizontal-width; + border-left: $offcanvas-border-width solid $offcanvas-border-color; + transform: translateX(100%); +} + +.offcanvas-top { + top: 0; + right: 0; + left: 0; + height: $offcanvas-vertical-height; + max-height: 100%; + border-bottom: $offcanvas-border-width solid $offcanvas-border-color; + transform: translateY(-100%); +} + +.offcanvas-bottom { + right: 0; + left: 0; + height: $offcanvas-vertical-height; + max-height: 100%; + border-top: $offcanvas-border-width solid $offcanvas-border-color; + transform: translateY(100%); +} + +.offcanvas.show { + transform: none; +} diff --git a/vendor/twbs/bootstrap/scss/_popover.scss b/vendor/twbs/bootstrap/scss/_popover.scss index a55555e2e..3b8208e16 100644 --- a/vendor/twbs/bootstrap/scss/_popover.scss +++ b/vendor/twbs/bootstrap/scss/_popover.scss @@ -40,13 +40,13 @@ &::before { bottom: 0; - border-width: $popover-arrow-height ($popover-arrow-width / 2) 0; + border-width: $popover-arrow-height ($popover-arrow-width * .5) 0; border-top-color: $popover-arrow-outer-color; } &::after { bottom: $popover-border-width; - border-width: $popover-arrow-height ($popover-arrow-width / 2) 0; + border-width: $popover-arrow-height ($popover-arrow-width * .5) 0; border-top-color: $popover-arrow-color; } } @@ -60,13 +60,13 @@ &::before { left: 0; - border-width: ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2) 0; + border-width: ($popover-arrow-width * .5) $popover-arrow-height ($popover-arrow-width * .5) 0; border-right-color: $popover-arrow-outer-color; } &::after { left: $popover-border-width; - border-width: ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2) 0; + border-width: ($popover-arrow-width * .5) $popover-arrow-height ($popover-arrow-width * .5) 0; border-right-color: $popover-arrow-color; } } @@ -78,13 +78,13 @@ &::before { top: 0; - border-width: 0 ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2); + border-width: 0 ($popover-arrow-width * .5) $popover-arrow-height ($popover-arrow-width * .5); border-bottom-color: $popover-arrow-outer-color; } &::after { top: $popover-border-width; - border-width: 0 ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2); + border-width: 0 ($popover-arrow-width * .5) $popover-arrow-height ($popover-arrow-width * .5); border-bottom-color: $popover-arrow-color; } } @@ -96,7 +96,7 @@ left: 50%; display: block; width: $popover-arrow-width; - margin-left: -$popover-arrow-width / 2; + margin-left: -$popover-arrow-width * .5; content: ""; border-bottom: $popover-border-width solid $popover-header-bg; } @@ -110,13 +110,13 @@ &::before { right: 0; - border-width: ($popover-arrow-width / 2) 0 ($popover-arrow-width / 2) $popover-arrow-height; + border-width: ($popover-arrow-width * .5) 0 ($popover-arrow-width * .5) $popover-arrow-height; border-left-color: $popover-arrow-outer-color; } &::after { right: $popover-border-width; - border-width: ($popover-arrow-width / 2) 0 ($popover-arrow-width / 2) $popover-arrow-height; + border-width: ($popover-arrow-width * .5) 0 ($popover-arrow-width * .5) $popover-arrow-height; border-left-color: $popover-arrow-color; } } @@ -144,7 +144,7 @@ @include font-size($font-size-base); color: $popover-header-color; background-color: $popover-header-bg; - border-bottom: $popover-border-width solid shade-color($popover-header-bg, 10%); + border-bottom: $popover-border-width solid $popover-border-color; @include border-top-radius($popover-inner-border-radius); &:empty { diff --git a/vendor/twbs/bootstrap/scss/_tables.scss b/vendor/twbs/bootstrap/scss/_tables.scss index 19f679d28..92556ba05 100644 --- a/vendor/twbs/bootstrap/scss/_tables.scss +++ b/vendor/twbs/bootstrap/scss/_tables.scss @@ -4,7 +4,7 @@ .table { --#{$variable-prefix}table-bg: #{$table-bg}; - --#{$variable-prefix}table-accent-bg: #{$table-bg}; + --#{$variable-prefix}table-accent-bg: #{$table-accent-bg}; --#{$variable-prefix}table-striped-color: #{$table-striped-color}; --#{$variable-prefix}table-striped-bg: #{$table-striped-bg}; --#{$variable-prefix}table-active-color: #{$table-active-color}; diff --git a/vendor/twbs/bootstrap/scss/_toasts.scss b/vendor/twbs/bootstrap/scss/_toasts.scss index 5c533d7f5..717aae576 100644 --- a/vendor/twbs/bootstrap/scss/_toasts.scss +++ b/vendor/twbs/bootstrap/scss/_toasts.scss @@ -40,7 +40,7 @@ @include border-top-radius(subtract($toast-border-radius, $toast-border-width)); .btn-close { - margin-right: $toast-padding-x / -2; + margin-right: $toast-padding-x * -.5; margin-left: $toast-padding-x; } } diff --git a/vendor/twbs/bootstrap/scss/_tooltip.scss b/vendor/twbs/bootstrap/scss/_tooltip.scss index 2993bf7de..75ff07838 100644 --- a/vendor/twbs/bootstrap/scss/_tooltip.scss +++ b/vendor/twbs/bootstrap/scss/_tooltip.scss @@ -37,7 +37,7 @@ &::before { top: -1px; - border-width: $tooltip-arrow-height ($tooltip-arrow-width / 2) 0; + border-width: $tooltip-arrow-height ($tooltip-arrow-width * .5) 0; border-top-color: $tooltip-arrow-color; } } @@ -53,7 +53,7 @@ &::before { right: -1px; - border-width: ($tooltip-arrow-width / 2) $tooltip-arrow-height ($tooltip-arrow-width / 2) 0; + border-width: ($tooltip-arrow-width * .5) $tooltip-arrow-height ($tooltip-arrow-width * .5) 0; border-right-color: $tooltip-arrow-color; } } @@ -67,7 +67,7 @@ &::before { bottom: -1px; - border-width: 0 ($tooltip-arrow-width / 2) $tooltip-arrow-height; + border-width: 0 ($tooltip-arrow-width * .5) $tooltip-arrow-height; border-bottom-color: $tooltip-arrow-color; } } @@ -83,7 +83,7 @@ &::before { left: -1px; - border-width: ($tooltip-arrow-width / 2) 0 ($tooltip-arrow-width / 2) $tooltip-arrow-height; + border-width: ($tooltip-arrow-width * .5) 0 ($tooltip-arrow-width * .5) $tooltip-arrow-height; border-left-color: $tooltip-arrow-color; } } diff --git a/vendor/twbs/bootstrap/scss/_variables.scss b/vendor/twbs/bootstrap/scss/_variables.scss index 1e17606f4..06dfa4a4d 100644 --- a/vendor/twbs/bootstrap/scss/_variables.scss +++ b/vendor/twbs/bootstrap/scss/_variables.scss @@ -250,8 +250,8 @@ $gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default; $spacer: 1rem !default; $spacers: ( 0: 0, - 1: $spacer / 4, - 2: $spacer / 2, + 1: $spacer * .25, + 2: $spacer * .5, 3: $spacer, 4: $spacer * 1.5, 5: $spacer * 3, @@ -350,7 +350,7 @@ $gutters: $spacers !default; // Container padding -$container-padding-x: $grid-gutter-width / 2 !default; +$container-padding-x: $grid-gutter-width * .5 !default; // Components @@ -422,8 +422,8 @@ $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberati $font-family-base: var(--#{$variable-prefix}font-sans-serif) !default; $font-family-code: var(--#{$variable-prefix}font-monospace) !default; -// $font-size-root effects the value of `rem`, which is used for as well font sizes, paddings and margins -// $font-size-base effects the font size of the body text +// $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins +// $font-size-base affects the font size of the body text $font-size-root: null !default; $font-size-base: 1rem !default; // Assumes the browser default, typically `16px` $font-size-sm: $font-size-base * .875 !default; @@ -461,7 +461,7 @@ $font-sizes: ( // scss-docs-end font-sizes // scss-docs-start headings-variables -$headings-margin-bottom: $spacer / 2 !default; +$headings-margin-bottom: $spacer * .5 !default; $headings-font-family: null !default; $headings-font-style: null !default; $headings-font-weight: 500 !default; @@ -535,6 +535,7 @@ $table-cell-vertical-align: top !default; $table-color: $body-color !default; $table-bg: transparent !default; +$table-accent-bg: transparent !default; $table-th-font-weight: null !default; @@ -717,7 +718,7 @@ $input-height-border: $input-border-width * 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-inner-quarter: add($input-line-height * .25em, $input-padding-y * .5) !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 * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default; @@ -825,6 +826,8 @@ $form-select-font-size-sm: $input-font-size-sm !default; $form-select-padding-y-lg: $input-padding-y-lg !default; $form-select-padding-x-lg: $input-padding-x-lg !default; $form-select-font-size-lg: $input-font-size-lg !default; + +$form-select-transition: $input-transition !default; // scss-docs-end form-select-variables // scss-docs-start form-range-variables @@ -856,6 +859,7 @@ $form-file-button-hover-bg: shade-color($form-file-button-bg, 5%) !default // scss-docs-start form-floating-variables $form-floating-height: add(3.5rem, $input-height-border) !default; +$form-floating-line-height: 1.25 !default; $form-floating-padding-x: $input-padding-x !default; $form-floating-padding-y: 1rem !default; $form-floating-input-padding-t: 1.625rem !default; @@ -939,7 +943,7 @@ $nav-pills-link-active-bg: $component-active-bg !default; // Navbar // scss-docs-start navbar-variables -$navbar-padding-y: $spacer / 2 !default; +$navbar-padding-y: $spacer * .5 !default; $navbar-padding-x: null !default; $navbar-nav-link-padding-x: .5rem !default; @@ -948,7 +952,7 @@ $navbar-brand-font-size: $font-size-lg !default; // Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link $nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default; $navbar-brand-height: $navbar-brand-font-size * $line-height-base !default; -$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default; +$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5 !default; $navbar-brand-margin-end: 1rem !default; $navbar-toggler-padding-y: .25rem !default; @@ -998,7 +1002,7 @@ $dropdown-border-radius: $border-radius !default; $dropdown-border-width: $border-width !default; $dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default; $dropdown-divider-bg: $dropdown-border-color !default; -$dropdown-divider-margin-y: $spacer / 2 !default; +$dropdown-divider-margin-y: $spacer * .5 !default; $dropdown-box-shadow: $box-shadow !default; $dropdown-link-color: $gray-900 !default; @@ -1010,7 +1014,7 @@ $dropdown-link-active-bg: $component-active-bg !default; $dropdown-link-disabled-color: $gray-500 !default; -$dropdown-item-padding-y: $spacer / 4 !default; +$dropdown-item-padding-y: $spacer * .25 !default; $dropdown-item-padding-x: $spacer !default; $dropdown-header-color: $gray-600 !default; @@ -1079,12 +1083,12 @@ $pagination-border-radius-lg: $border-radius-lg !default; // scss-docs-start card-variables $card-spacer-y: $spacer !default; $card-spacer-x: $spacer !default; -$card-title-spacer-y: $spacer / 2 !default; +$card-title-spacer-y: $spacer * .5 !default; $card-border-width: $border-width !default; $card-border-radius: $border-radius !default; $card-border-color: rgba($black, .125) !default; $card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default; -$card-cap-padding-y: $card-spacer-y / 2 !default; +$card-cap-padding-y: $card-spacer-y * .5 !default; $card-cap-padding-x: $card-spacer-x !default; $card-cap-bg: rgba($black, .03) !default; $card-cap-color: null !default; @@ -1092,7 +1096,7 @@ $card-height: null !default; $card-color: null !default; $card-bg: $white !default; $card-img-overlay-padding: $spacer !default; -$card-group-margin: $grid-gutter-width / 2 !default; +$card-group-margin: $grid-gutter-width * .5 !default; // scss-docs-end card-variables // Accordion @@ -1140,8 +1144,8 @@ $tooltip-color: $white !default; $tooltip-bg: $black !default; $tooltip-border-radius: $border-radius !default; $tooltip-opacity: .9 !default; -$tooltip-padding-y: $spacer / 4 !default; -$tooltip-padding-x: $spacer / 2 !default; +$tooltip-padding-y: $spacer * .25 !default; +$tooltip-padding-x: $spacer * .5 !default; $tooltip-margin: 0 !default; $tooltip-arrow-width: .8rem !default; @@ -1157,7 +1161,7 @@ $form-feedback-tooltip-font-size: $tooltip-font-size !default; $form-feedback-tooltip-line-height: null !default; $form-feedback-tooltip-opacity: $tooltip-opacity !default; $form-feedback-tooltip-border-radius: $tooltip-border-radius !default; -// scss-docs-start tooltip-feedback-variables +// scss-docs-end tooltip-feedback-variables // Popovers @@ -1307,7 +1311,7 @@ $list-group-border-color: rgba($black, .125) !default; $list-group-border-width: $border-width !default; $list-group-border-radius: $border-radius !default; -$list-group-item-padding-y: $spacer / 2 !default; +$list-group-item-padding-y: $spacer * .5 !default; $list-group-item-padding-x: $spacer !default; $list-group-item-bg-scale: -80% !default; $list-group-item-color-scale: 40% !default; diff --git a/vendor/twbs/bootstrap/scss/bootstrap-grid.scss b/vendor/twbs/bootstrap/scss/bootstrap-grid.scss index 5f3a14d16..bcd8c19cf 100644 --- a/vendor/twbs/bootstrap/scss/bootstrap-grid.scss +++ b/vendor/twbs/bootstrap/scss/bootstrap-grid.scss @@ -1,5 +1,5 @@ /*! - * Bootstrap Grid v5.0.1 (https://getbootstrap.com/) + * Bootstrap Grid v5.0.2 (https://getbootstrap.com/) * Copyright 2011-2021 The Bootstrap Authors * Copyright 2011-2021 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) diff --git a/vendor/twbs/bootstrap/scss/bootstrap-reboot.scss b/vendor/twbs/bootstrap/scss/bootstrap-reboot.scss index 3fb5fa0ec..72444f6c1 100644 --- a/vendor/twbs/bootstrap/scss/bootstrap-reboot.scss +++ b/vendor/twbs/bootstrap/scss/bootstrap-reboot.scss @@ -1,5 +1,5 @@ /*! - * Bootstrap Reboot v5.0.1 (https://getbootstrap.com/) + * Bootstrap Reboot v5.0.2 (https://getbootstrap.com/) * Copyright 2011-2021 The Bootstrap Authors * Copyright 2011-2021 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) diff --git a/vendor/twbs/bootstrap/scss/bootstrap-utilities.scss b/vendor/twbs/bootstrap/scss/bootstrap-utilities.scss new file mode 100644 index 000000000..ab2d0e701 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/bootstrap-utilities.scss @@ -0,0 +1,18 @@ +/*! + * Bootstrap Utilities v5.0.2 (https://getbootstrap.com/) + * Copyright 2011-2021 The Bootstrap Authors + * Copyright 2011-2021 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) + */ + +// Configuration +@import "functions"; +@import "variables"; +@import "mixins"; +@import "utilities"; + +// Helpers +@import "helpers"; + +// Utilities +@import "utilities/api"; diff --git a/vendor/twbs/bootstrap/scss/bootstrap.scss b/vendor/twbs/bootstrap/scss/bootstrap.scss index 86c079db3..eb047a3f2 100644 --- a/vendor/twbs/bootstrap/scss/bootstrap.scss +++ b/vendor/twbs/bootstrap/scss/bootstrap.scss @@ -1,5 +1,5 @@ /*! - * Bootstrap v5.0.1 (https://getbootstrap.com/) + * Bootstrap v5.0.2 (https://getbootstrap.com/) * Copyright 2011-2021 The Bootstrap Authors * Copyright 2011-2021 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) diff --git a/vendor/twbs/bootstrap/scss/forms/_floating-labels.scss b/vendor/twbs/bootstrap/scss/forms/_floating-labels.scss new file mode 100644 index 000000000..2f4295480 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/forms/_floating-labels.scss @@ -0,0 +1,63 @@ +.form-floating { + position: relative; + + > .form-control, + > .form-select { + height: $form-floating-height; + line-height: $form-floating-line-height; + } + + > label { + position: absolute; + top: 0; + left: 0; + height: 100%; // allow textareas + padding: $form-floating-padding-y $form-floating-padding-x; + pointer-events: none; + border: $input-border-width solid transparent; // Required for aligning label's text with the input as it affects inner box model + transform-origin: 0 0; + @include transition($form-floating-transition); + } + + // stylelint-disable no-duplicate-selectors + > .form-control { + padding: $form-floating-padding-y $form-floating-padding-x; + + &::placeholder { + color: transparent; + } + + &:focus, + &:not(:placeholder-shown) { + padding-top: $form-floating-input-padding-t; + padding-bottom: $form-floating-input-padding-b; + } + // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped + &:-webkit-autofill { + padding-top: $form-floating-input-padding-t; + padding-bottom: $form-floating-input-padding-b; + } + } + + > .form-select { + padding-top: $form-floating-input-padding-t; + padding-bottom: $form-floating-input-padding-b; + } + + > .form-control:focus, + > .form-control:not(:placeholder-shown), + > .form-select { + ~ label { + opacity: $form-floating-label-opacity; + transform: $form-floating-label-transform; + } + } + // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped + > .form-control:-webkit-autofill { + ~ label { + opacity: $form-floating-label-opacity; + transform: $form-floating-label-transform; + } + } + // stylelint-enable no-duplicate-selectors +} diff --git a/vendor/twbs/bootstrap/scss/forms/_form-check.scss b/vendor/twbs/bootstrap/scss/forms/_form-check.scss new file mode 100644 index 000000000..6321b4100 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/forms/_form-check.scss @@ -0,0 +1,152 @@ +// +// Check/radio +// + +.form-check { + display: block; + min-height: $form-check-min-height; + padding-left: $form-check-padding-start; + margin-bottom: $form-check-margin-bottom; + + .form-check-input { + float: left; + margin-left: $form-check-padding-start * -1; + } +} + +.form-check-input { + width: $form-check-input-width; + height: $form-check-input-width; + margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height + vertical-align: top; + background-color: $form-check-input-bg; + background-repeat: no-repeat; + background-position: center; + background-size: contain; + border: $form-check-input-border; + appearance: none; + color-adjust: exact; // Keep themed appearance for print + @include transition($form-check-transition); + + &[type="checkbox"] { + @include border-radius($form-check-input-border-radius); + } + + &[type="radio"] { + // stylelint-disable-next-line property-disallowed-list + border-radius: $form-check-radio-border-radius; + } + + &:active { + filter: $form-check-input-active-filter; + } + + &:focus { + border-color: $form-check-input-focus-border; + outline: 0; + box-shadow: $form-check-input-focus-box-shadow; + } + + &:checked { + background-color: $form-check-input-checked-bg-color; + border-color: $form-check-input-checked-border-color; + + &[type="checkbox"] { + @if $enable-gradients { + background-image: escape-svg($form-check-input-checked-bg-image), var(--#{$variable-prefix}gradient); + } @else { + background-image: escape-svg($form-check-input-checked-bg-image); + } + } + + &[type="radio"] { + @if $enable-gradients { + background-image: escape-svg($form-check-radio-checked-bg-image), var(--#{$variable-prefix}gradient); + } @else { + background-image: escape-svg($form-check-radio-checked-bg-image); + } + } + } + + &[type="checkbox"]:indeterminate { + background-color: $form-check-input-indeterminate-bg-color; + border-color: $form-check-input-indeterminate-border-color; + + @if $enable-gradients { + background-image: escape-svg($form-check-input-indeterminate-bg-image), var(--#{$variable-prefix}gradient); + } @else { + background-image: escape-svg($form-check-input-indeterminate-bg-image); + } + } + + &:disabled { + pointer-events: none; + filter: none; + opacity: $form-check-input-disabled-opacity; + } + + // Use disabled attribute in addition of :disabled pseudo-class + // See: https://github.com/twbs/bootstrap/issues/28247 + &[disabled], + &:disabled { + ~ .form-check-label { + opacity: $form-check-label-disabled-opacity; + } + } +} + +.form-check-label { + color: $form-check-label-color; + cursor: $form-check-label-cursor; +} + +// +// Switch +// + +.form-switch { + padding-left: $form-switch-padding-start; + + .form-check-input { + width: $form-switch-width; + margin-left: $form-switch-padding-start * -1; + background-image: escape-svg($form-switch-bg-image); + background-position: left center; + @include border-radius($form-switch-border-radius); + @include transition($form-switch-transition); + + &:focus { + background-image: escape-svg($form-switch-focus-bg-image); + } + + &:checked { + background-position: $form-switch-checked-bg-position; + + @if $enable-gradients { + background-image: escape-svg($form-switch-checked-bg-image), var(--#{$variable-prefix}gradient); + } @else { + background-image: escape-svg($form-switch-checked-bg-image); + } + } + } +} + +.form-check-inline { + display: inline-block; + margin-right: $form-check-inline-margin-end; +} + +.btn-check { + position: absolute; + clip: rect(0, 0, 0, 0); + pointer-events: none; + + &[disabled], + &:disabled { + + .btn { + pointer-events: none; + filter: none; + opacity: $form-check-btn-check-disabled-opacity; + } + } +} diff --git a/vendor/twbs/bootstrap/scss/forms/_form-control.scss b/vendor/twbs/bootstrap/scss/forms/_form-control.scss new file mode 100644 index 000000000..9728b91f3 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/forms/_form-control.scss @@ -0,0 +1,219 @@ +// +// General form controls (plus a few specific high-level interventions) +// + +.form-control { + display: block; + width: 100%; + padding: $input-padding-y $input-padding-x; + font-family: $input-font-family; + @include font-size($input-font-size); + font-weight: $input-font-weight; + line-height: $input-line-height; + color: $input-color; + background-color: $input-bg; + background-clip: padding-box; + border: $input-border-width solid $input-border-color; + appearance: none; // Fix appearance for date inputs in Safari + + // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS. + @include border-radius($input-border-radius, 0); + + @include box-shadow($input-box-shadow); + @include transition($input-transition); + + &[type="file"] { + overflow: hidden; // prevent pseudo element button overlap + + &:not(:disabled):not([readonly]) { + cursor: pointer; + } + } + + // Customize the `:focus` state to imitate native WebKit styles. + &:focus { + color: $input-focus-color; + background-color: $input-focus-bg; + border-color: $input-focus-border-color; + outline: 0; + @if $enable-shadows { + @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; + } + } + + // Add some height to date inputs on iOS + // https://github.com/twbs/bootstrap/issues/23307 + // TODO: we can remove this workaround once https://bugs.webkit.org/show_bug.cgi?id=198959 is resolved + &::-webkit-date-and-time-value { + // Multiply line-height by 1em if it has no unit + height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height); + } + + // Placeholder + &::placeholder { + color: $input-placeholder-color; + // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526. + opacity: 1; + } + + // Disabled and read-only inputs + // + // HTML5 says that controls under a fieldset > legend:first-child won't be + // disabled if the fieldset is disabled. Due to implementation difficulty, we + // don't honor that edge case; we style them as disabled anyway. + &:disabled, + &[readonly] { + background-color: $input-disabled-bg; + border-color: $input-disabled-border-color; + // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655. + opacity: 1; + } + + // File input buttons theming + &::file-selector-button { + padding: $input-padding-y $input-padding-x; + margin: (-$input-padding-y) (-$input-padding-x); + margin-inline-end: $input-padding-x; + color: $form-file-button-color; + @include gradient-bg($form-file-button-bg); + pointer-events: none; + border-color: inherit; + border-style: solid; + border-width: 0; + border-inline-end-width: $input-border-width; + border-radius: 0; // stylelint-disable-line property-disallowed-list + @include transition($btn-transition); + } + + &:hover:not(:disabled):not([readonly])::file-selector-button { + background-color: $form-file-button-hover-bg; + } + + &::-webkit-file-upload-button { + padding: $input-padding-y $input-padding-x; + margin: (-$input-padding-y) (-$input-padding-x); + margin-inline-end: $input-padding-x; + color: $form-file-button-color; + @include gradient-bg($form-file-button-bg); + pointer-events: none; + border-color: inherit; + border-style: solid; + border-width: 0; + border-inline-end-width: $input-border-width; + border-radius: 0; // stylelint-disable-line property-disallowed-list + @include transition($btn-transition); + } + + &:hover:not(:disabled):not([readonly])::-webkit-file-upload-button { + background-color: $form-file-button-hover-bg; + } +} + +// Readonly controls as plain text +// +// Apply class to a readonly input to make it appear like regular plain +// text (without any border, background color, focus indicator) + +.form-control-plaintext { + display: block; + width: 100%; + padding: $input-padding-y 0; + margin-bottom: 0; // match inputs if this class comes on inputs with default margins + line-height: $input-line-height; + color: $input-plaintext-color; + background-color: transparent; + border: solid transparent; + border-width: $input-border-width 0; + + &.form-control-sm, + &.form-control-lg { + padding-right: 0; + padding-left: 0; + } +} + +// Form control sizing +// +// Build on `.form-control` with modifier classes to decrease or increase the +// height and font-size of form controls. +// +// Repeated in `_input_group.scss` to avoid Sass extend issues. + +.form-control-sm { + min-height: $input-height-sm; + padding: $input-padding-y-sm $input-padding-x-sm; + @include font-size($input-font-size-sm); + @include border-radius($input-border-radius-sm); + + &::file-selector-button { + padding: $input-padding-y-sm $input-padding-x-sm; + margin: (-$input-padding-y-sm) (-$input-padding-x-sm); + margin-inline-end: $input-padding-x-sm; + } + + &::-webkit-file-upload-button { + padding: $input-padding-y-sm $input-padding-x-sm; + margin: (-$input-padding-y-sm) (-$input-padding-x-sm); + margin-inline-end: $input-padding-x-sm; + } +} + +.form-control-lg { + min-height: $input-height-lg; + padding: $input-padding-y-lg $input-padding-x-lg; + @include font-size($input-font-size-lg); + @include border-radius($input-border-radius-lg); + + &::file-selector-button { + padding: $input-padding-y-lg $input-padding-x-lg; + margin: (-$input-padding-y-lg) (-$input-padding-x-lg); + margin-inline-end: $input-padding-x-lg; + } + + &::-webkit-file-upload-button { + padding: $input-padding-y-lg $input-padding-x-lg; + margin: (-$input-padding-y-lg) (-$input-padding-x-lg); + margin-inline-end: $input-padding-x-lg; + } +} + +// Make sure textareas don't shrink too much when resized +// https://github.com/twbs/bootstrap/pull/29124 +// stylelint-disable selector-no-qualifying-type +textarea { + &.form-control { + min-height: $input-height; + } + + &.form-control-sm { + min-height: $input-height-sm; + } + + &.form-control-lg { + min-height: $input-height-lg; + } +} +// stylelint-enable selector-no-qualifying-type + +.form-control-color { + max-width: 3rem; + height: auto; // Override fixed browser height + padding: $input-padding-y; + + &:not(:disabled):not([readonly]) { + cursor: pointer; + } + + &::-moz-color-swatch { + height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height); + @include border-radius($input-border-radius); + } + + &::-webkit-color-swatch { + height: if(unit($input-line-height) == "", $input-line-height * 1em, $input-line-height); + @include border-radius($input-border-radius); + } +} diff --git a/vendor/twbs/bootstrap/scss/forms/_form-range.scss b/vendor/twbs/bootstrap/scss/forms/_form-range.scss new file mode 100644 index 000000000..6de42132e --- /dev/null +++ b/vendor/twbs/bootstrap/scss/forms/_form-range.scss @@ -0,0 +1,91 @@ +// Range +// +// Style range inputs the same across browsers. Vendor-specific rules for pseudo +// elements cannot be mixed. As such, there are no shared styles for focus or +// active states on prefixed selectors. + +.form-range { + width: 100%; + height: add($form-range-thumb-height, $form-range-thumb-focus-box-shadow-width * 2); + padding: 0; // Need to reset padding + background-color: transparent; + appearance: none; + + &:focus { + outline: 0; + + // Pseudo-elements must be split across multiple rulesets to have an effect. + // No box-shadow() mixin for focus accessibility. + &::-webkit-slider-thumb { box-shadow: $form-range-thumb-focus-box-shadow; } + &::-moz-range-thumb { box-shadow: $form-range-thumb-focus-box-shadow; } + } + + &::-moz-focus-outer { + border: 0; + } + + &::-webkit-slider-thumb { + width: $form-range-thumb-width; + height: $form-range-thumb-height; + margin-top: ($form-range-track-height - $form-range-thumb-height) * .5; // Webkit specific + @include gradient-bg($form-range-thumb-bg); + border: $form-range-thumb-border; + @include border-radius($form-range-thumb-border-radius); + @include box-shadow($form-range-thumb-box-shadow); + @include transition($form-range-thumb-transition); + appearance: none; + + &:active { + @include gradient-bg($form-range-thumb-active-bg); + } + } + + &::-webkit-slider-runnable-track { + width: $form-range-track-width; + height: $form-range-track-height; + color: transparent; // Why? + cursor: $form-range-track-cursor; + background-color: $form-range-track-bg; + border-color: transparent; + @include border-radius($form-range-track-border-radius); + @include box-shadow($form-range-track-box-shadow); + } + + &::-moz-range-thumb { + width: $form-range-thumb-width; + height: $form-range-thumb-height; + @include gradient-bg($form-range-thumb-bg); + border: $form-range-thumb-border; + @include border-radius($form-range-thumb-border-radius); + @include box-shadow($form-range-thumb-box-shadow); + @include transition($form-range-thumb-transition); + appearance: none; + + &:active { + @include gradient-bg($form-range-thumb-active-bg); + } + } + + &::-moz-range-track { + width: $form-range-track-width; + height: $form-range-track-height; + color: transparent; + cursor: $form-range-track-cursor; + background-color: $form-range-track-bg; + border-color: transparent; // Firefox specific? + @include border-radius($form-range-track-border-radius); + @include box-shadow($form-range-track-box-shadow); + } + + &:disabled { + pointer-events: none; + + &::-webkit-slider-thumb { + background-color: $form-range-thumb-disabled-bg; + } + + &::-moz-range-thumb { + background-color: $form-range-thumb-disabled-bg; + } + } +} diff --git a/vendor/twbs/bootstrap/scss/forms/_form-select.scss b/vendor/twbs/bootstrap/scss/forms/_form-select.scss new file mode 100644 index 000000000..4506a979a --- /dev/null +++ b/vendor/twbs/bootstrap/scss/forms/_form-select.scss @@ -0,0 +1,70 @@ +// Select +// +// Replaces the browser default select with a custom one, mostly pulled from +// https://primer.github.io/. + +.form-select { + display: block; + width: 100%; + padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x; + // stylelint-disable-next-line property-no-vendor-prefix + -moz-padding-start: subtract($form-select-padding-x, 3px); // See https://github.com/twbs/bootstrap/issues/32636 + font-family: $form-select-font-family; + @include font-size($form-select-font-size); + font-weight: $form-select-font-weight; + line-height: $form-select-line-height; + color: $form-select-color; + background-color: $form-select-bg; + background-image: escape-svg($form-select-indicator); + background-repeat: no-repeat; + background-position: $form-select-bg-position; + background-size: $form-select-bg-size; + border: $form-select-border-width solid $form-select-border-color; + @include border-radius($form-select-border-radius, 0); + @include box-shadow($form-select-box-shadow); + @include transition($form-select-transition); + appearance: none; + + &:focus { + border-color: $form-select-focus-border-color; + outline: 0; + @if $enable-shadows { + @include box-shadow($form-select-box-shadow, $form-select-focus-box-shadow); + } @else { + // Avoid using mixin so we can pass custom focus shadow properly + box-shadow: $form-select-focus-box-shadow; + } + } + + &[multiple], + &[size]:not([size="1"]) { + padding-right: $form-select-padding-x; + background-image: none; + } + + &:disabled { + color: $form-select-disabled-color; + background-color: $form-select-disabled-bg; + border-color: $form-select-disabled-border-color; + } + + // Remove outline from select box in FF + &:-moz-focusring { + color: transparent; + text-shadow: 0 0 0 $form-select-color; + } +} + +.form-select-sm { + padding-top: $form-select-padding-y-sm; + padding-bottom: $form-select-padding-y-sm; + padding-left: $form-select-padding-x-sm; + @include font-size($form-select-font-size-sm); +} + +.form-select-lg { + padding-top: $form-select-padding-y-lg; + padding-bottom: $form-select-padding-y-lg; + padding-left: $form-select-padding-x-lg; + @include font-size($form-select-font-size-lg); +} diff --git a/vendor/twbs/bootstrap/scss/forms/_form-text.scss b/vendor/twbs/bootstrap/scss/forms/_form-text.scss new file mode 100644 index 000000000..f080d1a23 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/forms/_form-text.scss @@ -0,0 +1,11 @@ +// +// Form text +// + +.form-text { + margin-top: $form-text-margin-top; + @include font-size($form-text-font-size); + font-style: $form-text-font-style; + font-weight: $form-text-font-weight; + color: $form-text-color; +} diff --git a/vendor/twbs/bootstrap/scss/forms/_input-group.scss b/vendor/twbs/bootstrap/scss/forms/_input-group.scss new file mode 100644 index 000000000..140052936 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/forms/_input-group.scss @@ -0,0 +1,121 @@ +// +// Base styles +// + +.input-group { + position: relative; + display: flex; + flex-wrap: wrap; // For form validation feedback + align-items: stretch; + width: 100%; + + > .form-control, + > .form-select { + position: relative; // For focus state's z-index + flex: 1 1 auto; + width: 1%; + min-width: 0; // https://stackoverflow.com/questions/36247140/why-dont-flex-items-shrink-past-content-size + } + + // Bring the "active" form control to the top of surrounding elements + > .form-control:focus, + > .form-select:focus { + z-index: 3; + } + + // Ensure buttons are always above inputs for more visually pleasing borders. + // This isn't needed for `.input-group-text` since it shares the same border-color + // as our inputs. + .btn { + position: relative; + z-index: 2; + + &:focus { + z-index: 3; + } + } +} + + +// Textual addons +// +// Serves as a catch-all element for any text or radio/checkbox input you wish +// to prepend or append to an input. + +.input-group-text { + display: flex; + align-items: center; + padding: $input-group-addon-padding-y $input-group-addon-padding-x; + @include font-size($input-font-size); // Match inputs + font-weight: $input-group-addon-font-weight; + line-height: $input-line-height; + color: $input-group-addon-color; + text-align: center; + white-space: nowrap; + background-color: $input-group-addon-bg; + border: $input-border-width solid $input-group-addon-border-color; + @include border-radius($input-border-radius); +} + + +// Sizing +// +// Remix the default form control sizing classes into new ones for easier +// manipulation. + +.input-group-lg > .form-control, +.input-group-lg > .form-select, +.input-group-lg > .input-group-text, +.input-group-lg > .btn { + padding: $input-padding-y-lg $input-padding-x-lg; + @include font-size($input-font-size-lg); + @include border-radius($input-border-radius-lg); +} + +.input-group-sm > .form-control, +.input-group-sm > .form-select, +.input-group-sm > .input-group-text, +.input-group-sm > .btn { + padding: $input-padding-y-sm $input-padding-x-sm; + @include font-size($input-font-size-sm); + @include border-radius($input-border-radius-sm); +} + +.input-group-lg > .form-select, +.input-group-sm > .form-select { + padding-right: $form-select-padding-x + $form-select-indicator-padding; +} + + +// Rounded corners +// +// These rulesets must come after the sizing ones to properly override sm and lg +// border-radius values when extending. They're more specific than we'd like +// with the `.input-group >` part, but without it, we cannot override the sizing. + +// stylelint-disable-next-line no-duplicate-selectors +.input-group { + &:not(.has-validation) { + > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu), + > .dropdown-toggle:nth-last-child(n + 3) { + @include border-end-radius(0); + } + } + + &.has-validation { + > :nth-last-child(n + 3):not(.dropdown-toggle):not(.dropdown-menu), + > .dropdown-toggle:nth-last-child(n + 4) { + @include border-end-radius(0); + } + } + + $validation-messages: ""; + @each $state in map-keys($form-validation-states) { + $validation-messages: $validation-messages + ":not(." + unquote($state) + "-tooltip)" + ":not(." + unquote($state) + "-feedback)"; + } + + > :not(:first-child):not(.dropdown-menu)#{$validation-messages} { + margin-left: -$input-border-width; + @include border-start-radius(0); + } +} diff --git a/vendor/twbs/bootstrap/scss/forms/_labels.scss b/vendor/twbs/bootstrap/scss/forms/_labels.scss new file mode 100644 index 000000000..39ecafcd2 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/forms/_labels.scss @@ -0,0 +1,36 @@ +// +// Labels +// + +.form-label { + margin-bottom: $form-label-margin-bottom; + @include font-size($form-label-font-size); + font-style: $form-label-font-style; + font-weight: $form-label-font-weight; + color: $form-label-color; +} + +// 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: add($input-padding-y, $input-border-width); + padding-bottom: add($input-padding-y, $input-border-width); + margin-bottom: 0; // Override the `<legend>` default + @include font-size(inherit); // Override the `<legend>` default + font-style: $form-label-font-style; + font-weight: $form-label-font-weight; + line-height: $input-line-height; + color: $form-label-color; +} + +.col-form-label-lg { + 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); +} + +.col-form-label-sm { + 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); +} diff --git a/vendor/twbs/bootstrap/scss/forms/_validation.scss b/vendor/twbs/bootstrap/scss/forms/_validation.scss new file mode 100644 index 000000000..c48123a71 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/forms/_validation.scss @@ -0,0 +1,12 @@ +// Form validation +// +// Provide feedback to users when form field values are valid or invalid. Works +// primarily for client-side validation via scoped `:invalid` and `:valid` +// pseudo-classes but also includes `.is-invalid` and `.is-valid` classes for +// server-side validation. + +// scss-docs-start form-validation-states-loop +@each $state, $data in $form-validation-states { + @include form-validation-state($state, $data...); +} +// scss-docs-end form-validation-states-loop diff --git a/vendor/twbs/bootstrap/scss/helpers/_clearfix.scss b/vendor/twbs/bootstrap/scss/helpers/_clearfix.scss new file mode 100644 index 000000000..e92522a94 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/helpers/_clearfix.scss @@ -0,0 +1,3 @@ +.clearfix { + @include clearfix(); +} diff --git a/vendor/twbs/bootstrap/scss/helpers/_colored-links.scss b/vendor/twbs/bootstrap/scss/helpers/_colored-links.scss new file mode 100644 index 000000000..8c167dedf --- /dev/null +++ b/vendor/twbs/bootstrap/scss/helpers/_colored-links.scss @@ -0,0 +1,12 @@ +@each $color, $value in $theme-colors { + .link-#{$color} { + color: $value; + + @if $link-shade-percentage != 0 { + &:hover, + &:focus { + color: if(color-contrast($value) == $color-contrast-light, shade-color($value, $link-shade-percentage), tint-color($value, $link-shade-percentage)); + } + } + } +} diff --git a/vendor/twbs/bootstrap/scss/helpers/_position.scss b/vendor/twbs/bootstrap/scss/helpers/_position.scss new file mode 100644 index 000000000..31851eb72 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/helpers/_position.scss @@ -0,0 +1,30 @@ +// Shorthand + +.fixed-top { + position: fixed; + top: 0; + right: 0; + left: 0; + z-index: $zindex-fixed; +} + +.fixed-bottom { + position: fixed; + right: 0; + bottom: 0; + left: 0; + z-index: $zindex-fixed; +} + +// Responsive sticky top +@each $breakpoint in map-keys($grid-breakpoints) { + @include media-breakpoint-up($breakpoint) { + $infix: breakpoint-infix($breakpoint, $grid-breakpoints); + + .sticky#{$infix}-top { + position: sticky; + top: 0; + z-index: $zindex-sticky; + } + } +} diff --git a/vendor/twbs/bootstrap/scss/helpers/_ratio.scss b/vendor/twbs/bootstrap/scss/helpers/_ratio.scss new file mode 100644 index 000000000..2390ee339 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/helpers/_ratio.scss @@ -0,0 +1,26 @@ +// Credit: Nicolas Gallagher and SUIT CSS. + +.ratio { + position: relative; + width: 100%; + + &::before { + display: block; + padding-top: var(--#{$variable-prefix}aspect-ratio); + content: ""; + } + + > * { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } +} + +@each $key, $ratio in $aspect-ratios { + .ratio-#{$key} { + --#{$variable-prefix}aspect-ratio: #{$ratio}; + } +} diff --git a/vendor/twbs/bootstrap/scss/helpers/_stretched-link.scss b/vendor/twbs/bootstrap/scss/helpers/_stretched-link.scss new file mode 100644 index 000000000..71a1c755a --- /dev/null +++ b/vendor/twbs/bootstrap/scss/helpers/_stretched-link.scss @@ -0,0 +1,15 @@ +// +// Stretched link +// + +.stretched-link { + &::#{$stretched-link-pseudo-element} { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + z-index: $stretched-link-z-index; + content: ""; + } +} diff --git a/vendor/twbs/bootstrap/scss/helpers/_text-truncation.scss b/vendor/twbs/bootstrap/scss/helpers/_text-truncation.scss new file mode 100644 index 000000000..6421dac9a --- /dev/null +++ b/vendor/twbs/bootstrap/scss/helpers/_text-truncation.scss @@ -0,0 +1,7 @@ +// +// Text truncation +// + +.text-truncate { + @include text-truncate(); +} diff --git a/vendor/twbs/bootstrap/scss/helpers/_visually-hidden.scss b/vendor/twbs/bootstrap/scss/helpers/_visually-hidden.scss new file mode 100644 index 000000000..4760ff03d --- /dev/null +++ b/vendor/twbs/bootstrap/scss/helpers/_visually-hidden.scss @@ -0,0 +1,8 @@ +// +// Visually hidden +// + +.visually-hidden, +.visually-hidden-focusable:not(:focus):not(:focus-within) { + @include visually-hidden(); +} diff --git a/vendor/twbs/bootstrap/scss/mixins/_buttons.scss b/vendor/twbs/bootstrap/scss/mixins/_buttons.scss index c06fa4a98..b67499668 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_buttons.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_buttons.scss @@ -11,7 +11,7 @@ $hover-background: if($color == $color-contrast-light, shade-color($background, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)), $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)), $hover-color: color-contrast($hover-background), - $active-background: if($color == $color-contrast-light, shade-color($background,$btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)), + $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)), $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)), $active-color: color-contrast($active-background), $disabled-background: $background, diff --git a/vendor/twbs/bootstrap/scss/mixins/_color-scheme.scss b/vendor/twbs/bootstrap/scss/mixins/_color-scheme.scss new file mode 100644 index 000000000..90497aa0a --- /dev/null +++ b/vendor/twbs/bootstrap/scss/mixins/_color-scheme.scss @@ -0,0 +1,7 @@ +// scss-docs-start mixin-color-scheme +@mixin color-scheme($name) { + @media (prefers-color-scheme: #{$name}) { + @content; + } +} +// scss-docs-end mixin-color-scheme diff --git a/vendor/twbs/bootstrap/scss/mixins/_container.scss b/vendor/twbs/bootstrap/scss/mixins/_container.scss new file mode 100644 index 000000000..ee6044d0d --- /dev/null +++ b/vendor/twbs/bootstrap/scss/mixins/_container.scss @@ -0,0 +1,9 @@ +// Container mixins + +@mixin make-container($gutter: $container-padding-x) { + width: 100%; + padding-right: var(--#{$variable-prefix}gutter-x, #{$gutter}); + padding-left: var(--#{$variable-prefix}gutter-x, #{$gutter}); + margin-right: auto; + margin-left: auto; +} diff --git a/vendor/twbs/bootstrap/scss/mixins/_grid.scss b/vendor/twbs/bootstrap/scss/mixins/_grid.scss index d757eac74..ff6941c46 100644 --- a/vendor/twbs/bootstrap/scss/mixins/_grid.scss +++ b/vendor/twbs/bootstrap/scss/mixins/_grid.scss @@ -1,4 +1,4 @@ -/// Grid system +// Grid system // // Generate semantic grid columns with these mixins. @@ -8,8 +8,8 @@ display: flex; flex-wrap: wrap; margin-top: calc(var(--#{$variable-prefix}gutter-y) * -1); // stylelint-disable-line function-disallowed-list - margin-right: calc(var(--#{$variable-prefix}gutter-x) / -2); // stylelint-disable-line function-disallowed-list - margin-left: calc(var(--#{$variable-prefix}gutter-x) / -2); // stylelint-disable-line function-disallowed-list + margin-right: calc(var(--#{$variable-prefix}gutter-x) * -.5); // stylelint-disable-line function-disallowed-list + margin-left: calc(var(--#{$variable-prefix}gutter-x) * -.5); // stylelint-disable-line function-disallowed-list } @mixin make-col-ready($gutter: $grid-gutter-width) { @@ -21,15 +21,16 @@ flex-shrink: 0; width: 100%; max-width: 100%; // Prevent `.col-auto`, `.col` (& responsive variants) from breaking out the grid - padding-right: calc(var(--#{$variable-prefix}gutter-x) / 2); // stylelint-disable-line function-disallowed-list - padding-left: calc(var(--#{$variable-prefix}gutter-x) / 2); // stylelint-disable-line function-disallowed-list + padding-right: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list + padding-left: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list margin-top: var(--#{$variable-prefix}gutter-y); } @mixin make-col($size: false, $columns: $grid-columns) { @if $size { flex: 0 0 auto; - width: percentage($size / $columns); + width: percentage(divide($size, $columns)); + } @else { flex: 1 1 0; max-width: 100%; @@ -42,7 +43,7 @@ } @mixin make-col-offset($size, $columns: $grid-columns) { - $num: $size / $columns; + $num: divide($size, $columns); margin-left: if($num == 0, 0, percentage($num)); } @@ -54,7 +55,7 @@ @mixin row-cols($count) { > * { flex: 0 0 auto; - width: 100% / $count; + width: divide(100%, $count); } } @@ -65,8 +66,8 @@ @mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) { @each $breakpoint in map-keys($breakpoints) { + // .row-cols defaults must all appear before .col overrides so they can be overridden. $infix: breakpoint-infix($breakpoint, $breakpoints); - @include media-breakpoint-up($breakpoint, $breakpoints) { // Provide basic `.col-{bp}` classes for equal-width flexbox columns .col#{$infix} { @@ -84,7 +85,13 @@ } } } + } + } + @each $breakpoint in map-keys($breakpoints) { + $infix: breakpoint-infix($breakpoint, $breakpoints); + + @include media-breakpoint-up($breakpoint, $breakpoints) { .col#{$infix}-auto { @include make-col-auto(); } diff --git a/vendor/twbs/bootstrap/scss/mixins/_table-variants.scss b/vendor/twbs/bootstrap/scss/mixins/_table-variants.scss new file mode 100644 index 000000000..9fd0fb02a --- /dev/null +++ b/vendor/twbs/bootstrap/scss/mixins/_table-variants.scss @@ -0,0 +1,21 @@ +// scss-docs-start table-variant +@mixin table-variant($state, $background) { + .table-#{$state} { + $color: color-contrast(opaque($body-bg, $background)); + $hover-bg: mix($color, $background, percentage($table-hover-bg-factor)); + $striped-bg: mix($color, $background, percentage($table-striped-bg-factor)); + $active-bg: mix($color, $background, percentage($table-active-bg-factor)); + + --#{$variable-prefix}table-bg: #{$background}; + --#{$variable-prefix}table-striped-bg: #{$striped-bg}; + --#{$variable-prefix}table-striped-color: #{color-contrast($striped-bg)}; + --#{$variable-prefix}table-active-bg: #{$active-bg}; + --#{$variable-prefix}table-active-color: #{color-contrast($active-bg)}; + --#{$variable-prefix}table-hover-bg: #{$hover-bg}; + --#{$variable-prefix}table-hover-color: #{color-contrast($hover-bg)}; + + color: $color; + border-color: mix($color, $background, percentage($table-border-factor)); + } +} +// scss-docs-end table-variant diff --git a/vendor/twbs/bootstrap/scss/mixins/_utilities.scss b/vendor/twbs/bootstrap/scss/mixins/_utilities.scss new file mode 100644 index 000000000..4d2370a0b --- /dev/null +++ b/vendor/twbs/bootstrap/scss/mixins/_utilities.scss @@ -0,0 +1,68 @@ +// Utility generator +// Used to generate utilities & print utilities +@mixin generate-utility($utility, $infix, $is-rfs-media-query: false) { + $values: map-get($utility, values); + + // If the values are a list or string, convert it into a map + @if type-of($values) == "string" or type-of(nth($values, 1)) != "list" { + $values: zip($values, $values); + } + + @each $key, $value in $values { + $properties: map-get($utility, property); + + // Multiple properties are possible, for example with vertical or horizontal margins or paddings + @if type-of($properties) == "string" { + $properties: append((), $properties); + } + + // Use custom class if present + $property-class: if(map-has-key($utility, class), map-get($utility, class), nth($properties, 1)); + $property-class: if($property-class == null, "", $property-class); + + // State params to generate pseudo-classes + $state: if(map-has-key($utility, state), map-get($utility, state), ()); + + $infix: if($property-class == "" and str-slice($infix, 1, 1) == "-", str-slice($infix, 2), $infix); + + // Don't prefix if value key is null (eg. with shadow class) + $property-class-modifier: if($key, if($property-class == "" and $infix == "", "", "-") + $key, ""); + + @if map-get($utility, rfs) { + // Inside the media query + @if $is-rfs-media-query { + $val: rfs-value($value); + + // Do not render anything if fluid and non fluid values are the same + $value: if($val == rfs-fluid-value($value), null, $val); + } + @else { + $value: rfs-fluid-value($value); + } + } + + $is-rtl: map-get($utility, rtl); + + @if $value != null { + @if $is-rtl == false { + /* rtl:begin:remove */ + } + .#{$property-class + $infix + $property-class-modifier} { + @each $property in $properties { + #{$property}: $value if($enable-important-utilities, !important, null); + } + } + + @each $pseudo in $state { + .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} { + @each $property in $properties { + #{$property}: $value if($enable-important-utilities, !important, null); + } + } + } + @if $is-rtl == false { + /* rtl:end:remove */ + } + } + } +} diff --git a/vendor/twbs/bootstrap/scss/mixins/_visually-hidden.scss b/vendor/twbs/bootstrap/scss/mixins/_visually-hidden.scss new file mode 100644 index 000000000..ed7bc9c13 --- /dev/null +++ b/vendor/twbs/bootstrap/scss/mixins/_visually-hidden.scss @@ -0,0 +1,29 @@ +// stylelint-disable declaration-no-important + +// Hide content visually while keeping it accessible to assistive technologies +// +// See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/ +// See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/ + +@mixin visually-hidden() { + position: absolute !important; + width: 1px !important; + height: 1px !important; + padding: 0 !important; + margin: -1px !important; // Fix for https://github.com/twbs/bootstrap/issues/25686 + overflow: hidden !important; + clip: rect(0, 0, 0, 0) !important; + white-space: nowrap !important; + border: 0 !important; +} + +// Use to only display content when it's focused, or one of its child elements is focused +// (i.e. when focus is within the element/container that the class was applied to) +// +// Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1 + +@mixin visually-hidden-focusable() { + &:not(:focus):not(:focus-within) { + @include visually-hidden(); + } +} diff --git a/vendor/twbs/bootstrap/scss/utilities/_api.scss b/vendor/twbs/bootstrap/scss/utilities/_api.scss new file mode 100644 index 000000000..62e1d398e --- /dev/null +++ b/vendor/twbs/bootstrap/scss/utilities/_api.scss @@ -0,0 +1,47 @@ +// Loop over each breakpoint +@each $breakpoint in map-keys($grid-breakpoints) { + + // Generate media query if needed + @include media-breakpoint-up($breakpoint) { + $infix: breakpoint-infix($breakpoint, $grid-breakpoints); + + // Loop over each utility property + @each $key, $utility in $utilities { + // The utility can be disabled with `false`, thus check if the utility is a map first + // Only proceed if responsive media queries are enabled or if it's the base media query + @if type-of($utility) == "map" and (map-get($utility, responsive) or $infix == "") { + @include generate-utility($utility, $infix); + } + } + } +} + +// RFS rescaling +@media (min-width: $rfs-mq-value) { + @each $breakpoint in map-keys($grid-breakpoints) { + $infix: breakpoint-infix($breakpoint, $grid-breakpoints); + + @if (map-get($grid-breakpoints, $breakpoint) < $rfs-breakpoint) { + // Loop over each utility property + @each $key, $utility in $utilities { + // The utility can be disabled with `false`, thus check if the utility is a map first + // Only proceed if responsive media queries are enabled or if it's the base media query + @if type-of($utility) == "map" and map-get($utility, rfs) and (map-get($utility, responsive) or $infix == "") { + @include generate-utility($utility, $infix, true); + } + } + } + } +} + + +// Print utilities +@media print { + @each $key, $utility in $utilities { + // The utility can be disabled with `false`, thus check if the utility is a map first + // Then check if the utility needs print styles + @if type-of($utility) == "map" and map-get($utility, print) == true { + @include generate-utility($utility, "-print"); + } + } +} diff --git a/vendor/twbs/bootstrap/scss/vendor/_rfs.scss b/vendor/twbs/bootstrap/scss/vendor/_rfs.scss index 798753ecb..7e9a6c7a8 100644 --- a/vendor/twbs/bootstrap/scss/vendor/_rfs.scss +++ b/vendor/twbs/bootstrap/scss/vendor/_rfs.scss @@ -4,7 +4,7 @@ // // Automated responsive values for font sizes, paddings, margins and much more // -// Licensed under MIT (https://github.com/twbs/rfs/blob/master/LICENSE) +// Licensed under MIT (https://github.com/twbs/rfs/blob/main/LICENSE) // Configuration @@ -52,12 +52,54 @@ $enable-rfs: true !default; // Cache $rfs-base-value unit $rfs-base-value-unit: unit($rfs-base-value); +@function divide($dividend, $divisor, $precision: 10) { + $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1); + $dividend: abs($dividend); + $divisor: abs($divisor); + @if $dividend == 0 { + @return 0; + } + @if $divisor == 0 { + @error "Cannot divide by 0"; + } + $remainder: $dividend; + $result: 0; + $factor: 10; + @while ($remainder > 0 and $precision >= 0) { + $quotient: 0; + @while ($remainder >= $divisor) { + $remainder: $remainder - $divisor; + $quotient: $quotient + 1; + } + $result: $result * 10 + $quotient; + $factor: $factor * .1; + $remainder: $remainder * 10; + $precision: $precision - 1; + @if ($precision < 0 and $remainder >= $divisor * 5) { + $result: $result + 1; + } + } + $result: $result * $factor * $sign; + $dividend-unit: unit($dividend); + $divisor-unit: unit($divisor); + $unit-map: ( + "px": 1px, + "rem": 1rem, + "em": 1em, + "%": 1% + ); + @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) { + $result: $result * map-get($unit-map, $dividend-unit); + } + @return $result; +} + // Remove px-unit from $rfs-base-value for calculations @if $rfs-base-value-unit == px { - $rfs-base-value: $rfs-base-value / ($rfs-base-value * 0 + 1); + $rfs-base-value: divide($rfs-base-value, $rfs-base-value * 0 + 1); } @else if $rfs-base-value-unit == rem { - $rfs-base-value: $rfs-base-value / ($rfs-base-value * 0 + 1 / $rfs-rem-value); + $rfs-base-value: divide($rfs-base-value, divide($rfs-base-value * 0 + 1, $rfs-rem-value)); } // Cache $rfs-breakpoint unit to prevent multiple calls @@ -65,14 +107,14 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint); // Remove unit from $rfs-breakpoint for calculations @if $rfs-breakpoint-unit-cache == px { - $rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1); + $rfs-breakpoint: divide($rfs-breakpoint, $rfs-breakpoint * 0 + 1); } @else if $rfs-breakpoint-unit-cache == rem or $rfs-breakpoint-unit-cache == "em" { - $rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1 / $rfs-rem-value); + $rfs-breakpoint: divide($rfs-breakpoint, divide($rfs-breakpoint * 0 + 1, $rfs-rem-value)); } // Calculate the media query value -$rfs-mq-value: if($rfs-breakpoint-unit == px, #{$rfs-breakpoint}px, #{$rfs-breakpoint / $rfs-rem-value}#{$rfs-breakpoint-unit}); +$rfs-mq-value: if($rfs-breakpoint-unit == px, #{$rfs-breakpoint}px, #{divide($rfs-breakpoint, $rfs-rem-value)}#{$rfs-breakpoint-unit}); $rfs-mq-property-width: if($rfs-mode == max-media-query, max-width, min-width); $rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height); @@ -164,11 +206,11 @@ $rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height @if $unit == px { // Convert to rem if needed - $val: $val + ' ' + if($rfs-unit == rem, #{$value / ($value * 0 + $rfs-rem-value)}rem, $value); + $val: $val + ' ' + if($rfs-unit == rem, #{divide($value, $value * 0 + $rfs-rem-value)}rem, $value); } @else if $unit == rem { // Convert to px if needed - $val: $val + ' ' + if($rfs-unit == px, #{$value / ($value * 0 + 1) * $rfs-rem-value}px, $value); + $val: $val + ' ' + if($rfs-unit == px, #{divide($value, $value * 0 + 1) * $rfs-rem-value}px, $value); } @else { // If $value isn't a number (like inherit) or $value has a unit (not px or rem, like 1.5em) or $ is 0, just print the value @@ -205,21 +247,21 @@ $rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height @else { // Remove unit from $value for calculations - $value: $value / ($value * 0 + if($unit == px, 1, 1 / $rfs-rem-value)); + $value: divide($value, $value * 0 + if($unit == px, 1, divide(1, $rfs-rem-value))); // Only add the media query if the value is greater than the minimum value @if abs($value) <= $rfs-base-value or not $enable-rfs { - $val: $val + ' ' + if($rfs-unit == rem, #{$value / $rfs-rem-value}rem, #{$value}px); + $val: $val + ' ' + if($rfs-unit == rem, #{divide($value, $rfs-rem-value)}rem, #{$value}px); } @else { // Calculate the minimum value - $value-min: $rfs-base-value + (abs($value) - $rfs-base-value) / $rfs-factor; + $value-min: $rfs-base-value + divide(abs($value) - $rfs-base-value, $rfs-factor); // Calculate difference between $value and the minimum value $value-diff: abs($value) - $value-min; // Base value formatting - $min-width: if($rfs-unit == rem, #{$value-min / $rfs-rem-value}rem, #{$value-min}px); + $min-width: if($rfs-unit == rem, #{divide($value-min, $rfs-rem-value)}rem, #{$value-min}px); // Use negative value if needed $min-width: if($value < 0, -$min-width, $min-width); @@ -228,7 +270,7 @@ $rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height $variable-unit: if($rfs-two-dimensional, vmin, vw); // Calculate the variable width between 0 and $rfs-breakpoint - $variable-width: #{$value-diff * 100 / $rfs-breakpoint}#{$variable-unit}; + $variable-width: #{divide($value-diff * 100, $rfs-breakpoint)}#{$variable-unit}; // Return the calculated value $val: $val + ' calc(' + $min-width + if($value < 0, ' - ', ' + ') + $variable-width + ')'; |