update to bootstrap v4.6
This commit is contained in:
parent
9c3310b85d
commit
986d18016e
|
@ -1,3 +1,5 @@
|
|||
// assets/css/style.scss is where Jekyll loads the main stylesheet
|
||||
|
||||
$grid-breakpoints: (
|
||||
xs: 0,
|
||||
sm: 576px,
|
||||
|
|
|
@ -34,6 +34,7 @@
|
|||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 2;
|
||||
padding: $alert-padding-y $alert-padding-x;
|
||||
color: inherit;
|
||||
}
|
||||
|
|
|
@ -15,7 +15,7 @@
|
|||
padding-left: $breadcrumb-item-padding;
|
||||
|
||||
&::before {
|
||||
display: inline-block; // Suppress underlining of the separator in modern browsers
|
||||
float: left; // Suppress inline spacings and underlining of the separator
|
||||
padding-right: $breadcrumb-item-padding;
|
||||
color: $breadcrumb-divider-color;
|
||||
content: escape-svg($breadcrumb-divider);
|
||||
|
|
|
@ -10,9 +10,9 @@
|
|||
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;
|
||||
cursor: if($enable-pointer-cursor-for-buttons, pointer, null);
|
||||
user-select: none;
|
||||
background-color: transparent;
|
||||
border: $btn-border-width solid transparent;
|
||||
|
@ -37,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);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -89,7 +93,6 @@ fieldset:disabled a.btn {
|
|||
&:focus,
|
||||
&.focus {
|
||||
text-decoration: $link-hover-decoration;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&:disabled,
|
||||
|
|
|
@ -19,16 +19,26 @@
|
|||
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);
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-bottom-width: 0;
|
||||
@include border-bottom-radius($card-inner-border-radius);
|
||||
}
|
||||
}
|
||||
|
||||
> .list-group:last-child {
|
||||
.list-group-item:last-child {
|
||||
@include border-bottom-radius($card-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;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -80,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;
|
||||
|
||||
|
@ -123,6 +128,7 @@
|
|||
bottom: 0;
|
||||
left: 0;
|
||||
padding: $card-img-overlay-padding;
|
||||
@include border-radius($card-inner-border-radius);
|
||||
}
|
||||
|
||||
.card-img,
|
||||
|
@ -200,12 +206,12 @@
|
|||
|
||||
.card-img-top,
|
||||
.card-header {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
.card-img-bottom,
|
||||
.card-footer {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
}
|
||||
|
@ -215,12 +221,12 @@
|
|||
|
||||
.card-img-top,
|
||||
.card-header {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
.card-img-bottom,
|
||||
.card-footer {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
}
|
||||
|
@ -258,6 +264,8 @@
|
|||
//
|
||||
|
||||
.accordion {
|
||||
overflow-anchor: none;
|
||||
|
||||
> .card {
|
||||
overflow: hidden;
|
||||
|
||||
|
|
|
@ -127,7 +127,7 @@
|
|||
display: inline-block;
|
||||
width: $carousel-control-icon-width;
|
||||
height: $carousel-control-icon-width;
|
||||
background: no-repeat 50% / 100% 100%;
|
||||
background: 50% / 100% 100% no-repeat;
|
||||
}
|
||||
.carousel-control-prev-icon {
|
||||
background-image: escape-svg($carousel-control-prev-icon-bg);
|
||||
|
|
|
@ -30,7 +30,6 @@ button.close {
|
|||
padding: 0;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
appearance: none;
|
||||
}
|
||||
|
||||
// Future-proof disabling of clicks on `<a>` elements
|
||||
|
|
|
@ -9,9 +9,11 @@
|
|||
|
||||
.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;
|
||||
color-adjust: exact; // Keep themed appearance for print
|
||||
}
|
||||
|
||||
.custom-control-inline {
|
||||
|
@ -37,7 +39,7 @@
|
|||
&:focus ~ .custom-control-label::before {
|
||||
// the mixin is not used here to make sure there is feedback
|
||||
@if $enable-shadows {
|
||||
box-shadow: $input-box-shadow, $input-focus-box-shadow;
|
||||
box-shadow: $input-box-shadow, $custom-control-indicator-focus-box-shadow;
|
||||
} @else {
|
||||
box-shadow: $custom-control-indicator-focus-box-shadow;
|
||||
}
|
||||
|
@ -102,7 +104,7 @@
|
|||
width: $custom-control-indicator-size;
|
||||
height: $custom-control-indicator-size;
|
||||
content: "";
|
||||
background: no-repeat 50% / #{$custom-control-indicator-bg-size};
|
||||
background: 50% / #{$custom-control-indicator-bg-size} no-repeat;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -135,10 +137,10 @@
|
|||
|
||||
.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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -149,7 +151,7 @@
|
|||
|
||||
.custom-radio {
|
||||
.custom-control-label::before {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-radius: $custom-radio-indicator-border-radius;
|
||||
}
|
||||
|
||||
|
@ -161,7 +163,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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -179,7 +181,7 @@
|
|||
left: -($custom-switch-width + $custom-control-gutter);
|
||||
width: $custom-switch-width;
|
||||
pointer-events: all;
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-radius: $custom-switch-indicator-border-radius;
|
||||
}
|
||||
|
||||
|
@ -189,7 +191,7 @@
|
|||
width: $custom-switch-indicator-size;
|
||||
height: $custom-switch-indicator-size;
|
||||
background-color: $custom-control-indicator-border-color;
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-radius: $custom-switch-indicator-border-radius;
|
||||
@include transition(transform .15s ease-in-out, $custom-forms-transition);
|
||||
}
|
||||
|
@ -204,7 +206,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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -237,8 +239,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;
|
||||
}
|
||||
|
||||
|
@ -312,6 +315,7 @@
|
|||
width: 100%;
|
||||
height: $custom-file-height;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
opacity: 0;
|
||||
|
||||
&:focus ~ .custom-file-label {
|
||||
|
@ -344,6 +348,7 @@
|
|||
z-index: 1;
|
||||
height: $custom-file-height;
|
||||
padding: $custom-file-padding-y $custom-file-padding-x;
|
||||
overflow: hidden;
|
||||
font-family: $custom-file-font-family;
|
||||
font-weight: $custom-file-font-weight;
|
||||
line-height: $custom-file-line-height;
|
||||
|
@ -385,7 +390,7 @@
|
|||
appearance: none;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
outline: 0;
|
||||
|
||||
// Pseudo-elements must be split across multiple rulesets to have an effect.
|
||||
// No box-shadow() mixin for focus accessibility.
|
||||
|
|
|
@ -22,7 +22,7 @@
|
|||
display: none; // none by default, but block on "open" of the menu
|
||||
float: left;
|
||||
min-width: $dropdown-min-width;
|
||||
padding: $dropdown-padding-y 0;
|
||||
padding: $dropdown-padding-y $dropdown-padding-x;
|
||||
margin: $dropdown-spacer 0 0; // override default ul
|
||||
@include font-size($dropdown-font-size);
|
||||
color: $dropdown-color;
|
||||
|
@ -100,7 +100,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
// When enabled Popper.js, reset basic dropdown position
|
||||
// When Popper is enabled, reset the basic dropdown position
|
||||
// stylelint-disable-next-line no-duplicate-selectors
|
||||
.dropdown-menu {
|
||||
&[x-placement^="top"],
|
||||
|
@ -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
|
||||
|
@ -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;
|
||||
|
|
|
@ -59,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
|
||||
|
|
|
@ -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}.";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -49,10 +51,18 @@
|
|||
}
|
||||
|
||||
// See https://codepen.io/kevinweber/pen/dXWoRw
|
||||
//
|
||||
// Requires the use of quotes around data URIs.
|
||||
|
||||
@function escape-svg($string) {
|
||||
@if str-index($string, "data:image/svg+xml") {
|
||||
@each $char, $encoded in $escaped-characters {
|
||||
$string: str-replace($string, $char, $encoded);
|
||||
// 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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -4,11 +4,7 @@
|
|||
|
||||
@if $enable-grid-classes {
|
||||
// Single container class with breakpoint max-widths
|
||||
.container {
|
||||
@include make-container();
|
||||
@include make-container-max-widths();
|
||||
}
|
||||
|
||||
.container,
|
||||
// 100% wide container at all breakpoints
|
||||
.container-fluid {
|
||||
@include make-container();
|
||||
|
@ -25,11 +21,19 @@
|
|||
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 ($container-max-width > $width or $breakpoint == $name) {
|
||||
@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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -16,7 +16,8 @@
|
|||
> .custom-select,
|
||||
> .custom-file {
|
||||
position: relative; // For focus state's z-index
|
||||
flex: 1 1 0%;
|
||||
flex: 1 1 auto;
|
||||
width: 1%;
|
||||
min-width: 0; // https://stackoverflow.com/questions/36247140/why-dont-flex-items-shrink-past-content-size
|
||||
margin-bottom: 0;
|
||||
|
||||
|
@ -41,7 +42,6 @@
|
|||
|
||||
> .form-control,
|
||||
> .custom-select {
|
||||
&:not(:last-child) { @include border-right-radius(0); }
|
||||
&:not(:first-child) { @include border-left-radius(0); }
|
||||
}
|
||||
|
||||
|
@ -52,9 +52,24 @@
|
|||
align-items: center;
|
||||
|
||||
&:not(:last-child) .custom-file-label,
|
||||
&:not(:last-child) .custom-file-label::after { @include border-right-radius(0); }
|
||||
&:not(:first-child) .custom-file-label { @include border-left-radius(0); }
|
||||
}
|
||||
|
||||
&:not(.has-validation) {
|
||||
> .form-control:not(:last-child),
|
||||
> .custom-select:not(:last-child),
|
||||
> .custom-file:not(:last-child) .custom-file-label::after {
|
||||
@include border-right-radius(0);
|
||||
}
|
||||
}
|
||||
|
||||
&.has-validation {
|
||||
> .form-control:nth-last-child(n + 3),
|
||||
> .custom-select:nth-last-child(n + 3),
|
||||
> .custom-file:nth-last-child(n + 3) .custom-file-label::after {
|
||||
@include border-right-radius(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
@ -174,8 +189,10 @@
|
|||
|
||||
.input-group > .input-group-prepend > .btn,
|
||||
.input-group > .input-group-prepend > .input-group-text,
|
||||
.input-group > .input-group-append:not(:last-child) > .btn,
|
||||
.input-group > .input-group-append:not(:last-child) > .input-group-text,
|
||||
.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .btn,
|
||||
.input-group:not(.has-validation) > .input-group-append:not(:last-child) > .input-group-text,
|
||||
.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .btn,
|
||||
.input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .input-group-text,
|
||||
.input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle),
|
||||
.input-group > .input-group-append:last-child > .input-group-text:not(:last-child) {
|
||||
@include border-right-radius(0);
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
|
||||
|
||||
|
@ -46,15 +47,16 @@
|
|||
display: block;
|
||||
padding: $list-group-item-padding-y $list-group-item-padding-x;
|
||||
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 {
|
||||
@include border-bottom-radius($list-group-border-radius);
|
||||
@include border-bottom-radius(inherit);
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
|
@ -94,7 +96,7 @@
|
|||
.list-group-horizontal#{$infix} {
|
||||
flex-direction: row;
|
||||
|
||||
.list-group-item {
|
||||
> .list-group-item {
|
||||
&:first-child {
|
||||
@include border-bottom-left-radius($list-group-border-radius);
|
||||
@include border-top-right-radius(0);
|
||||
|
@ -109,7 +111,7 @@
|
|||
margin-top: 0;
|
||||
}
|
||||
|
||||
& + .list-group-item {
|
||||
+ .list-group-item {
|
||||
border-top-width: $list-group-border-width;
|
||||
border-left-width: 0;
|
||||
|
||||
|
@ -130,18 +132,12 @@
|
|||
// useful within other components (e.g., cards).
|
||||
|
||||
.list-group-flush {
|
||||
.list-group-item {
|
||||
border-right-width: 0;
|
||||
border-left-width: 0;
|
||||
@include border-radius(0);
|
||||
@include border-radius(0);
|
||||
|
||||
&:first-child {
|
||||
border-top-width: 0;
|
||||
}
|
||||
}
|
||||
> .list-group-item {
|
||||
border-width: 0 0 $list-group-border-width;
|
||||
|
||||
&:last-child {
|
||||
.list-group-item:last-child {
|
||||
&:last-child {
|
||||
border-bottom-width: 0;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -83,6 +83,7 @@
|
|||
&::before {
|
||||
display: block; // IE10
|
||||
height: subtract(100vh, $modal-dialog-margin * 2);
|
||||
height: min-content; // Reset height to 0 except on IE
|
||||
content: "";
|
||||
}
|
||||
|
||||
|
@ -181,7 +182,6 @@
|
|||
// 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
|
||||
// stylelint-disable-next-line selector-max-universal
|
||||
> * {
|
||||
margin: $modal-footer-margin-between / 2;
|
||||
}
|
||||
|
@ -217,6 +217,7 @@
|
|||
|
||||
&::before {
|
||||
height: subtract(100vh, $modal-dialog-margin-y-sm-up * 2);
|
||||
height: min-content;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -14,6 +14,7 @@
|
|||
.nav-link {
|
||||
display: block;
|
||||
padding: $nav-link-padding-y $nav-link-padding-x;
|
||||
text-decoration: if($link-decoration == none, null, none);
|
||||
|
||||
@include hover-focus() {
|
||||
text-decoration: none;
|
||||
|
@ -34,11 +35,8 @@
|
|||
.nav-tabs {
|
||||
border-bottom: $nav-tabs-border-width solid $nav-tabs-border-color;
|
||||
|
||||
.nav-item {
|
||||
margin-bottom: -$nav-tabs-border-width;
|
||||
}
|
||||
|
||||
.nav-link {
|
||||
margin-bottom: -$nav-tabs-border-width;
|
||||
border: $nav-tabs-border-width solid transparent;
|
||||
@include border-top-radius($nav-tabs-border-radius);
|
||||
|
||||
|
@ -91,6 +89,7 @@
|
|||
//
|
||||
|
||||
.nav-fill {
|
||||
> .nav-link,
|
||||
.nav-item {
|
||||
flex: 1 1 auto;
|
||||
text-align: center;
|
||||
|
@ -98,6 +97,7 @@
|
|||
}
|
||||
|
||||
.nav-justified {
|
||||
> .nav-link,
|
||||
.nav-item {
|
||||
flex-basis: 0;
|
||||
flex-grow: 1;
|
||||
|
|
|
@ -136,8 +136,12 @@
|
|||
height: 1.5em;
|
||||
vertical-align: middle;
|
||||
content: "";
|
||||
background: no-repeat center center;
|
||||
background-size: 100% 100%;
|
||||
background: 50% / 100% 100% no-repeat;
|
||||
}
|
||||
|
||||
.navbar-nav-scroll {
|
||||
max-height: $navbar-nav-scroll-max-height;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
// Generate series of `.navbar-expand-*` responsive classes for configuring
|
||||
|
@ -199,6 +203,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
.navbar-nav-scroll {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.navbar-collapse {
|
||||
display: flex !important; // stylelint-disable-line declaration-no-important
|
||||
|
||||
|
|
|
@ -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;
|
||||
|
||||
|
@ -65,9 +66,9 @@
|
|||
//
|
||||
|
||||
.pagination-lg {
|
||||
@include pagination-size($pagination-padding-y-lg, $pagination-padding-x-lg, $font-size-lg, $line-height-lg, $border-radius-lg);
|
||||
@include pagination-size($pagination-padding-y-lg, $pagination-padding-x-lg, $font-size-lg, $line-height-lg, $pagination-border-radius-lg);
|
||||
}
|
||||
|
||||
.pagination-sm {
|
||||
@include pagination-size($pagination-padding-y-sm, $pagination-padding-x-sm, $font-size-sm, $line-height-sm, $border-radius-sm);
|
||||
@include pagination-size($pagination-padding-y-sm, $pagination-padding-x-sm, $font-size-sm, $line-height-sm, $pagination-border-radius-sm);
|
||||
}
|
||||
|
|
|
@ -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);
|
||||
|
@ -35,7 +36,7 @@
|
|||
|
||||
@if $enable-transitions {
|
||||
.progress-bar-animated {
|
||||
animation: progress-bar-stripes $progress-bar-animation-timing;
|
||||
animation: $progress-bar-animation-timing progress-bar-stripes;
|
||||
|
||||
@if $enable-prefers-reduced-motion-media-query {
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
// stylelint-disable at-rule-no-vendor-prefix, declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix
|
||||
// stylelint-disable declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix
|
||||
|
||||
// Reboot
|
||||
//
|
||||
|
@ -199,7 +199,7 @@ a {
|
|||
// causes specificity issues in many other styles that are too complex to fix.
|
||||
// See https://github.com/twbs/bootstrap/issues/19402
|
||||
|
||||
a:not([href]) {
|
||||
a:not([href]):not([class]) {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
|
||||
|
@ -229,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;
|
||||
}
|
||||
|
||||
|
||||
|
@ -275,10 +278,14 @@ caption {
|
|||
caption-side: bottom;
|
||||
}
|
||||
|
||||
// 1. Removes font-weight bold by inheriting
|
||||
// 2. Matches default `<td>` alignment by inheriting `text-align`.
|
||||
// 3. Fix alignment for Safari
|
||||
|
||||
th {
|
||||
// Matches default `<td>` alignment by inheriting from the `<body>`, or the
|
||||
// closest parent with a set `text-align`.
|
||||
text-align: inherit;
|
||||
font-weight: $table-th-font-weight; // 1
|
||||
text-align: inherit; // 2
|
||||
text-align: -webkit-match-parent; // 3
|
||||
}
|
||||
|
||||
|
||||
|
@ -296,17 +303,17 @@ label {
|
|||
//
|
||||
// Details at https://github.com/twbs/bootstrap/issues/24093
|
||||
button {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
// Work around a Firefox/IE bug where the transparent `button` background
|
||||
// results in a loss of the default `button` focus styles.
|
||||
//
|
||||
// Credit: https://github.com/suitcss/base/
|
||||
button:focus {
|
||||
outline: 1px dotted;
|
||||
outline: 5px auto -webkit-focus-ring-color;
|
||||
// Explicitly remove focus outline in Chromium when it shouldn't be
|
||||
// visible (e.g. as result of mouse click or touch tap). It already
|
||||
// should be doing this automatically, but seems to currently be
|
||||
// confused and applies its very visible two-tone outline anyway.
|
||||
|
||||
button:focus:not(:focus-visible) {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
input,
|
||||
|
@ -330,6 +337,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
|
||||
|
@ -376,18 +390,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.
|
||||
|
|
|
@ -1,4 +1,3 @@
|
|||
// Do not forget to update getting-started/theming.md!
|
||||
:root {
|
||||
// Custom variable values only support SassScript inside `#{}`.
|
||||
@each $color, $value in $colors {
|
||||
|
|
|
@ -13,9 +13,9 @@
|
|||
vertical-align: text-bottom;
|
||||
border: $spinner-border-width solid currentColor;
|
||||
border-right-color: transparent;
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-radius: 50%;
|
||||
animation: spinner-border .75s linear infinite;
|
||||
animation: .75s linear infinite spinner-border;
|
||||
}
|
||||
|
||||
.spinner-border-sm {
|
||||
|
@ -34,6 +34,7 @@
|
|||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -43,13 +44,22 @@
|
|||
height: $spinner-height;
|
||||
vertical-align: text-bottom;
|
||||
background-color: currentColor;
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
// stylelint-disable-next-line property-disallowed-list
|
||||
border-radius: 50%;
|
||||
opacity: 0;
|
||||
animation: spinner-grow .75s linear infinite;
|
||||
animation: .75s linear infinite spinner-grow;
|
||||
}
|
||||
|
||||
.spinner-grow-sm {
|
||||
width: $spinner-width-sm;
|
||||
height: $spinner-height-sm;
|
||||
}
|
||||
|
||||
@if $enable-prefers-reduced-motion-media-query {
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.spinner-border,
|
||||
.spinner-grow {
|
||||
animation-duration: 1.5s;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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 {
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
// stylelint-disable declaration-no-important, selector-list-comma-newline-after
|
||||
// stylelint-disable selector-list-comma-newline-after
|
||||
|
||||
//
|
||||
// Headings
|
||||
|
|
|
@ -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";
|
||||
|
|
|
@ -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,
|
||||
|
@ -103,9 +100,11 @@ $yiq-text-light: $white !default;
|
|||
|
||||
// Characters which are escaped by the escape-svg function
|
||||
$escaped-characters: (
|
||||
("<","%3c"),
|
||||
(">","%3e"),
|
||||
("#","%23"),
|
||||
("<", "%3c"),
|
||||
(">", "%3e"),
|
||||
("#", "%23"),
|
||||
("(", "%28"),
|
||||
(")", "%29"),
|
||||
) !default;
|
||||
|
||||
|
||||
|
@ -136,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,
|
||||
|
@ -151,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%,
|
||||
|
@ -262,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),
|
||||
|
@ -278,7 +274,7 @@ $embed-responsive-aspect-ratios: join(
|
|||
// Font, line-height, and color for body text, headings, and more.
|
||||
|
||||
// stylelint-disable value-keyword-case
|
||||
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
|
||||
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
|
||||
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
|
||||
$font-family-base: $font-family-sans-serif !default;
|
||||
// stylelint-enable value-keyword-case
|
||||
|
@ -367,6 +363,7 @@ $table-border-color: $border-color !default;
|
|||
|
||||
$table-head-bg: $gray-200 !default;
|
||||
$table-head-color: $gray-700 !default;
|
||||
$table-th-font-weight: null !default;
|
||||
|
||||
$table-dark-color: $white !default;
|
||||
$table-dark-bg: $gray-800 !default;
|
||||
|
@ -544,7 +541,7 @@ $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;
|
||||
|
@ -552,7 +549,7 @@ $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;
|
||||
|
@ -561,7 +558,7 @@ $custom-checkbox-indicator-icon-checked: url("data:image/svg+xml,<svg xml
|
|||
$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: 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: none !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;
|
||||
|
@ -586,7 +583,7 @@ $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: 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-background: escape-svg($custom-select-indicator) right $custom-select-padding-x center / $custom-select-bg-size no-repeat !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
|
||||
|
||||
$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;
|
||||
|
@ -666,7 +663,6 @@ $form-feedback-icon-invalid-color: $form-feedback-invalid-color !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": (
|
||||
|
@ -735,6 +731,8 @@ $navbar-toggler-padding-x: .75rem !default;
|
|||
$navbar-toggler-font-size: $font-size-lg !default;
|
||||
$navbar-toggler-border-radius: $btn-border-radius !default;
|
||||
|
||||
$navbar-nav-scroll-max-height: 75vh !default;
|
||||
|
||||
$navbar-dark-color: rgba($white, .5) !default;
|
||||
$navbar-dark-hover-color: rgba($white, .75) !default;
|
||||
$navbar-dark-active-color: $white !default;
|
||||
|
@ -760,6 +758,7 @@ $navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
|
|||
// Dropdown menu container and contents.
|
||||
|
||||
$dropdown-min-width: 10rem !default;
|
||||
$dropdown-padding-x: 0 !default;
|
||||
$dropdown-padding-y: .5rem !default;
|
||||
$dropdown-spacer: .125rem !default;
|
||||
$dropdown-font-size: $font-size-base !default;
|
||||
|
@ -775,17 +774,18 @@ $dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default;
|
|||
|
||||
$dropdown-link-color: $gray-900 !default;
|
||||
$dropdown-link-hover-color: darken($gray-900, 5%) !default;
|
||||
$dropdown-link-hover-bg: $gray-100 !default;
|
||||
$dropdown-link-hover-bg: $gray-200 !default;
|
||||
|
||||
$dropdown-link-active-color: $component-active-color !default;
|
||||
$dropdown-link-active-bg: $component-active-bg !default;
|
||||
|
||||
$dropdown-link-disabled-color: $gray-600 !default;
|
||||
$dropdown-link-disabled-color: $gray-500 !default;
|
||||
|
||||
$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
|
||||
|
@ -818,6 +818,8 @@ $pagination-disabled-color: $gray-600 !default;
|
|||
$pagination-disabled-bg: $white !default;
|
||||
$pagination-disabled-border-color: $gray-300 !default;
|
||||
|
||||
$pagination-border-radius-sm: $border-radius-sm !default;
|
||||
$pagination-border-radius-lg: $border-radius-lg !default;
|
||||
|
||||
// Jumbotron
|
||||
|
||||
|
@ -1135,6 +1137,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
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
/*!
|
||||
* Bootstrap Grid v4.4.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.6.0 (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)
|
||||
*/
|
||||
|
||||
html {
|
||||
|
@ -19,6 +19,7 @@ html {
|
|||
@import "functions";
|
||||
@import "variables";
|
||||
|
||||
@import "mixins/deprecate";
|
||||
@import "mixins/breakpoints";
|
||||
@import "mixins/grid-framework";
|
||||
@import "mixins/grid";
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
/*!
|
||||
* Bootstrap Reboot v4.4.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.6.0 (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)
|
||||
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
|
||||
*/
|
||||
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
/*!
|
||||
* Bootstrap v4.4.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.6.0 (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)
|
||||
*/
|
||||
|
||||
@import "functions";
|
||||
|
|
|
@ -15,8 +15,9 @@
|
|||
@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);
|
||||
}
|
||||
|
|
|
@ -1,9 +1,22 @@
|
|||
// stylelint-disable property-blacklist
|
||||
// stylelint-disable property-disallowed-list
|
||||
// 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);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -20,10 +20,10 @@
|
|||
color: color-yiq($hover-background);
|
||||
@include gradient-bg($hover-background);
|
||||
border-color: $hover-border;
|
||||
// Avoid using mixin so we can pass custom focus shadow properly
|
||||
@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);
|
||||
}
|
||||
}
|
||||
|
@ -51,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);
|
||||
}
|
||||
}
|
||||
|
@ -90,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);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -16,10 +16,10 @@
|
|||
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;
|
||||
}
|
||||
}
|
||||
|
@ -53,6 +53,7 @@
|
|||
.#{$state}-tooltip {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
z-index: 5;
|
||||
display: none;
|
||||
max-width: 100%; // Contain to parent when possible
|
||||
|
@ -63,6 +64,13 @@
|
|||
color: color-yiq($color);
|
||||
background-color: rgba($color, $form-feedback-tooltip-opacity);
|
||||
@include border-radius($form-feedback-tooltip-border-radius);
|
||||
|
||||
// See https://github.com/twbs/bootstrap/pull/31557
|
||||
// Align tooltip to form elements
|
||||
.form-row > .col > &,
|
||||
.form-row > [class*="col-"] > & {
|
||||
left: $form-grid-gutter-width / 2;
|
||||
}
|
||||
}
|
||||
|
||||
@include form-validation-state-selector($state) {
|
||||
|
@ -107,7 +115,7 @@
|
|||
|
||||
@if $enable-validation-icons {
|
||||
padding-right: $custom-select-feedback-icon-padding-right;
|
||||
background: $custom-select-background, escape-svg($icon) $custom-select-bg no-repeat $custom-select-feedback-icon-position / $custom-select-feedback-icon-size;
|
||||
background: $custom-select-background, $custom-select-bg escape-svg($icon) $custom-select-feedback-icon-position / $custom-select-feedback-icon-size no-repeat;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
|
|
@ -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;
|
||||
|
@ -34,9 +37,11 @@
|
|||
max-width: 100%;
|
||||
}
|
||||
|
||||
@for $i from 1 through $grid-row-columns {
|
||||
.row-cols#{$infix}-#{$i} {
|
||||
@include row-cols($i);
|
||||
@if $grid-row-columns > 0 {
|
||||
@for $i from 1 through $grid-row-columns {
|
||||
.row-cols#{$infix}-#{$i} {
|
||||
@include row-cols($i);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -44,9 +49,11 @@
|
|||
@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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -58,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);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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) {
|
||||
|
@ -62,7 +62,7 @@
|
|||
// 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;
|
||||
}
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
// Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,
|
||||
// but doesn't convert dppx=>dpi.
|
||||
// There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
|
||||
// Compatibility info: https://caniuse.com/#feat=css-media-resolution
|
||||
// Compatibility info: https://caniuse.com/css-media-resolution
|
||||
@media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
|
||||
only screen and (min-resolution: 2dppx) { // Standardized
|
||||
background-image: url($file-2x);
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
// Only display content to screen readers
|
||||
//
|
||||
// See: https://a11yproject.com/posts/how-to-hide-content/
|
||||
// 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 sr-only() {
|
||||
|
|
|
@ -1,16 +1,26 @@
|
|||
// stylelint-disable property-blacklist
|
||||
// stylelint-disable property-disallowed-list
|
||||
@mixin transition($transition...) {
|
||||
@if $enable-transitions {
|
||||
@if length($transition) == 0 {
|
||||
transition: $transition-base;
|
||||
} @else {
|
||||
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-prefers-reduced-motion-media-query {
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
transition: none;
|
||||
@if $enable-transitions {
|
||||
@if nth($transition, 1) != null {
|
||||
transition: $transition;
|
||||
}
|
||||
|
||||
@if $enable-prefers-reduced-motion-media-query and nth($transition, 1) != null and nth($transition, 1) != none {
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
@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);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
// stylelint-disable property-blacklist, declaration-no-important
|
||||
// stylelint-disable property-disallowed-list, declaration-no-important
|
||||
|
||||
//
|
||||
// Border
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
// stylelint-disable declaration-no-important
|
||||
|
||||
@each $value in $user-selects {
|
||||
.user-select-#{$value} { user-select: $value !important; }
|
||||
}
|
|
@ -63,8 +63,8 @@
|
|||
.text-decoration-none { text-decoration: none !important; }
|
||||
|
||||
.text-break {
|
||||
word-break: break-word !important; // IE & < Edge 18
|
||||
overflow-wrap: break-word !important;
|
||||
word-break: break-word !important; // Deprecated, but avoids issues with flex containers
|
||||
word-wrap: break-word !important; // Used instead of `overflow-wrap` for IE & Edge Legacy
|
||||
}
|
||||
|
||||
// Reset
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
---
|
||||
# this ensures Jekyll reads the file to be transformed into CSS later
|
||||
---
|
||||
|
||||
// Colors
|
||||
|
|
Loading…
Reference in New Issue