mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-21 04:41:36 +02:00
Merge branch 'main' into main-lmp-dark-theme-customization-full
This commit is contained in:
@@ -20,7 +20,6 @@
|
||||
--#{$prefix}accordion-btn-icon-transform: #{$accordion-icon-transform};
|
||||
--#{$prefix}accordion-btn-icon-transition: #{$accordion-icon-transition};
|
||||
--#{$prefix}accordion-btn-active-icon: #{escape-svg($accordion-button-active-icon)};
|
||||
--#{$prefix}accordion-btn-focus-border-color: #{$accordion-button-focus-border-color};
|
||||
--#{$prefix}accordion-btn-focus-box-shadow: #{$accordion-button-focus-box-shadow};
|
||||
--#{$prefix}accordion-body-padding-x: #{$accordion-body-padding-x};
|
||||
--#{$prefix}accordion-body-padding-y: #{$accordion-body-padding-y};
|
||||
@@ -74,7 +73,6 @@
|
||||
|
||||
&:focus {
|
||||
z-index: 3;
|
||||
border-color: var(--#{$prefix}accordion-btn-focus-border-color);
|
||||
outline: 0;
|
||||
box-shadow: var(--#{$prefix}accordion-btn-focus-box-shadow);
|
||||
}
|
||||
@@ -92,7 +90,7 @@
|
||||
&:first-of-type {
|
||||
@include border-top-radius(var(--#{$prefix}accordion-border-radius));
|
||||
|
||||
.accordion-button {
|
||||
> .accordion-header .accordion-button {
|
||||
@include border-top-radius(var(--#{$prefix}accordion-inner-border-radius));
|
||||
}
|
||||
}
|
||||
@@ -105,13 +103,13 @@
|
||||
&:last-of-type {
|
||||
@include border-bottom-radius(var(--#{$prefix}accordion-border-radius));
|
||||
|
||||
.accordion-button {
|
||||
> .accordion-header .accordion-button {
|
||||
&.collapsed {
|
||||
@include border-bottom-radius(var(--#{$prefix}accordion-inner-border-radius));
|
||||
}
|
||||
}
|
||||
|
||||
.accordion-collapse {
|
||||
> .accordion-collapse {
|
||||
@include border-bottom-radius(var(--#{$prefix}accordion-border-radius));
|
||||
}
|
||||
}
|
||||
@@ -127,11 +125,7 @@
|
||||
// Remove borders and border-radius to keep accordion items edge-to-edge.
|
||||
|
||||
.accordion-flush {
|
||||
.accordion-collapse {
|
||||
border-width: 0;
|
||||
}
|
||||
|
||||
.accordion-item {
|
||||
> .accordion-item {
|
||||
border-right: 0;
|
||||
border-left: 0;
|
||||
@include border-radius(0);
|
||||
@@ -139,12 +133,13 @@
|
||||
&:first-child { border-top: 0; }
|
||||
&:last-child { border-bottom: 0; }
|
||||
|
||||
.accordion-button {
|
||||
&,
|
||||
&.collapsed {
|
||||
@include border-radius(0);
|
||||
}
|
||||
// stylelint-disable selector-max-class
|
||||
> .accordion-collapse,
|
||||
> .accordion-header .accordion-button,
|
||||
> .accordion-header .accordion-button.collapsed {
|
||||
@include border-radius(0);
|
||||
}
|
||||
// stylelint-enable selector-max-class
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -100,6 +100,15 @@
|
||||
}
|
||||
}
|
||||
|
||||
.btn-check:checked:focus-visible + & {
|
||||
// Avoid using mixin so we can pass custom focus shadow properly
|
||||
@if $enable-shadows {
|
||||
box-shadow: var(--#{$prefix}btn-active-shadow), var(--#{$prefix}btn-focus-box-shadow);
|
||||
} @else {
|
||||
box-shadow: var(--#{$prefix}btn-focus-box-shadow);
|
||||
}
|
||||
}
|
||||
|
||||
&:disabled,
|
||||
&.disabled,
|
||||
fieldset:disabled & {
|
||||
@@ -170,7 +179,7 @@
|
||||
--#{$prefix}btn-disabled-color: #{$btn-link-disabled-color};
|
||||
--#{$prefix}btn-disabled-border-color: transparent;
|
||||
--#{$prefix}btn-box-shadow: 0 0 0 #000; // Can't use `none` as keyword negates all values when used with multiple shadows
|
||||
--#{$prefix}btn-focus-shadow-rgb: #{to-rgb(mix(color-contrast($link-color), $link-color, 15%))};
|
||||
--#{$prefix}btn-focus-shadow-rgb: #{$btn-link-focus-shadow-rgb};
|
||||
|
||||
text-decoration: $link-decoration;
|
||||
@if $enable-gradients {
|
||||
|
@@ -132,19 +132,11 @@
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
/* rtl:options: {
|
||||
"autoRename": true,
|
||||
"stringMap":[ {
|
||||
"name" : "prev-next",
|
||||
"search" : "prev",
|
||||
"replace" : "next"
|
||||
} ]
|
||||
} */
|
||||
.carousel-control-prev-icon {
|
||||
background-image: escape-svg($carousel-control-prev-icon-bg);
|
||||
background-image: escape-svg($carousel-control-prev-icon-bg) #{"/*rtl:" + escape-svg($carousel-control-next-icon-bg) + "*/"};
|
||||
}
|
||||
.carousel-control-next-icon {
|
||||
background-image: escape-svg($carousel-control-next-icon-bg);
|
||||
background-image: escape-svg($carousel-control-next-icon-bg) #{"/*rtl:" + escape-svg($carousel-control-prev-icon-bg) + "*/"};
|
||||
}
|
||||
|
||||
// Optional indicator pips/controls
|
||||
|
@@ -126,7 +126,6 @@
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
justify-content: space-between; // Put modal header elements (title and dismiss) on opposite ends
|
||||
padding: var(--#{$prefix}modal-header-padding);
|
||||
border-bottom: var(--#{$prefix}modal-header-border-width) solid var(--#{$prefix}modal-header-border-color);
|
||||
@include border-top-radius(var(--#{$prefix}modal-inner-border-radius));
|
||||
|
@@ -123,14 +123,11 @@
|
||||
.offcanvas-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: var(--#{$prefix}offcanvas-padding-y) var(--#{$prefix}offcanvas-padding-x);
|
||||
|
||||
.btn-close {
|
||||
padding: calc(var(--#{$prefix}offcanvas-padding-y) * .5) calc(var(--#{$prefix}offcanvas-padding-x) * .5);
|
||||
margin-top: calc(-.5 * var(--#{$prefix}offcanvas-padding-y));
|
||||
margin-right: calc(-.5 * var(--#{$prefix}offcanvas-padding-x));
|
||||
margin-bottom: calc(-.5 * var(--#{$prefix}offcanvas-padding-y));
|
||||
margin: calc(-.5 * var(--#{$prefix}offcanvas-padding-y)) calc(-.5 * var(--#{$prefix}offcanvas-padding-x)) calc(-.5 * var(--#{$prefix}offcanvas-padding-y)) auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
@@ -217,6 +217,7 @@ small {
|
||||
|
||||
mark {
|
||||
padding: $mark-padding;
|
||||
color: var(--#{$prefix}highlight-color);
|
||||
background-color: var(--#{$prefix}highlight-bg);
|
||||
}
|
||||
|
||||
|
@@ -103,6 +103,7 @@
|
||||
}
|
||||
|
||||
--#{$prefix}code-color: #{$code-color};
|
||||
--#{$prefix}highlight-color: #{$mark-color};
|
||||
--#{$prefix}highlight-bg: #{$mark-bg};
|
||||
|
||||
// scss-docs-start root-border-var
|
||||
@@ -203,6 +204,8 @@
|
||||
--#{$prefix}link-hover-color-rgb: #{to-rgb($link-hover-color-dark)};
|
||||
|
||||
--#{$prefix}code-color: #{$code-color-dark};
|
||||
--#{$prefix}highlight-color: #{$mark-color-dark};
|
||||
--#{$prefix}highlight-bg: #{$mark-bg-dark};
|
||||
|
||||
--#{$prefix}border-color: #{$border-color-dark};
|
||||
--#{$prefix}border-color-translucent: #{$border-color-translucent-dark};
|
||||
|
@@ -79,7 +79,7 @@
|
||||
//
|
||||
// When borders are added on all sides of the cells, the corners can render odd when
|
||||
// these borders do not have the same color or if they are semi-transparent.
|
||||
// Therefor we add top and border bottoms to the `tr`s and left and right borders
|
||||
// Therefore we add top and border bottoms to the `tr`s and left and right borders
|
||||
// to the `td`s or `th`s
|
||||
|
||||
.table-bordered {
|
||||
|
@@ -64,6 +64,8 @@ $headings-color-dark: inherit !default;
|
||||
$link-color-dark: tint-color($primary-dark, 40%) !default;
|
||||
$link-hover-color-dark: shift-color($link-color-dark, -$link-shade-percentage) !default;
|
||||
$code-color-dark: tint-color($code-color, 40%) !default;
|
||||
$mark-color-dark: $body-color-dark !default;
|
||||
$mark-bg-dark: $yellow-800 !default;
|
||||
|
||||
|
||||
//
|
||||
|
@@ -718,6 +718,7 @@ $dt-font-weight: $font-weight-bold !default;
|
||||
$list-inline-padding: .5rem !default;
|
||||
|
||||
$mark-padding: .1875em !default;
|
||||
$mark-color: $body-color !default;
|
||||
$mark-bg: $yellow-100 !default;
|
||||
// scss-docs-end type-variables
|
||||
|
||||
@@ -734,7 +735,7 @@ $table-cell-padding-x-sm: .25rem !default;
|
||||
|
||||
$table-cell-vertical-align: top !default;
|
||||
|
||||
$table-color: var(--#{$prefix}body-color) !default;
|
||||
$table-color: var(--#{$prefix}emphasis-color) !default;
|
||||
$table-bg: var(--#{$prefix}body-bg) !default;
|
||||
$table-accent-bg: transparent !default;
|
||||
|
||||
@@ -742,17 +743,17 @@ $table-th-font-weight: null !default;
|
||||
|
||||
$table-striped-color: $table-color !default;
|
||||
$table-striped-bg-factor: .05 !default;
|
||||
$table-striped-bg: rgba($black, $table-striped-bg-factor) !default;
|
||||
$table-striped-bg: rgba(var(--#{$prefix}emphasis-color-rgb), $table-striped-bg-factor) !default;
|
||||
|
||||
$table-active-color: $table-color !default;
|
||||
$table-active-bg-factor: .1 !default;
|
||||
$table-active-bg: rgba($black, $table-active-bg-factor) !default;
|
||||
$table-active-bg: rgba(var(--#{$prefix}emphasis-color-rgb), $table-active-bg-factor) !default;
|
||||
|
||||
$table-hover-color: $table-color !default;
|
||||
$table-hover-bg-factor: .075 !default;
|
||||
$table-hover-bg: rgba($black, $table-hover-bg-factor) !default;
|
||||
$table-hover-bg: rgba(var(--#{$prefix}emphasis-color-rgb), $table-hover-bg-factor) !default;
|
||||
|
||||
$table-border-factor: .1 !default;
|
||||
$table-border-factor: .2 !default;
|
||||
$table-border-width: var(--#{$prefix}border-width) !default;
|
||||
$table-border-color: var(--#{$prefix}border-color) !default;
|
||||
|
||||
@@ -842,6 +843,7 @@ $btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;
|
||||
$btn-link-color: var(--#{$prefix}link-color) !default;
|
||||
$btn-link-hover-color: var(--#{$prefix}link-hover-color) !default;
|
||||
$btn-link-disabled-color: $gray-600 !default;
|
||||
$btn-link-focus-shadow-rgb: to-rgb(mix(color-contrast($link-color), $link-color, 15%)) !default;
|
||||
|
||||
// Allows for customizing button radius independently from global border radius
|
||||
$btn-border-radius: var(--#{$prefix}border-radius) !default;
|
||||
@@ -1042,7 +1044,7 @@ $form-select-transition: $input-transition !default;
|
||||
$form-range-track-width: 100% !default;
|
||||
$form-range-track-height: .5rem !default;
|
||||
$form-range-track-cursor: pointer !default;
|
||||
$form-range-track-bg: var(--#{$prefix}tertiary-bg) !default;
|
||||
$form-range-track-bg: var(--#{$prefix}secondary-bg) !default;
|
||||
$form-range-track-border-radius: 1rem !default;
|
||||
$form-range-track-box-shadow: var(--#{$prefix}box-shadow-inset) !default;
|
||||
|
||||
@@ -1381,7 +1383,9 @@ $accordion-transition: $btn-transition, border-radius .15s ea
|
||||
$accordion-button-active-bg: var(--#{$prefix}primary-bg-subtle) !default;
|
||||
$accordion-button-active-color: var(--#{$prefix}primary-text-emphasis) !default;
|
||||
|
||||
$accordion-button-focus-border-color: $input-focus-border-color !default;
|
||||
// fusv-disable
|
||||
$accordion-button-focus-border-color: $input-focus-border-color !default; // Deprecated in v5.3.3
|
||||
// fusv-enable
|
||||
$accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;
|
||||
|
||||
$accordion-icon-width: 1.25rem !default;
|
||||
@@ -1390,8 +1394,8 @@ $accordion-icon-active-color: $primary-text-emphasis !default;
|
||||
$accordion-icon-transition: transform .2s ease-in-out !default;
|
||||
$accordion-icon-transform: rotate(-180deg) !default;
|
||||
|
||||
$accordion-button-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-color}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !default;
|
||||
$accordion-button-active-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-active-color}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !default;
|
||||
$accordion-button-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='#{$accordion-icon-color}' stroke-linecap='round' stroke-linejoin='round'><path d='M2 5L8 11L14 5'/></svg>") !default;
|
||||
$accordion-button-active-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='#{$accordion-icon-active-color}' stroke-linecap='round' stroke-linejoin='round'><path d='M2 5L8 11L14 5'/></svg>") !default;
|
||||
// scss-docs-end accordion-variables
|
||||
|
||||
// Tooltips
|
||||
@@ -1743,3 +1747,5 @@ $kbd-bg: var(--#{$prefix}body-color) !default;
|
||||
$nested-kbd-font-weight: null !default; // Deprecated in v5.2.0, removing in v6
|
||||
|
||||
$pre-color: null !default;
|
||||
|
||||
@import "variables-dark"; // TODO: can be removed safely in v6, only here to avoid breaking changes in v5.3
|
||||
|
@@ -29,6 +29,7 @@
|
||||
.form-check-input {
|
||||
--#{$prefix}form-check-bg: #{$form-check-input-bg};
|
||||
|
||||
flex-shrink: 0;
|
||||
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
|
||||
@@ -130,7 +131,7 @@
|
||||
margin-left: $form-switch-padding-start * -1;
|
||||
background-image: var(--#{$prefix}form-switch-bg);
|
||||
background-position: left center;
|
||||
@include border-radius($form-switch-border-radius);
|
||||
@include border-radius($form-switch-border-radius, 0);
|
||||
@include transition($form-switch-transition);
|
||||
|
||||
&:focus {
|
||||
|
@@ -1,7 +1,7 @@
|
||||
@mixin bsBanner($file) {
|
||||
/*!
|
||||
* Bootstrap #{$file} v5.3.1 (https://getbootstrap.com/)
|
||||
* Copyright 2011-2023 The Bootstrap Authors
|
||||
* Bootstrap #{$file} v5.3.3 (https://getbootstrap.com/)
|
||||
* Copyright 2011-2024 The Bootstrap Authors
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
*/
|
||||
}
|
||||
|
@@ -69,7 +69,12 @@
|
||||
|
||||
&:focus {
|
||||
border-color: $border-color;
|
||||
box-shadow: $focus-box-shadow;
|
||||
@if $enable-shadows {
|
||||
@include box-shadow($input-box-shadow, $focus-box-shadow);
|
||||
} @else {
|
||||
// Avoid using mixin so we can pass custom focus shadow properly
|
||||
box-shadow: $focus-box-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -100,7 +105,12 @@
|
||||
|
||||
&:focus {
|
||||
border-color: $border-color;
|
||||
box-shadow: $focus-box-shadow;
|
||||
@if $enable-shadows {
|
||||
@include box-shadow($form-select-box-shadow, $focus-box-shadow);
|
||||
} @else {
|
||||
// Avoid using mixin so we can pass custom focus shadow properly
|
||||
box-shadow: $focus-box-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -56,7 +56,7 @@
|
||||
@mixin row-cols($count) {
|
||||
> * {
|
||||
flex: 0 0 auto;
|
||||
width: divide(100%, $count);
|
||||
width: percentage(divide(1, $count));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -138,7 +138,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
// Start with `1` because `0` is and invalid value.
|
||||
// Start with `1` because `0` is an invalid value.
|
||||
// Ends with `$columns - 1` because offsetting by the width of an entire row isn't possible.
|
||||
@for $i from 1 through ($columns - 1) {
|
||||
.g-start#{$infix}-#{$i} {
|
||||
|
@@ -0,0 +1,7 @@
|
||||
// TODO: this file can be removed safely in v6 when `@import "variables-dark"` will be removed at the end of _variables.scss
|
||||
|
||||
@import "../../functions";
|
||||
@import "../../variables";
|
||||
// Voluntarily not importing _variables-dark.scss
|
||||
@import "../../maps";
|
||||
@import "../../mixins";
|
@@ -258,7 +258,7 @@ $enable-important-utilities: false;
|
||||
.desaturated-color-blue {
|
||||
--bs-color-opacity: 1;
|
||||
// Sass compilation will put a leading zero so we want to keep that one
|
||||
// stylelint-disable-next-line stylistic/number-leading-zero
|
||||
// stylelint-disable-next-line @stylistic/number-leading-zero
|
||||
--bs-color-saturation: 0.25;
|
||||
color: hsla(192deg, var(--bs-color-saturation), 0, var(--bs-color-opacity));
|
||||
}
|
||||
|
Reference in New Issue
Block a user