bootstrap 5.0.1 → 5.1.2

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.
Files changed (65) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +2 -2
  3. data/assets/javascripts/bootstrap/alert.js +89 -58
  4. data/assets/javascripts/bootstrap/base-component.js +53 -39
  5. data/assets/javascripts/bootstrap/button.js +31 -25
  6. data/assets/javascripts/bootstrap/carousel.js +126 -89
  7. data/assets/javascripts/bootstrap/collapse.js +125 -133
  8. data/assets/javascripts/bootstrap/dom/data.js +5 -5
  9. data/assets/javascripts/bootstrap/dom/event-handler.js +11 -5
  10. data/assets/javascripts/bootstrap/dom/manipulator.js +6 -6
  11. data/assets/javascripts/bootstrap/dom/selector-engine.js +49 -7
  12. data/assets/javascripts/bootstrap/dropdown.js +147 -140
  13. data/assets/javascripts/bootstrap/modal.js +397 -180
  14. data/assets/javascripts/bootstrap/offcanvas.js +333 -138
  15. data/assets/javascripts/bootstrap/popover.js +36 -54
  16. data/assets/javascripts/bootstrap/scrollspy.js +58 -68
  17. data/assets/javascripts/bootstrap/tab.js +53 -26
  18. data/assets/javascripts/bootstrap/toast.js +138 -41
  19. data/assets/javascripts/bootstrap/tooltip.js +137 -120
  20. data/assets/javascripts/bootstrap-sprockets.js +8 -8
  21. data/assets/javascripts/bootstrap.js +937 -886
  22. data/assets/javascripts/bootstrap.min.js +2 -2
  23. data/assets/stylesheets/_bootstrap-grid.scss +3 -1
  24. data/assets/stylesheets/_bootstrap-reboot.scss +2 -4
  25. data/assets/stylesheets/_bootstrap.scss +2 -1
  26. data/assets/stylesheets/bootstrap/_buttons.scss +1 -0
  27. data/assets/stylesheets/bootstrap/_card.scss +7 -6
  28. data/assets/stylesheets/bootstrap/_carousel.scss +2 -2
  29. data/assets/stylesheets/bootstrap/_dropdown.scss +4 -4
  30. data/assets/stylesheets/bootstrap/_functions.scss +100 -3
  31. data/assets/stylesheets/bootstrap/_grid.scss +11 -0
  32. data/assets/stylesheets/bootstrap/_helpers.scss +2 -0
  33. data/assets/stylesheets/bootstrap/_images.scss +1 -1
  34. data/assets/stylesheets/bootstrap/_mixins.scss +1 -0
  35. data/assets/stylesheets/bootstrap/_modal.scss +5 -15
  36. data/assets/stylesheets/bootstrap/_navbar.scss +30 -1
  37. data/assets/stylesheets/bootstrap/_offcanvas.scss +8 -2
  38. data/assets/stylesheets/bootstrap/_placeholders.scss +51 -0
  39. data/assets/stylesheets/bootstrap/_popover.scss +10 -10
  40. data/assets/stylesheets/bootstrap/_reboot.scss +12 -8
  41. data/assets/stylesheets/bootstrap/_root.scss +40 -2
  42. data/assets/stylesheets/bootstrap/_tables.scss +9 -5
  43. data/assets/stylesheets/bootstrap/_toasts.scss +3 -3
  44. data/assets/stylesheets/bootstrap/_tooltip.scss +4 -4
  45. data/assets/stylesheets/bootstrap/_transitions.scss +6 -0
  46. data/assets/stylesheets/bootstrap/_utilities.scss +44 -8
  47. data/assets/stylesheets/bootstrap/_variables.scss +206 -29
  48. data/assets/stylesheets/bootstrap/bootstrap-utilities.scss +1 -1
  49. data/assets/stylesheets/bootstrap/forms/_floating-labels.scss +3 -1
  50. data/assets/stylesheets/bootstrap/forms/_form-check.scss +1 -1
  51. data/assets/stylesheets/bootstrap/forms/_form-control.scss +1 -1
  52. data/assets/stylesheets/bootstrap/forms/_form-range.scss +1 -1
  53. data/assets/stylesheets/bootstrap/forms/_form-select.scss +5 -0
  54. data/assets/stylesheets/bootstrap/helpers/_stacks.scss +15 -0
  55. data/assets/stylesheets/bootstrap/helpers/_vr.scss +8 -0
  56. data/assets/stylesheets/bootstrap/mixins/_backdrop.scss +14 -0
  57. data/assets/stylesheets/bootstrap/mixins/_buttons.scss +1 -1
  58. data/assets/stylesheets/bootstrap/mixins/_grid.scss +35 -9
  59. data/assets/stylesheets/bootstrap/mixins/_utilities.scss +27 -6
  60. data/assets/stylesheets/bootstrap/mixins/_visually-hidden.scss +1 -1
  61. data/assets/stylesheets/bootstrap/vendor/_rfs.scss +55 -13
  62. data/bootstrap.gemspec +3 -3
  63. data/lib/bootstrap/version.rb +2 -2
  64. data/tasks/updater/js.rb +6 -2
  65. metadata +12 -8
