bootstrap 5.3.2 → 5.3.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +9 -0
- data/README.md +7 -10
- data/Rakefile +12 -10
- data/assets/javascripts/bootstrap/alert.js +2 -2
- data/assets/javascripts/bootstrap/base-component.js +3 -3
- data/assets/javascripts/bootstrap/button.js +2 -2
- data/assets/javascripts/bootstrap/carousel.js +2 -2
- data/assets/javascripts/bootstrap/collapse.js +2 -2
- data/assets/javascripts/bootstrap/dom/data.js +2 -2
- data/assets/javascripts/bootstrap/dom/event-handler.js +2 -2
- data/assets/javascripts/bootstrap/dom/manipulator.js +3 -3
- data/assets/javascripts/bootstrap/dom/selector-engine.js +4 -4
- data/assets/javascripts/bootstrap/dropdown.js +4 -4
- data/assets/javascripts/bootstrap/modal.js +2 -2
- data/assets/javascripts/bootstrap/offcanvas.js +2 -2
- data/assets/javascripts/bootstrap/popover.js +2 -2
- data/assets/javascripts/bootstrap/scrollspy.js +2 -2
- data/assets/javascripts/bootstrap/tab.js +2 -2
- data/assets/javascripts/bootstrap/toast.js +2 -2
- data/assets/javascripts/bootstrap/tooltip.js +5 -6
- data/assets/javascripts/bootstrap/util/backdrop.js +2 -3
- data/assets/javascripts/bootstrap/util/component-functions.js +2 -2
- data/assets/javascripts/bootstrap/util/config.js +2 -2
- data/assets/javascripts/bootstrap/util/focustrap.js +2 -3
- data/assets/javascripts/bootstrap/util/index.js +4 -5
- data/assets/javascripts/bootstrap/util/sanitizer.js +5 -2
- data/assets/javascripts/bootstrap/util/scrollbar.js +2 -2
- data/assets/javascripts/bootstrap/util/swipe.js +2 -2
- data/assets/javascripts/bootstrap/util/template-factory.js +3 -3
- data/assets/javascripts/bootstrap-sprockets.js +9 -9
- data/assets/javascripts/bootstrap.js +17 -18
- data/assets/javascripts/bootstrap.min.js +3 -3
- data/assets/stylesheets/bootstrap/_accordion.scss +10 -15
- data/assets/stylesheets/bootstrap/_button-group.scss +8 -3
- data/assets/stylesheets/bootstrap/_buttons.scss +9 -0
- data/assets/stylesheets/bootstrap/_card.scss +1 -2
- data/assets/stylesheets/bootstrap/_carousel.scss +17 -35
- data/assets/stylesheets/bootstrap/_close.scss +9 -6
- data/assets/stylesheets/bootstrap/_functions.scss +1 -1
- data/assets/stylesheets/bootstrap/_list-group.scss +27 -25
- data/assets/stylesheets/bootstrap/_modal.scss +6 -3
- data/assets/stylesheets/bootstrap/_nav.scss +1 -1
- data/assets/stylesheets/bootstrap/_navbar.scss +1 -1
- data/assets/stylesheets/bootstrap/_offcanvas.scss +2 -1
- data/assets/stylesheets/bootstrap/_pagination.scss +1 -1
- data/assets/stylesheets/bootstrap/_progress.scss +1 -1
- data/assets/stylesheets/bootstrap/_reboot.scss +1 -1
- data/assets/stylesheets/bootstrap/_tables.scss +1 -1
- data/assets/stylesheets/bootstrap/_type.scss +1 -1
- data/assets/stylesheets/bootstrap/_variables-dark.scss +17 -2
- data/assets/stylesheets/bootstrap/_variables.scss +21 -15
- data/assets/stylesheets/bootstrap/forms/_floating-labels.scss +18 -16
- data/assets/stylesheets/bootstrap/forms/_form-check.scss +1 -1
- data/assets/stylesheets/bootstrap/forms/_input-group.scss +1 -1
- data/assets/stylesheets/bootstrap/mixins/_banner.scss +2 -2
- data/assets/stylesheets/bootstrap/mixins/_forms.scss +12 -2
- data/assets/stylesheets/bootstrap/mixins/_grid.scss +2 -2
- data/assets/stylesheets/bootstrap/mixins/_visually-hidden.scss +1 -1
- data/bootstrap.gemspec +0 -1
- data/lib/bootstrap/engine.rb +13 -4
- data/lib/bootstrap/version.rb +2 -2
- data/test/dummy_rails/config/application.rb +0 -2
- data/test/dummy_rails/public/favicon.ico +0 -0
- data/test/gemfiles/rails_4_2.gemfile +1 -0
- data/test/gemfiles/rails_5_0.gemfile +0 -1
- data/test/gemfiles/rails_5_1.gemfile +0 -1
- data/test/gemfiles/rails_5_2.gemfile +0 -1
- data/test/gemfiles/rails_6_0.gemfile +0 -1
- data/test/gemfiles/rails_6_1.gemfile +0 -1
- data/test/gemfiles/rails_7_0_dartsass.gemfile +0 -1
- data/test/gemfiles/rails_7_0_sassc.gemfile +0 -1
- data/test/rails_test.rb +0 -5
- data/test/test_helper.rb +2 -2
- metadata +5 -21
@@ -99,6 +99,7 @@
|
|
99
99
|
color: $carousel-control-color;
|
100
100
|
text-align: center;
|
101
101
|
background: none;
|
102
|
+
filter: var(--#{$prefix}carousel-control-icon-filter);
|
102
103
|
border: 0;
|
103
104
|
opacity: $carousel-control-opacity;
|
104
105
|
@include transition($carousel-control-transition);
|
@@ -132,19 +133,11 @@
|
|
132
133
|
background-size: 100% 100%;
|
133
134
|
}
|
134
135
|
|
135
|
-
/* rtl:options: {
|
136
|
-
"autoRename": true,
|
137
|
-
"stringMap":[ {
|
138
|
-
"name" : "prev-next",
|
139
|
-
"search" : "prev",
|
140
|
-
"replace" : "next"
|
141
|
-
} ]
|
142
|
-
} */
|
143
136
|
.carousel-control-prev-icon {
|
144
|
-
background-image: escape-svg($carousel-control-prev-icon-bg);
|
137
|
+
background-image: escape-svg($carousel-control-prev-icon-bg) #{"/*rtl:" + escape-svg($carousel-control-next-icon-bg) + "*/"};
|
145
138
|
}
|
146
139
|
.carousel-control-next-icon {
|
147
|
-
background-image: escape-svg($carousel-control-next-icon-bg);
|
140
|
+
background-image: escape-svg($carousel-control-next-icon-bg) #{"/*rtl:" + escape-svg($carousel-control-prev-icon-bg) + "*/"};
|
148
141
|
}
|
149
142
|
|
150
143
|
// Optional indicator pips/controls
|
@@ -176,7 +169,7 @@
|
|
176
169
|
margin-left: $carousel-indicator-spacer;
|
177
170
|
text-indent: -999px;
|
178
171
|
cursor: pointer;
|
179
|
-
background-color: $carousel-indicator-active-bg;
|
172
|
+
background-color: var(--#{$prefix}carousel-indicator-active-bg);
|
180
173
|
background-clip: padding-box;
|
181
174
|
border: 0;
|
182
175
|
// Use transparent borders to increase the hit area by 10px on top and bottom.
|
@@ -203,42 +196,31 @@
|
|
203
196
|
left: (100% - $carousel-caption-width) * .5;
|
204
197
|
padding-top: $carousel-caption-padding-y;
|
205
198
|
padding-bottom: $carousel-caption-padding-y;
|
206
|
-
color: $carousel-caption-color;
|
199
|
+
color: var(--#{$prefix}carousel-caption-color);
|
207
200
|
text-align: center;
|
208
201
|
}
|
209
202
|
|
210
203
|
// Dark mode carousel
|
211
204
|
|
212
205
|
@mixin carousel-dark() {
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
}
|
217
|
-
|
218
|
-
.carousel-indicators [data-bs-target] {
|
219
|
-
background-color: $carousel-dark-indicator-active-bg;
|
220
|
-
}
|
221
|
-
|
222
|
-
.carousel-caption {
|
223
|
-
color: $carousel-dark-caption-color;
|
224
|
-
}
|
206
|
+
--#{$prefix}carousel-indicator-active-bg: #{$carousel-indicator-active-bg-dark};
|
207
|
+
--#{$prefix}carousel-caption-color: #{$carousel-caption-color-dark};
|
208
|
+
--#{$prefix}carousel-control-icon-filter: #{$carousel-control-icon-filter-dark};
|
225
209
|
}
|
226
210
|
|
227
211
|
.carousel-dark {
|
228
212
|
@include carousel-dark();
|
229
213
|
}
|
230
214
|
|
215
|
+
:root,
|
216
|
+
[data-bs-theme="light"] {
|
217
|
+
--#{$prefix}carousel-indicator-active-bg: #{$carousel-indicator-active-bg};
|
218
|
+
--#{$prefix}carousel-caption-color: #{$carousel-caption-color};
|
219
|
+
--#{$prefix}carousel-control-icon-filter: #{$carousel-control-icon-filter};
|
220
|
+
}
|
221
|
+
|
231
222
|
@if $enable-dark-mode {
|
232
|
-
@include color-mode(dark) {
|
233
|
-
@
|
234
|
-
.carousel {
|
235
|
-
@include carousel-dark();
|
236
|
-
}
|
237
|
-
} @else {
|
238
|
-
.carousel,
|
239
|
-
&.carousel {
|
240
|
-
@include carousel-dark();
|
241
|
-
}
|
242
|
-
}
|
223
|
+
@include color-mode(dark, true) {
|
224
|
+
@include carousel-dark();
|
243
225
|
}
|
244
226
|
}
|
@@ -12,7 +12,6 @@
|
|
12
12
|
--#{$prefix}btn-close-focus-shadow: #{$btn-close-focus-shadow};
|
13
13
|
--#{$prefix}btn-close-focus-opacity: #{$btn-close-focus-opacity};
|
14
14
|
--#{$prefix}btn-close-disabled-opacity: #{$btn-close-disabled-opacity};
|
15
|
-
--#{$prefix}btn-close-white-filter: #{$btn-close-white-filter};
|
16
15
|
// scss-docs-end close-css-vars
|
17
16
|
|
18
17
|
box-sizing: content-box;
|
@@ -21,6 +20,7 @@
|
|
21
20
|
padding: $btn-close-padding-y $btn-close-padding-x;
|
22
21
|
color: var(--#{$prefix}btn-close-color);
|
23
22
|
background: transparent var(--#{$prefix}btn-close-bg) center / $btn-close-width auto no-repeat; // include transparent for button elements
|
23
|
+
filter: var(--#{$prefix}btn-close-filter);
|
24
24
|
border: 0; // for button elements
|
25
25
|
@include border-radius();
|
26
26
|
opacity: var(--#{$prefix}btn-close-opacity);
|
@@ -47,17 +47,20 @@
|
|
47
47
|
}
|
48
48
|
|
49
49
|
@mixin btn-close-white() {
|
50
|
-
|
50
|
+
--#{$prefix}btn-close-filter: #{$btn-close-filter-dark};
|
51
51
|
}
|
52
52
|
|
53
53
|
.btn-close-white {
|
54
54
|
@include btn-close-white();
|
55
55
|
}
|
56
56
|
|
57
|
+
:root,
|
58
|
+
[data-bs-theme="light"] {
|
59
|
+
--#{$prefix}btn-close-filter: #{$btn-close-filter};
|
60
|
+
}
|
61
|
+
|
57
62
|
@if $enable-dark-mode {
|
58
|
-
@include color-mode(dark) {
|
59
|
-
|
60
|
-
@include btn-close-white();
|
61
|
-
}
|
63
|
+
@include color-mode(dark, true) {
|
64
|
+
@include btn-close-white();
|
62
65
|
}
|
63
66
|
}
|
@@ -177,7 +177,7 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003
|
|
177
177
|
@return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));
|
178
178
|
}
|
179
179
|
|
180
|
-
// Return WCAG2.
|
180
|
+
// Return WCAG2.2 relative luminance
|
181
181
|
// See https://www.w3.org/TR/WCAG/#dfn-relative-luminance
|
182
182
|
// See https://www.w3.org/TR/WCAG/#dfn-contrast-ratio
|
183
183
|
@function luminance($color) {
|
@@ -43,31 +43,6 @@
|
|
43
43
|
}
|
44
44
|
}
|
45
45
|
|
46
|
-
// Interactive list items
|
47
|
-
//
|
48
|
-
// Use anchor or button elements instead of `li`s or `div`s to create interactive
|
49
|
-
// list items. Includes an extra `.active` modifier class for selected items.
|
50
|
-
|
51
|
-
.list-group-item-action {
|
52
|
-
width: 100%; // For `<button>`s (anchors become 100% by default though)
|
53
|
-
color: var(--#{$prefix}list-group-action-color);
|
54
|
-
text-align: inherit; // For `<button>`s (anchors inherit)
|
55
|
-
|
56
|
-
// Hover state
|
57
|
-
&:hover,
|
58
|
-
&:focus {
|
59
|
-
z-index: 1; // Place hover/focus items above their siblings for proper border styling
|
60
|
-
color: var(--#{$prefix}list-group-action-hover-color);
|
61
|
-
text-decoration: none;
|
62
|
-
background-color: var(--#{$prefix}list-group-action-hover-bg);
|
63
|
-
}
|
64
|
-
|
65
|
-
&:active {
|
66
|
-
color: var(--#{$prefix}list-group-action-active-color);
|
67
|
-
background-color: var(--#{$prefix}list-group-action-active-bg);
|
68
|
-
}
|
69
|
-
}
|
70
|
-
|
71
46
|
// Individual list items
|
72
47
|
//
|
73
48
|
// Use on `li`s or `div`s within the `.list-group` parent.
|
@@ -115,6 +90,33 @@
|
|
115
90
|
}
|
116
91
|
}
|
117
92
|
|
93
|
+
// Interactive list items
|
94
|
+
//
|
95
|
+
// Use anchor or button elements instead of `li`s or `div`s to create interactive
|
96
|
+
// list items. Includes an extra `.active` modifier class for selected items.
|
97
|
+
|
98
|
+
.list-group-item-action {
|
99
|
+
width: 100%; // For `<button>`s (anchors become 100% by default though)
|
100
|
+
color: var(--#{$prefix}list-group-action-color);
|
101
|
+
text-align: inherit; // For `<button>`s (anchors inherit)
|
102
|
+
|
103
|
+
&:not(.active) {
|
104
|
+
// Hover state
|
105
|
+
&:hover,
|
106
|
+
&:focus {
|
107
|
+
z-index: 1; // Place hover/focus items above their siblings for proper border styling
|
108
|
+
color: var(--#{$prefix}list-group-action-hover-color);
|
109
|
+
text-decoration: none;
|
110
|
+
background-color: var(--#{$prefix}list-group-action-hover-bg);
|
111
|
+
}
|
112
|
+
|
113
|
+
&:active {
|
114
|
+
color: var(--#{$prefix}list-group-action-active-color);
|
115
|
+
background-color: var(--#{$prefix}list-group-action-active-bg);
|
116
|
+
}
|
117
|
+
}
|
118
|
+
}
|
119
|
+
|
118
120
|
// Horizontal
|
119
121
|
//
|
120
122
|
// Change the layout of list group items from vertical (default) to horizontal.
|
@@ -59,8 +59,8 @@
|
|
59
59
|
|
60
60
|
// When fading in the modal, animate it to slide down
|
61
61
|
.modal.fade & {
|
62
|
-
@include transition($modal-transition);
|
63
62
|
transform: $modal-fade-transform;
|
63
|
+
@include transition($modal-transition);
|
64
64
|
}
|
65
65
|
.modal.show & {
|
66
66
|
transform: $modal-show-transform;
|
@@ -126,14 +126,17 @@
|
|
126
126
|
display: flex;
|
127
127
|
flex-shrink: 0;
|
128
128
|
align-items: center;
|
129
|
-
justify-content: space-between; // Put modal header elements (title and dismiss) on opposite ends
|
130
129
|
padding: var(--#{$prefix}modal-header-padding);
|
131
130
|
border-bottom: var(--#{$prefix}modal-header-border-width) solid var(--#{$prefix}modal-header-border-color);
|
132
131
|
@include border-top-radius(var(--#{$prefix}modal-inner-border-radius));
|
133
132
|
|
134
133
|
.btn-close {
|
135
134
|
padding: calc(var(--#{$prefix}modal-header-padding-y) * .5) calc(var(--#{$prefix}modal-header-padding-x) * .5);
|
136
|
-
|
135
|
+
// Split properties to avoid invalid calc() function if value is 0
|
136
|
+
margin-top: calc(-.5 * var(--#{$prefix}modal-header-padding-y));
|
137
|
+
margin-right: calc(-.5 * var(--#{$prefix}modal-header-padding-x));
|
138
|
+
margin-bottom: calc(-.5 * var(--#{$prefix}modal-header-padding-y));
|
139
|
+
margin-left: auto;
|
137
140
|
}
|
138
141
|
}
|
139
142
|
|
@@ -139,8 +139,8 @@
|
|
139
139
|
// the default flexbox row orientation. Requires the use of `flex-wrap: wrap`
|
140
140
|
// on the `.navbar` parent.
|
141
141
|
.navbar-collapse {
|
142
|
-
flex-basis: 100%;
|
143
142
|
flex-grow: 1;
|
143
|
+
flex-basis: 100%;
|
144
144
|
// For always expanded or extra full navbars, ensure content aligns itself
|
145
145
|
// properly vertically. Can be easily overridden with flex utilities.
|
146
146
|
align-items: center;
|
@@ -123,14 +123,15 @@
|
|
123
123
|
.offcanvas-header {
|
124
124
|
display: flex;
|
125
125
|
align-items: center;
|
126
|
-
justify-content: space-between;
|
127
126
|
padding: var(--#{$prefix}offcanvas-padding-y) var(--#{$prefix}offcanvas-padding-x);
|
128
127
|
|
129
128
|
.btn-close {
|
130
129
|
padding: calc(var(--#{$prefix}offcanvas-padding-y) * .5) calc(var(--#{$prefix}offcanvas-padding-x) * .5);
|
130
|
+
// Split properties to avoid invalid calc() function if value is 0
|
131
131
|
margin-top: calc(-.5 * var(--#{$prefix}offcanvas-padding-y));
|
132
132
|
margin-right: calc(-.5 * var(--#{$prefix}offcanvas-padding-x));
|
133
133
|
margin-bottom: calc(-.5 * var(--#{$prefix}offcanvas-padding-y));
|
134
|
+
margin-left: auto;
|
134
135
|
}
|
135
136
|
}
|
136
137
|
|
@@ -75,7 +75,7 @@
|
|
75
75
|
margin-left: $pagination-margin-start;
|
76
76
|
}
|
77
77
|
|
78
|
-
@if $pagination-margin-start == calc(#{$pagination-border-width}
|
78
|
+
@if $pagination-margin-start == calc(-1 * #{$pagination-border-width}) {
|
79
79
|
&:first-child {
|
80
80
|
.page-link {
|
81
81
|
@include border-start-radius(var(--#{$prefix}pagination-border-radius));
|
@@ -499,9 +499,9 @@ legend {
|
|
499
499
|
width: 100%;
|
500
500
|
padding: 0;
|
501
501
|
margin-bottom: $legend-margin-bottom;
|
502
|
-
@include font-size($legend-font-size);
|
503
502
|
font-weight: $legend-font-weight;
|
504
503
|
line-height: inherit;
|
504
|
+
@include font-size($legend-font-size);
|
505
505
|
|
506
506
|
+ * {
|
507
507
|
clear: left; // 2
|
@@ -79,7 +79,7 @@
|
|
79
79
|
//
|
80
80
|
// When borders are added on all sides of the cells, the corners can render odd when
|
81
81
|
// these borders do not have the same color or if they are semi-transparent.
|
82
|
-
//
|
82
|
+
// Therefore we add top and border bottoms to the `tr`s and left and right borders
|
83
83
|
// to the `td`s or `th`s
|
84
84
|
|
85
85
|
.table-bordered {
|
@@ -34,11 +34,11 @@
|
|
34
34
|
// Type display classes
|
35
35
|
@each $display, $font-size in $display-font-sizes {
|
36
36
|
.display-#{$display} {
|
37
|
-
@include font-size($font-size);
|
38
37
|
font-family: $display-font-family;
|
39
38
|
font-style: $display-font-style;
|
40
39
|
font-weight: $display-font-weight;
|
41
40
|
line-height: $display-line-height;
|
41
|
+
@include font-size($font-size);
|
42
42
|
}
|
43
43
|
}
|
44
44
|
|
@@ -82,6 +82,21 @@ $form-invalid-border-color-dark: $red-300 !default;
|
|
82
82
|
$accordion-icon-color-dark: $primary-text-emphasis-dark !default;
|
83
83
|
$accordion-icon-active-color-dark: $primary-text-emphasis-dark !default;
|
84
84
|
|
85
|
-
$accordion-button-icon-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-color-dark}'><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-.
|
86
|
-
$accordion-button-active-icon-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-active-color-dark}'><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-.
|
85
|
+
$accordion-button-icon-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-color-dark}'><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-.708'/></svg>") !default;
|
86
|
+
$accordion-button-active-icon-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-active-color-dark}'><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-.708'/></svg>") !default;
|
87
87
|
// scss-docs-end sass-dark-mode-vars
|
88
|
+
|
89
|
+
|
90
|
+
//
|
91
|
+
// Carousel
|
92
|
+
//
|
93
|
+
|
94
|
+
$carousel-indicator-active-bg-dark: $carousel-dark-indicator-active-bg !default;
|
95
|
+
$carousel-caption-color-dark: $carousel-dark-caption-color !default;
|
96
|
+
$carousel-control-icon-filter-dark: $carousel-dark-control-icon-filter !default;
|
97
|
+
|
98
|
+
//
|
99
|
+
// Close button
|
100
|
+
//
|
101
|
+
|
102
|
+
$btn-close-filter-dark: $btn-close-white-filter !default;
|
@@ -67,8 +67,8 @@ $colors: (
|
|
67
67
|
) !default;
|
68
68
|
// scss-docs-end colors-map
|
69
69
|
|
70
|
-
// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.
|
71
|
-
// See https://www.w3.org/TR/
|
70
|
+
// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.2 are 3, 4.5 and 7.
|
71
|
+
// See https://www.w3.org/TR/WCAG/#contrast-minimum
|
72
72
|
$min-contrast-ratio: 4.5 !default;
|
73
73
|
|
74
74
|
// Customize the light and dark text colors for use in our color contrast function.
|
@@ -1091,7 +1091,7 @@ $form-feedback-valid-color: $success !default;
|
|
1091
1091
|
$form-feedback-invalid-color: $danger !default;
|
1092
1092
|
|
1093
1093
|
$form-feedback-icon-valid-color: $form-feedback-valid-color !default;
|
1094
|
-
$form-feedback-icon-valid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><path fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.
|
1094
|
+
$form-feedback-icon-valid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><path fill='#{$form-feedback-icon-valid-color}' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1'/></svg>") !default;
|
1095
1095
|
$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;
|
1096
1096
|
$form-feedback-icon-invalid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='#{$form-feedback-icon-invalid-color}'><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;
|
1097
1097
|
// scss-docs-end form-feedback-variables
|
@@ -1302,7 +1302,7 @@ $pagination-color: var(--#{$prefix}link-color) !default;
|
|
1302
1302
|
$pagination-bg: var(--#{$prefix}body-bg) !default;
|
1303
1303
|
$pagination-border-radius: var(--#{$prefix}border-radius) !default;
|
1304
1304
|
$pagination-border-width: var(--#{$prefix}border-width) !default;
|
1305
|
-
$pagination-margin-start: calc(#{$pagination-border-width}
|
1305
|
+
$pagination-margin-start: calc(-1 * #{$pagination-border-width}) !default; // stylelint-disable-line function-disallowed-list
|
1306
1306
|
$pagination-border-color: var(--#{$prefix}border-color) !default;
|
1307
1307
|
|
1308
1308
|
$pagination-focus-color: var(--#{$prefix}link-hover-color) !default;
|
@@ -1383,7 +1383,9 @@ $accordion-transition: $btn-transition, border-radius .15s ea
|
|
1383
1383
|
$accordion-button-active-bg: var(--#{$prefix}primary-bg-subtle) !default;
|
1384
1384
|
$accordion-button-active-color: var(--#{$prefix}primary-text-emphasis) !default;
|
1385
1385
|
|
1386
|
-
|
1386
|
+
// fusv-disable
|
1387
|
+
$accordion-button-focus-border-color: $input-focus-border-color !default; // Deprecated in v5.3.3
|
1388
|
+
// fusv-enable
|
1387
1389
|
$accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;
|
1388
1390
|
|
1389
1391
|
$accordion-icon-width: 1.25rem !default;
|
@@ -1392,8 +1394,8 @@ $accordion-icon-active-color: $primary-text-emphasis !default;
|
|
1392
1394
|
$accordion-icon-transition: transform .2s ease-in-out !default;
|
1393
1395
|
$accordion-icon-transform: rotate(-180deg) !default;
|
1394
1396
|
|
1395
|
-
$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}'
|
1396
|
-
$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}'
|
1397
|
+
$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 5 6 6 6-6'/></svg>") !default;
|
1398
|
+
$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 5 6 6 6-6'/></svg>") !default;
|
1397
1399
|
// scss-docs-end accordion-variables
|
1398
1400
|
|
1399
1401
|
// Tooltips
|
@@ -1505,7 +1507,7 @@ $modal-dialog-margin-y-sm-up: 1.75rem !default;
|
|
1505
1507
|
|
1506
1508
|
$modal-title-line-height: $line-height-base !default;
|
1507
1509
|
|
1508
|
-
$modal-content-color:
|
1510
|
+
$modal-content-color: var(--#{$prefix}body-color) !default;
|
1509
1511
|
$modal-content-bg: var(--#{$prefix}body-bg) !default;
|
1510
1512
|
$modal-content-border-color: var(--#{$prefix}border-color-translucent) !default;
|
1511
1513
|
$modal-content-border-width: var(--#{$prefix}border-width) !default;
|
@@ -1650,6 +1652,7 @@ $carousel-control-width: 15% !default;
|
|
1650
1652
|
$carousel-control-opacity: .5 !default;
|
1651
1653
|
$carousel-control-hover-opacity: .9 !default;
|
1652
1654
|
$carousel-control-transition: opacity .15s ease !default;
|
1655
|
+
$carousel-control-icon-filter: null !default;
|
1653
1656
|
|
1654
1657
|
$carousel-indicator-width: 30px !default;
|
1655
1658
|
$carousel-indicator-height: 3px !default;
|
@@ -1667,17 +1670,17 @@ $carousel-caption-spacer: 1.25rem !default;
|
|
1667
1670
|
|
1668
1671
|
$carousel-control-icon-width: 2rem !default;
|
1669
1672
|
|
1670
|
-
$carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708
|
1671
|
-
$carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.
|
1673
|
+
$carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0'/></svg>") !default;
|
1674
|
+
$carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708'/></svg>") !default;
|
1672
1675
|
|
1673
1676
|
$carousel-transition-duration: .6s !default;
|
1674
1677
|
$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)
|
1675
1678
|
// scss-docs-end carousel-variables
|
1676
1679
|
|
1677
1680
|
// scss-docs-start carousel-dark-variables
|
1678
|
-
$carousel-dark-indicator-active-bg: $black !default;
|
1679
|
-
$carousel-dark-caption-color: $black !default;
|
1680
|
-
$carousel-dark-control-icon-filter: invert(1) grayscale(100) !default;
|
1681
|
+
$carousel-dark-indicator-active-bg: $black !default; // Deprecated in v5.3.4
|
1682
|
+
$carousel-dark-caption-color: $black !default; // Deprecated in v5.3.4
|
1683
|
+
$carousel-dark-control-icon-filter: invert(1) grayscale(100) !default; // Deprecated in v5.3.4
|
1681
1684
|
// scss-docs-end carousel-dark-variables
|
1682
1685
|
|
1683
1686
|
|
@@ -1704,13 +1707,14 @@ $btn-close-height: $btn-close-width !default;
|
|
1704
1707
|
$btn-close-padding-x: .25em !default;
|
1705
1708
|
$btn-close-padding-y: $btn-close-padding-x !default;
|
1706
1709
|
$btn-close-color: $black !default;
|
1707
|
-
$btn-close-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$btn-close-color}'><path d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.
|
1710
|
+
$btn-close-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$btn-close-color}'><path d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/></svg>") !default;
|
1708
1711
|
$btn-close-focus-shadow: $focus-ring-box-shadow !default;
|
1709
1712
|
$btn-close-opacity: .5 !default;
|
1710
1713
|
$btn-close-hover-opacity: .75 !default;
|
1711
1714
|
$btn-close-focus-opacity: 1 !default;
|
1712
1715
|
$btn-close-disabled-opacity: .25 !default;
|
1713
|
-
$btn-close-
|
1716
|
+
$btn-close-filter: null !default;
|
1717
|
+
$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default; // Deprecated in v5.3.4
|
1714
1718
|
// scss-docs-end close-variables
|
1715
1719
|
|
1716
1720
|
|
@@ -1745,3 +1749,5 @@ $kbd-bg: var(--#{$prefix}body-color) !default;
|
|
1745
1749
|
$nested-kbd-font-weight: null !default; // Deprecated in v5.2.0, removing in v6
|
1746
1750
|
|
1747
1751
|
$pre-color: null !default;
|
1752
|
+
|
1753
|
+
@import "variables-dark"; // TODO: can be removed safely in v6, only here to avoid breaking changes in v5.3
|
@@ -14,9 +14,11 @@
|
|
14
14
|
top: 0;
|
15
15
|
left: 0;
|
16
16
|
z-index: 2;
|
17
|
+
max-width: 100%;
|
17
18
|
height: 100%; // allow textareas
|
18
19
|
padding: $form-floating-padding-y $form-floating-padding-x;
|
19
20
|
overflow: hidden;
|
21
|
+
color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
|
20
22
|
text-align: start;
|
21
23
|
text-overflow: ellipsis;
|
22
24
|
white-space: nowrap;
|
@@ -49,6 +51,7 @@
|
|
49
51
|
> .form-select {
|
50
52
|
padding-top: $form-floating-input-padding-t;
|
51
53
|
padding-bottom: $form-floating-input-padding-b;
|
54
|
+
padding-left: $form-floating-padding-x;
|
52
55
|
}
|
53
56
|
|
54
57
|
> .form-control:focus,
|
@@ -56,27 +59,30 @@
|
|
56
59
|
> .form-control-plaintext,
|
57
60
|
> .form-select {
|
58
61
|
~ label {
|
59
|
-
color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
|
60
62
|
transform: $form-floating-label-transform;
|
61
|
-
|
62
|
-
&::after {
|
63
|
-
position: absolute;
|
64
|
-
inset: $form-floating-padding-y ($form-floating-padding-x * .5);
|
65
|
-
z-index: -1;
|
66
|
-
height: $form-floating-label-height;
|
67
|
-
content: "";
|
68
|
-
background-color: $input-bg;
|
69
|
-
@include border-radius($input-border-radius);
|
70
|
-
}
|
71
63
|
}
|
72
64
|
}
|
73
65
|
// Duplicated because `:-webkit-autofill` invalidates other selectors when grouped
|
74
66
|
> .form-control:-webkit-autofill {
|
75
67
|
~ label {
|
76
|
-
color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
|
77
68
|
transform: $form-floating-label-transform;
|
78
69
|
}
|
79
70
|
}
|
71
|
+
> textarea:focus,
|
72
|
+
> textarea:not(:placeholder-shown) {
|
73
|
+
~ label::after {
|
74
|
+
position: absolute;
|
75
|
+
inset: $form-floating-padding-y ($form-floating-padding-x * .5);
|
76
|
+
z-index: -1;
|
77
|
+
height: $form-floating-label-height;
|
78
|
+
content: "";
|
79
|
+
background-color: $input-bg;
|
80
|
+
@include border-radius($input-border-radius);
|
81
|
+
}
|
82
|
+
}
|
83
|
+
> textarea:disabled ~ label::after {
|
84
|
+
background-color: $input-disabled-bg;
|
85
|
+
}
|
80
86
|
|
81
87
|
> .form-control-plaintext {
|
82
88
|
~ label {
|
@@ -87,9 +93,5 @@
|
|
87
93
|
> :disabled ~ label,
|
88
94
|
> .form-control:disabled ~ label { // Required for `.form-control`s because of specificity
|
89
95
|
color: $form-floating-label-disabled-color;
|
90
|
-
|
91
|
-
&::after {
|
92
|
-
background-color: $input-disabled-bg;
|
93
|
-
}
|
94
96
|
}
|
95
97
|
}
|
@@ -131,7 +131,7 @@
|
|
131
131
|
margin-left: $form-switch-padding-start * -1;
|
132
132
|
background-image: var(--#{$prefix}form-switch-bg);
|
133
133
|
background-position: left center;
|
134
|
-
@include border-radius($form-switch-border-radius);
|
134
|
+
@include border-radius($form-switch-border-radius, 0);
|
135
135
|
@include transition($form-switch-transition);
|
136
136
|
|
137
137
|
&:focus {
|
@@ -121,7 +121,7 @@
|
|
121
121
|
}
|
122
122
|
|
123
123
|
> :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
|
124
|
-
margin-left: calc(#{$input-border-width}
|
124
|
+
margin-left: calc(-1 * #{$input-border-width}); // stylelint-disable-line function-disallowed-list
|
125
125
|
@include border-start-radius(0);
|
126
126
|
}
|
127
127
|
|
@@ -1,7 +1,7 @@
|
|
1
1
|
@mixin bsBanner($file) {
|
2
2
|
/*!
|
3
|
-
* Bootstrap #{$file} v5.3.
|
4
|
-
* Copyright 2011-
|
3
|
+
* Bootstrap #{$file} v5.3.4 (https://getbootstrap.com/)
|
4
|
+
* Copyright 2011-2025 The Bootstrap Authors
|
5
5
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
6
6
|
*/
|
7
7
|
}
|
@@ -69,7 +69,12 @@
|
|
69
69
|
|
70
70
|
&:focus {
|
71
71
|
border-color: $border-color;
|
72
|
-
|
72
|
+
@if $enable-shadows {
|
73
|
+
@include box-shadow($input-box-shadow, $focus-box-shadow);
|
74
|
+
} @else {
|
75
|
+
// Avoid using mixin so we can pass custom focus shadow properly
|
76
|
+
box-shadow: $focus-box-shadow;
|
77
|
+
}
|
73
78
|
}
|
74
79
|
}
|
75
80
|
}
|
@@ -100,7 +105,12 @@
|
|
100
105
|
|
101
106
|
&:focus {
|
102
107
|
border-color: $border-color;
|
103
|
-
|
108
|
+
@if $enable-shadows {
|
109
|
+
@include box-shadow($form-select-box-shadow, $focus-box-shadow);
|
110
|
+
} @else {
|
111
|
+
// Avoid using mixin so we can pass custom focus shadow properly
|
112
|
+
box-shadow: $focus-box-shadow;
|
113
|
+
}
|
104
114
|
}
|
105
115
|
}
|
106
116
|
}
|
@@ -72,7 +72,7 @@
|
|
72
72
|
@include media-breakpoint-up($breakpoint, $breakpoints) {
|
73
73
|
// Provide basic `.col-{bp}` classes for equal-width flexbox columns
|
74
74
|
.col#{$infix} {
|
75
|
-
flex: 1 0 0
|
75
|
+
flex: 1 0 0;
|
76
76
|
}
|
77
77
|
|
78
78
|
.row-cols#{$infix}-auto > * {
|
@@ -138,7 +138,7 @@
|
|
138
138
|
}
|
139
139
|
}
|
140
140
|
|
141
|
-
// Start with `1` because `0` is
|
141
|
+
// Start with `1` because `0` is an invalid value.
|
142
142
|
// Ends with `$columns - 1` because offsetting by the width of an entire row isn't possible.
|
143
143
|
@for $i from 1 through ($columns - 1) {
|
144
144
|
.g-start#{$infix}-#{$i} {
|
@@ -24,7 +24,7 @@
|
|
24
24
|
// Use to only display content when it's focused, or one of its child elements is focused
|
25
25
|
// (i.e. when focus is within the element/container that the class was applied to)
|
26
26
|
//
|
27
|
-
// Useful for "Skip to main content" links; see https://www.w3.org/
|
27
|
+
// Useful for "Skip to main content" links; see https://www.w3.org/WAI/WCAG22/Techniques/general/G1.html
|
28
28
|
|
29
29
|
@mixin visually-hidden-focusable() {
|
30
30
|
&:not(:focus):not(:focus-within) {
|
data/bootstrap.gemspec
CHANGED