@@ -90,6 +90,10 @@ $theme-colors: (
90
90
  ) !default;
91
91
  // scss-docs-end theme-colors-map
92
92
 
93
+ // scss-docs-start theme-colors-rgb
94
+ $theme-colors-rgb: map-loop($theme-colors, to-rgb, "$value") !default;
95
+ // scss-docs-end theme-colors-rgb
96
+
93
97
  // The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.
94
98
  // See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
95
99
  $min-contrast-ratio: 4.5 !default;
@@ -198,6 +202,126 @@ $cyan-600: shade-color($cyan, 20%) !default;
198
202
  $cyan-700: shade-color($cyan, 40%) !default;
199
203
  $cyan-800: shade-color($cyan, 60%) !default;
200
204
  $cyan-900: shade-color($cyan, 80%) !default;
205
+
206
+ $blues: (
207
+ "blue-100": $blue-100,
208
+ "blue-200": $blue-200,
209
+ "blue-300": $blue-300,
210
+ "blue-400": $blue-400,
211
+ "blue-500": $blue-500,
212
+ "blue-600": $blue-600,
213
+ "blue-700": $blue-700,
214
+ "blue-800": $blue-800,
215
+ "blue-900": $blue-900
216
+ ) !default;
217
+
218
+ $indigos: (
219
+ "indigo-100": $indigo-100,
220
+ "indigo-200": $indigo-200,
221
+ "indigo-300": $indigo-300,
222
+ "indigo-400": $indigo-400,
223
+ "indigo-500": $indigo-500,
224
+ "indigo-600": $indigo-600,
225
+ "indigo-700": $indigo-700,
226
+ "indigo-800": $indigo-800,
227
+ "indigo-900": $indigo-900
228
+ ) !default;
229
+
230
+ $purples: (
231
+ "purple-100": $purple-200,
232
+ "purple-200": $purple-100,
233
+ "purple-300": $purple-300,
234
+ "purple-400": $purple-400,
235
+ "purple-500": $purple-500,
236
+ "purple-600": $purple-600,
237
+ "purple-700": $purple-700,
238
+ "purple-800": $purple-800,
239
+ "purple-900": $purple-900
240
+ ) !default;
241
+
242
+ $pinks: (
243
+ "pink-100": $pink-100,
244
+ "pink-200": $pink-200,
245
+ "pink-300": $pink-300,
246
+ "pink-400": $pink-400,
247
+ "pink-500": $pink-500,
248
+ "pink-600": $pink-600,
249
+ "pink-700": $pink-700,
250
+ "pink-800": $pink-800,
251
+ "pink-900": $pink-900
252
+ ) !default;
253
+
254
+ $reds: (
255
+ "red-100": $red-100,
256
+ "red-200": $red-200,
257
+ "red-300": $red-300,
258
+ "red-400": $red-400,
259
+ "red-500": $red-500,
260
+ "red-600": $red-600,
261
+ "red-700": $red-700,
262
+ "red-800": $red-800,
263
+ "red-900": $red-900
264
+ ) !default;
265
+
266
+ $oranges: (
267
+ "orange-100": $orange-100,
268
+ "orange-200": $orange-200,
269
+ "orange-300": $orange-300,
270
+ "orange-400": $orange-400,
271
+ "orange-500": $orange-500,
272
+ "orange-600": $orange-600,
273
+ "orange-700": $orange-700,
274
+ "orange-800": $orange-800,
275
+ "orange-900": $orange-900
276
+ ) !default;
277
+
278
+ $yellows: (
279
+ "yellow-100": $yellow-100,
280
+ "yellow-200": $yellow-200,
281
+ "yellow-300": $yellow-300,
282
+ "yellow-400": $yellow-400,
283
+ "yellow-500": $yellow-500,
284
+ "yellow-600": $yellow-600,
285
+ "yellow-700": $yellow-700,
286
+ "yellow-800": $yellow-800,
287
+ "yellow-900": $yellow-900
288
+ ) !default;
289
+
290
+ $greens: (
291
+ "green-100": $green-100,
292
+ "green-200": $green-200,
293
+ "green-300": $green-300,
294
+ "green-400": $green-400,
295
+ "green-500": $green-500,
296
+ "green-600": $green-600,
297
+ "green-700": $green-700,
298
+ "green-800": $green-800,
299
+ "green-900": $green-900
300
+ ) !default;
301
+
302
+ $teals: (
303
+ "teal-100": $teal-100,
304
+ "teal-200": $teal-200,
305
+ "teal-300": $teal-300,
306
+ "teal-400": $teal-400,
307
+ "teal-500": $teal-500,
308
+ "teal-600": $teal-600,
309
+ "teal-700": $teal-700,
310
+ "teal-800": $teal-800,
311
+ "teal-900": $teal-900
312
+ ) !default;
313
+
314
+ $cyans: (
315
+ "cyan-100": $cyan-100,
316
+ "cyan-200": $cyan-200,
317
+ "cyan-300": $cyan-300,
318
+ "cyan-400": $cyan-400,
319
+ "cyan-500": $cyan-500,
320
+ "cyan-600": $cyan-600,
321
+ "cyan-700": $cyan-700,
322
+ "cyan-800": $cyan-800,
323
+ "cyan-900": $cyan-900
324
+ ) !default;
201
325
  // fusv-enable
202
326
 
203
327
  // Characters which are escaped by the escape-svg function
@@ -221,6 +345,7 @@ $enable-transitions: true !default;
221
345
  $enable-reduced-motion: true !default;
222
346
  $enable-smooth-scroll: true !default;
223
347
  $enable-grid-classes: true !default;
348
+ $enable-cssgrid: false !default;
224
349
  $enable-button-pointers: true !default;
225
350
  $enable-rfs: true !default;
226
351
  $enable-validation-icons: true !default;
@@ -250,8 +375,8 @@ $gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;
250
375
  $spacer: 1rem !default;
251
376
  $spacers: (
252
377
  0: 0,
253
- 1: $spacer / 4,
254
- 2: $spacer / 2,
378
+ 1: $spacer * .25,
379
+ 2: $spacer * .5,
255
380
  3: $spacer,
256
381
  4: $spacer * 1.5,
257
382
  5: $spacer * 3,
@@ -280,6 +405,38 @@ $body-bg: $white !default;
280
405
  $body-color: $gray-900 !default;
281
406
  $body-text-align: null !default;
282
407
 
408
+ // Utilities maps
409
+ //
410
+ // Extends the default `$theme-colors` maps to help create our utilities.
411
+
412
+ // Come v6, we'll de-dupe these variables. Until then, for backward compatibility, we keep them to reassign.
413
+ // scss-docs-start utilities-colors
414
+ $utilities-colors: $theme-colors-rgb !default;
415
+ // scss-docs-end utilities-colors
416
+
417
+ // scss-docs-start utilities-text-colors
418
+ $utilities-text: map-merge(
419
+ $utilities-colors,
420
+ (
421
+ "black": to-rgb($black),
422
+ "white": to-rgb($white),
423
+ "body": to-rgb($body-color)
424
+ )
425
+ ) !default;
426
+ $utilities-text-colors: map-loop($utilities-text, rgba-css-var, "$key", "text") !default;
427
+ // scss-docs-end utilities-text-colors
428
+
429
+ // scss-docs-start utilities-bg-colors
430
+ $utilities-bg: map-merge(
431
+ $utilities-colors,
432
+ (
433
+ "black": to-rgb($black),
434
+ "white": to-rgb($white),
435
+ "body": to-rgb($body-bg)
436
+ )
437
+ ) !default;
438
+ $utilities-bg-colors: map-loop($utilities-bg, rgba-css-var, "$key", "bg") !default;
439
+ // scss-docs-end utilities-bg-colors
283
440
 
284
441
  // Links
285
442
  //
@@ -350,7 +507,7 @@ $gutters: $spacers !default;
350
507
 
351
508
  // Container padding
352
509
 
353
- $container-padding-x: $grid-gutter-width / 2 !default;
510
+ $container-padding-x: $grid-gutter-width * .5 !default;
354
511
 
355
512
 
356
513
  // Components
@@ -397,6 +554,7 @@ $transition-base: all .2s ease-in-out !default;
397
554
  $transition-fade: opacity .15s linear !default;
398
555
  // scss-docs-start collapse-transition
399
556
  $transition-collapse: height .35s ease !default;
557
+ $transition-collapse-width: width .35s ease !default;
400
558
  // scss-docs-end collapse-transition
401
559
 
402
560
  // stylelint-disable function-disallowed-list
@@ -422,8 +580,8 @@ $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberati
422
580
  $font-family-base: var(--#{$variable-prefix}font-sans-serif) !default;
423
581
  $font-family-code: var(--#{$variable-prefix}font-monospace) !default;
424
582
 
425
- // $font-size-root effects the value of `rem`, which is used for as well font sizes, paddings and margins
426
- // $font-size-base effects the font size of the body text
583
+ // $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins
584
+ // $font-size-base affects the font size of the body text
427
585
  $font-size-root: null !default;
428
586
  $font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
429
587
  $font-size-sm: $font-size-base * .875 !default;
@@ -461,7 +619,7 @@ $font-sizes: (
461
619
  // scss-docs-end font-sizes
462
620
 
463
621
  // scss-docs-start headings-variables
464
- $headings-margin-bottom: $spacer / 2 !default;
622
+ $headings-margin-bottom: $spacer * .5 !default;
465
623
  $headings-font-family: null !default;
466
624
  $headings-font-style: null !default;
467
625
  $headings-font-weight: 500 !default;
@@ -535,6 +693,7 @@ $table-cell-vertical-align: top !default;
535
693
 
536
694
  $table-color: $body-color !default;
537
695
  $table-bg: transparent !default;
696
+ $table-accent-bg: transparent !default;
538
697
 
539
698
  $table-th-font-weight: null !default;
540
699
 
@@ -691,7 +850,7 @@ $input-padding-y-lg: $input-btn-padding-y-lg !default;
691
850
  $input-padding-x-lg: $input-btn-padding-x-lg !default;
692
851
  $input-font-size-lg: $input-btn-font-size-lg !default;
693
852
 
694
- $input-bg: $white !default;
853
+ $input-bg: $body-bg !default;
695
854
  $input-disabled-bg: $gray-200 !default;
696
855
  $input-disabled-border-color: null !default;
697
856
 
@@ -717,13 +876,15 @@ $input-height-border: $input-border-width * 2 !default;
717
876
 
718
877
  $input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;
719
878
  $input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default;
720
- $input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y / 2) !default;
879
+ $input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y * .5) !default;
721
880
 
722
881
  $input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;
723
882
  $input-height-sm: add($input-line-height * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;
724
883
  $input-height-lg: add($input-line-height * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;
725
884
 
726
885
  $input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
886
+
887
+ $form-color-width: 3rem !default;
727
888
  // scss-docs-end form-input-variables
728
889
 
729
890
  // scss-docs-start form-check-variables
@@ -763,7 +924,7 @@ $form-check-inline-margin-end: 1rem !default;
763
924
  // scss-docs-end form-check-variables
764
925
 
765
926
  // scss-docs-start form-switch-variables
766
- $form-switch-color: rgba(0, 0, 0, .25) !default;
927
+ $form-switch-color: rgba($black, .25) !default;
767
928
  $form-switch-width: 2em !default;
768
929
  $form-switch-padding-start: $form-switch-width + .5em !default;
769
930
  $form-switch-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-color}'/></svg>") !default;
@@ -811,7 +972,7 @@ $form-select-feedback-icon-size: $input-height-inner-half $input-height-i
811
972
 
812
973
  $form-select-border-width: $input-border-width !default;
813
974
  $form-select-border-color: $input-border-color !default;
814
- $form-select-border-radius: $border-radius !default;
975
+ $form-select-border-radius: $input-border-radius !default;
815
976
  $form-select-box-shadow: $box-shadow-inset !default;
816
977
 
817
978
  $form-select-focus-border-color: $input-focus-border-color !default;
@@ -821,10 +982,14 @@ $form-select-focus-box-shadow: 0 0 0 $form-select-focus-width $input-btn-focu
821
982
  $form-select-padding-y-sm: $input-padding-y-sm !default;
822
983
  $form-select-padding-x-sm: $input-padding-x-sm !default;
823
984
  $form-select-font-size-sm: $input-font-size-sm !default;
985
+ $form-select-border-radius-sm: $input-border-radius-sm !default;
824
986
 
825
987
  $form-select-padding-y-lg: $input-padding-y-lg !default;
826
988
  $form-select-padding-x-lg: $input-padding-x-lg !default;
827
989
  $form-select-font-size-lg: $input-font-size-lg !default;
990
+ $form-select-border-radius-lg: $input-border-radius-lg !default;
991
+
992
+ $form-select-transition: $input-transition !default;
828
993
  // scss-docs-end form-select-variables
829
994
 
830
995
  // scss-docs-start form-range-variables
@@ -856,6 +1021,7 @@ $form-file-button-hover-bg: shade-color($form-file-button-bg, 5%) !default
856
1021
 
857
1022
  // scss-docs-start form-floating-variables
858
1023
  $form-floating-height: add(3.5rem, $input-height-border) !default;
1024
+ $form-floating-line-height: 1.25 !default;
859
1025
  $form-floating-padding-x: $input-padding-x !default;
860
1026
  $form-floating-padding-y: 1rem !default;
861
1027
  $form-floating-input-padding-t: 1.625rem !default;
@@ -902,9 +1068,10 @@ $form-validation-states: (
902
1068
  $zindex-dropdown: 1000 !default;
903
1069
  $zindex-sticky: 1020 !default;
904
1070
  $zindex-fixed: 1030 !default;
905
- $zindex-modal-backdrop: 1040 !default;
906
- $zindex-offcanvas: 1050 !default;
907
- $zindex-modal: 1060 !default;
1071
+ $zindex-offcanvas-backdrop: 1040 !default;
1072
+ $zindex-offcanvas: 1045 !default;
1073
+ $zindex-modal-backdrop: 1050 !default;
1074
+ $zindex-modal: 1055 !default;
908
1075
  $zindex-popover: 1070 !default;
909
1076
  $zindex-tooltip: 1080 !default;
910
1077
  // scss-docs-end zindex-stack
@@ -939,7 +1106,7 @@ $nav-pills-link-active-bg: $component-active-bg !default;
939
1106
  // Navbar
940
1107
 
941
1108
  // scss-docs-start navbar-variables
942
- $navbar-padding-y: $spacer / 2 !default;
1109
+ $navbar-padding-y: $spacer * .5 !default;
943
1110
  $navbar-padding-x: null !default;
944
1111
 
945
1112
  $navbar-nav-link-padding-x: .5rem !default;
@@ -948,7 +1115,7 @@ $navbar-brand-font-size: $font-size-lg !default;
948
1115
  // Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
949
1116
  $nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
950
1117
  $navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;
951
- $navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default;
1118
+ $navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5 !default;
952
1119
  $navbar-brand-margin-end: 1rem !default;
953
1120
 
954
1121
  $navbar-toggler-padding-y: .25rem !default;
@@ -998,11 +1165,11 @@ $dropdown-border-radius: $border-radius !default;
998
1165
  $dropdown-border-width: $border-width !default;
999
1166
  $dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;
1000
1167
  $dropdown-divider-bg: $dropdown-border-color !default;
1001
- $dropdown-divider-margin-y: $spacer / 2 !default;
1168
+ $dropdown-divider-margin-y: $spacer * .5 !default;
1002
1169
  $dropdown-box-shadow: $box-shadow !default;
1003
1170
 
1004
1171
  $dropdown-link-color: $gray-900 !default;
1005
- $dropdown-link-hover-color: shade-color($gray-900, 10%) !default;
1172
+ $dropdown-link-hover-color: shade-color($dropdown-link-color, 10%) !default;
1006
1173
  $dropdown-link-hover-bg: $gray-200 !default;
1007
1174
 
1008
1175
  $dropdown-link-active-color: $component-active-color !default;
@@ -1010,7 +1177,7 @@ $dropdown-link-active-bg: $component-active-bg !default;
1010
1177
 
1011
1178
  $dropdown-link-disabled-color: $gray-500 !default;
1012
1179
 
1013
- $dropdown-item-padding-y: $spacer / 4 !default;
1180
+ $dropdown-item-padding-y: $spacer * .25 !default;
1014
1181
  $dropdown-item-padding-x: $spacer !default;
1015
1182
 
1016
1183
  $dropdown-header-color: $gray-600 !default;
@@ -1074,17 +1241,25 @@ $pagination-border-radius-lg: $border-radius-lg !default;
1074
1241
  // scss-docs-end pagination-variables
1075
1242
 
1076
1243
 
1244
+ // Placeholders
1245
+
1246
+ // scss-docs-start placeholders
1247
+ $placeholder-opacity-max: .5 !default;
1248
+ $placeholder-opacity-min: .2 !default;
1249
+ // scss-docs-end placeholders
1250
+
1077
1251
  // Cards
1078
1252
 
1079
1253
  // scss-docs-start card-variables
1080
1254
  $card-spacer-y: $spacer !default;
1081
1255
  $card-spacer-x: $spacer !default;
1082
- $card-title-spacer-y: $spacer / 2 !default;
1256
+ $card-title-spacer-y: $spacer * .5 !default;
1083
1257
  $card-border-width: $border-width !default;
1084
- $card-border-radius: $border-radius !default;
1085
1258
  $card-border-color: rgba($black, .125) !default;
1259
+ $card-border-radius: $border-radius !default;
1260
+ $card-box-shadow: null !default;
1086
1261
  $card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;
1087
- $card-cap-padding-y: $card-spacer-y / 2 !default;
1262
+ $card-cap-padding-y: $card-spacer-y * .5 !default;
1088
1263
  $card-cap-padding-x: $card-spacer-x !default;
1089
1264
  $card-cap-bg: rgba($black, .03) !default;
1090
1265
  $card-cap-color: null !default;
@@ -1092,7 +1267,7 @@ $card-height: null !default;
1092
1267
  $card-color: null !default;
1093
1268
  $card-bg: $white !default;
1094
1269
  $card-img-overlay-padding: $spacer !default;
1095
- $card-group-margin: $grid-gutter-width / 2 !default;
1270
+ $card-group-margin: $grid-gutter-width * .5 !default;
1096
1271
  // scss-docs-end card-variables
1097
1272
 
1098
1273
  // Accordion
@@ -1122,7 +1297,7 @@ $accordion-button-focus-border-color: $input-focus-border-color !default;
1122
1297
  $accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;
1123
1298
 
1124
1299
  $accordion-icon-width: 1.25rem !default;
1125
- $accordion-icon-color: $accordion-color !default;
1300
+ $accordion-icon-color: $accordion-button-color !default;
1126
1301
  $accordion-icon-active-color: $accordion-button-active-color !default;
1127
1302
  $accordion-icon-transition: transform .2s ease-in-out !default;
1128
1303
  $accordion-icon-transform: rotate(-180deg) !default;
@@ -1140,8 +1315,8 @@ $tooltip-color: $white !default;
1140
1315
  $tooltip-bg: $black !default;
1141
1316
  $tooltip-border-radius: $border-radius !default;
1142
1317
  $tooltip-opacity: .9 !default;
1143
- $tooltip-padding-y: $spacer / 4 !default;
1144
- $tooltip-padding-x: $spacer / 2 !default;
1318
+ $tooltip-padding-y: $spacer * .25 !default;
1319
+ $tooltip-padding-x: $spacer * .5 !default;
1145
1320
  $tooltip-margin: 0 !default;
1146
1321
 
1147
1322
  $tooltip-arrow-width: .8rem !default;
@@ -1157,7 +1332,7 @@ $form-feedback-tooltip-font-size: $tooltip-font-size !default;
1157
1332
  $form-feedback-tooltip-line-height: null !default;
1158
1333
  $form-feedback-tooltip-opacity: $tooltip-opacity !default;
1159
1334
  $form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
1160
- // scss-docs-start tooltip-feedback-variables
1335
+ // scss-docs-end tooltip-feedback-variables
1161
1336
 
1162
1337
 
1163
1338
  // Popovers
@@ -1199,14 +1374,14 @@ $toast-font-size: .875rem !default;
1199
1374
  $toast-color: null !default;
1200
1375
  $toast-background-color: rgba($white, .85) !default;
1201
1376
  $toast-border-width: 1px !default;
1202
- $toast-border-color: rgba(0, 0, 0, .1) !default;
1377
+ $toast-border-color: rgba($black, .1) !default;
1203
1378
  $toast-border-radius: $border-radius !default;
1204
1379
  $toast-box-shadow: $box-shadow !default;
1205
1380
  $toast-spacing: $container-padding-x !default;
1206
1381
 
1207
1382
  $toast-header-color: $gray-600 !default;
1208
1383
  $toast-header-background-color: rgba($white, .85) !default;
1209
- $toast-header-border-color: rgba(0, 0, 0, .05) !default;
1384
+ $toast-header-border-color: rgba($black, .05) !default;
1210
1385
  // scss-docs-end toast-variables
1211
1386
 
1212
1387
 
@@ -1307,7 +1482,7 @@ $list-group-border-color: rgba($black, .125) !default;
1307
1482
  $list-group-border-width: $border-width !default;
1308
1483
  $list-group-border-radius: $border-radius !default;
1309
1484
 
1310
- $list-group-item-padding-y: $spacer / 2 !default;
1485
+ $list-group-item-padding-y: $spacer * .5 !default;
1311
1486
  $list-group-item-padding-x: $spacer !default;
1312
1487
  $list-group-item-bg-scale: -80% !default;
1313
1488
  $list-group-item-color-scale: 40% !default;
@@ -1448,6 +1623,8 @@ $offcanvas-title-line-height: $modal-title-line-height !default;
1448
1623
  $offcanvas-bg-color: $modal-content-bg !default;
1449
1624
  $offcanvas-color: $modal-content-color !default;
1450
1625
  $offcanvas-box-shadow: $modal-content-box-shadow-xs !default;
1626
+ $offcanvas-backdrop-bg: $modal-backdrop-bg !default;
1627
+ $offcanvas-backdrop-opacity: $modal-backdrop-opacity !default;
1451
1628
  // scss-docs-end offcanvas-variables
1452
1629
 
1453
1630
  // Code
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Bootstrap Utilities v5.0.1 (https://getbootstrap.com/)
2
+ * Bootstrap Utilities v5.1.2 (https://getbootstrap.com/)
3
3
  * Copyright 2011-2021 The Bootstrap Authors
4
4
  * Copyright 2011-2021 Twitter, Inc.
5
5
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
@@ -4,7 +4,7 @@
4
4
  > .form-control,
5
5
  > .form-select {
6
6
  height: $form-floating-height;
7
- padding: $form-floating-padding-y $form-floating-padding-x;
7
+ line-height: $form-floating-line-height;
8
8
  }
9
9
 
10
10
  > label {
@@ -21,6 +21,8 @@
21
21
 
22
22
  // stylelint-disable no-duplicate-selectors
23
23
  > .form-control {
24
+ padding: $form-floating-padding-y $form-floating-padding-x;
25
+
24
26
  &::placeholder {
25
27
  color: transparent;
26
28
  }
@@ -17,7 +17,7 @@
17
17
  .form-check-input {
18
18
  width: $form-check-input-width;
19
19
  height: $form-check-input-width;
20
- margin-top: ($line-height-base - $form-check-input-width) / 2; // line-height minus check height
20
+ margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height
21
21
  vertical-align: top;
22
22
  background-color: $form-check-input-bg;
23
23
  background-repeat: no-repeat;
@@ -199,7 +199,7 @@ textarea {
199
199
  // stylelint-enable selector-no-qualifying-type
200
200
 
201
201
  .form-control-color {
202
- max-width: 3rem;
202
+ width: $form-color-width;
203
203
  height: auto; // Override fixed browser height
204
204
  padding: $input-padding-y;
205
205
 
@@ -27,7 +27,7 @@
27
27
  &::-webkit-slider-thumb {
28
28
  width: $form-range-thumb-width;
29
29
  height: $form-range-thumb-height;
30
- margin-top: ($form-range-track-height - $form-range-thumb-height) / 2; // Webkit specific
30
+ margin-top: ($form-range-track-height - $form-range-thumb-height) * .5; // Webkit specific
31
31
  @include gradient-bg($form-range-thumb-bg);
32
32
  border: $form-range-thumb-border;
33
33
  @include border-radius($form-range-thumb-border-radius);
@@ -7,6 +7,8 @@
7
7
  display: block;
8
8
  width: 100%;
9
9
  padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x;
10
+ // stylelint-disable-next-line property-no-vendor-prefix
11
+ -moz-padding-start: subtract($form-select-padding-x, 3px); // See https://github.com/twbs/bootstrap/issues/32636
10
12
  font-family: $form-select-font-family;
11
13
  @include font-size($form-select-font-size);
12
14
  font-weight: $form-select-font-weight;
@@ -20,6 +22,7 @@
20
22
  border: $form-select-border-width solid $form-select-border-color;
21
23
  @include border-radius($form-select-border-radius, 0);
22
24
  @include box-shadow($form-select-box-shadow);
25
+ @include transition($form-select-transition);
23
26
  appearance: none;
24
27
 
25
28
  &:focus {
@@ -57,6 +60,7 @@
57
60
  padding-bottom: $form-select-padding-y-sm;
58
61
  padding-left: $form-select-padding-x-sm;
59
62
  @include font-size($form-select-font-size-sm);
63
+ @include border-radius($form-select-border-radius-sm);
60
64
  }
61
65
 
62
66
  .form-select-lg {
@@ -64,4 +68,5 @@
64
68
  padding-bottom: $form-select-padding-y-lg;
65
69
  padding-left: $form-select-padding-x-lg;
66
70
  @include font-size($form-select-font-size-lg);
71
+ @include border-radius($form-select-border-radius-lg);
67
72
  }
@@ -0,0 +1,15 @@
1
+ // scss-docs-start stacks
2
+ .hstack {
3
+ display: flex;
4
+ flex-direction: row;
5
+ align-items: center;
6
+ align-self: stretch;
7
+ }
8
+
9
+ .vstack {
10
+ display: flex;
11
+ flex: 1 1 auto;
12
+ flex-direction: column;
13
+ align-self: stretch;
14
+ }
15
+ // scss-docs-end stacks
@@ -0,0 +1,8 @@
1
+ .vr {
2
+ display: inline-block;
3
+ align-self: stretch;
4
+ width: 1px;
5
+ min-height: 1em;
6
+ background-color: currentColor;
7
+ opacity: $hr-opacity;
8
+ }
@@ -0,0 +1,14 @@
1
+ // Shared between modals and offcanvases
2
+ @mixin overlay-backdrop($zindex, $backdrop-bg, $backdrop-opacity) {
3
+ position: fixed;
4
+ top: 0;
5
+ left: 0;
6
+ z-index: $zindex;
7
+ width: 100vw;
8
+ height: 100vh;
9
+ background-color: $backdrop-bg;
10
+
11
+ // Fade for backdrop
12
+ &.fade { opacity: 0; }
13
+ &.show { opacity: $backdrop-opacity; }
14
+ }
@@ -11,7 +11,7 @@
11
11
  $hover-background: if($color == $color-contrast-light, shade-color($background, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)),
12
12
  $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)),
13
13
  $hover-color: color-contrast($hover-background),
14
- $active-background: if($color == $color-contrast-light, shade-color($background,$btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
14
+ $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
15
15
  $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),
16
16
  $active-color: color-contrast($active-background),
17
17
  $disabled-background: $background,