bootstrap-scss 5.2.0 → 5.2.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (86) hide show
  1. package/README.md +1 -1
  2. package/_accordion.scss +149 -146
  3. package/_alert.scss +71 -71
  4. package/_badge.scss +38 -38
  5. package/_breadcrumb.scss +40 -40
  6. package/_button-group.scss +142 -142
  7. package/_buttons.scss +207 -186
  8. package/_card.scss +234 -234
  9. package/_carousel.scss +229 -229
  10. package/_close.scss +40 -40
  11. package/_containers.scss +41 -41
  12. package/_dropdown.scss +249 -248
  13. package/_forms.scss +9 -9
  14. package/_functions.scss +302 -302
  15. package/_grid.scss +33 -33
  16. package/_helpers.scss +10 -10
  17. package/_list-group.scss +192 -191
  18. package/_maps.scss +54 -54
  19. package/_mixins.scss +43 -43
  20. package/_modal.scss +237 -237
  21. package/_nav.scss +172 -172
  22. package/_navbar.scss +278 -276
  23. package/_offcanvas.scss +144 -143
  24. package/_pagination.scss +109 -109
  25. package/_placeholders.scss +51 -51
  26. package/_popover.scss +196 -196
  27. package/_progress.scss +59 -59
  28. package/_reboot.scss +610 -610
  29. package/_root.scss +73 -73
  30. package/_spinners.scss +85 -85
  31. package/_tables.scss +164 -164
  32. package/_toasts.scss +73 -70
  33. package/_tooltip.scss +120 -120
  34. package/_transitions.scss +27 -27
  35. package/_type.scss +106 -106
  36. package/_utilities.scss +647 -647
  37. package/_variables.scss +1634 -1633
  38. package/bootstrap-grid.scss +64 -64
  39. package/bootstrap-reboot.scss +9 -9
  40. package/bootstrap-utilities.scss +15 -15
  41. package/bootstrap.scss +51 -51
  42. package/forms/_floating-labels.scss +75 -74
  43. package/forms/_form-check.scss +175 -175
  44. package/forms/_form-control.scss +194 -194
  45. package/forms/_form-range.scss +91 -91
  46. package/forms/_form-select.scss +71 -71
  47. package/forms/_form-text.scss +11 -11
  48. package/forms/_input-group.scss +132 -129
  49. package/forms/_labels.scss +36 -36
  50. package/forms/_validation.scss +12 -12
  51. package/helpers/_clearfix.scss +3 -3
  52. package/helpers/_color-bg.scss +10 -10
  53. package/helpers/_colored-links.scss +12 -12
  54. package/helpers/_position.scss +36 -36
  55. package/helpers/_ratio.scss +26 -26
  56. package/helpers/_stacks.scss +15 -15
  57. package/helpers/_stretched-link.scss +15 -15
  58. package/helpers/_text-truncation.scss +7 -7
  59. package/helpers/_visually-hidden.scss +8 -8
  60. package/helpers/_vr.scss +8 -8
  61. package/mixins/_alert.scss +15 -15
  62. package/mixins/_backdrop.scss +14 -14
  63. package/mixins/_banner.scss +9 -9
  64. package/mixins/_border-radius.scss +78 -78
  65. package/mixins/_box-shadow.scss +18 -18
  66. package/mixins/_breakpoints.scss +127 -127
  67. package/mixins/_buttons.scss +70 -70
  68. package/mixins/_caret.scss +64 -64
  69. package/mixins/_clearfix.scss +9 -9
  70. package/mixins/_color-scheme.scss +7 -7
  71. package/mixins/_container.scss +11 -11
  72. package/mixins/_forms.scss +152 -152
  73. package/mixins/_gradients.scss +47 -47
  74. package/mixins/_grid.scss +151 -151
  75. package/mixins/_image.scss +16 -16
  76. package/mixins/_list-group.scss +24 -24
  77. package/mixins/_lists.scss +7 -7
  78. package/mixins/_pagination.scss +10 -10
  79. package/mixins/_reset-text.scss +17 -17
  80. package/mixins/_table-variants.scss +24 -24
  81. package/mixins/_transition.scss +26 -26
  82. package/mixins/_utilities.scss +97 -97
  83. package/mixins/_visually-hidden.scss +29 -29
  84. package/package.json +1 -1
  85. package/utilities/_api.scss +47 -47
  86. package/vendor/_rfs.scss +354 -354
@@ -1,97 +1,97 @@
1
- // Utility generator
2
- // Used to generate utilities & print utilities
3
- @mixin generate-utility($utility, $infix, $is-rfs-media-query: false) {
4
- $values: map-get($utility, values);
5
-
6
- // If the values are a list or string, convert it into a map
7
- @if type-of($values) == "string" or type-of(nth($values, 1)) != "list" {
8
- $values: zip($values, $values);
9
- }
10
-
11
- @each $key, $value in $values {
12
- $properties: map-get($utility, property);
13
-
14
- // Multiple properties are possible, for example with vertical or horizontal margins or paddings
15
- @if type-of($properties) == "string" {
16
- $properties: append((), $properties);
17
- }
18
-
19
- // Use custom class if present
20
- $property-class: if(map-has-key($utility, class), map-get($utility, class), nth($properties, 1));
21
- $property-class: if($property-class == null, "", $property-class);
22
-
23
- // Use custom CSS variable name if present, otherwise default to `class`
24
- $css-variable-name: if(map-has-key($utility, css-variable-name), map-get($utility, css-variable-name), map-get($utility, class));
25
-
26
- // State params to generate pseudo-classes
27
- $state: if(map-has-key($utility, state), map-get($utility, state), ());
28
-
29
- $infix: if($property-class == "" and str-slice($infix, 1, 1) == "-", str-slice($infix, 2), $infix);
30
-
31
- // Don't prefix if value key is null (eg. with shadow class)
32
- $property-class-modifier: if($key, if($property-class == "" and $infix == "", "", "-") + $key, "");
33
-
34
- @if map-get($utility, rfs) {
35
- // Inside the media query
36
- @if $is-rfs-media-query {
37
- $val: rfs-value($value);
38
-
39
- // Do not render anything if fluid and non fluid values are the same
40
- $value: if($val == rfs-fluid-value($value), null, $val);
41
- }
42
- @else {
43
- $value: rfs-fluid-value($value);
44
- }
45
- }
46
-
47
- $is-css-var: map-get($utility, css-var);
48
- $is-local-vars: map-get($utility, local-vars);
49
- $is-rtl: map-get($utility, rtl);
50
-
51
- @if $value != null {
52
- @if $is-rtl == false {
53
- /* rtl:begin:remove */
54
- }
55
-
56
- @if $is-css-var {
57
- .#{$property-class + $infix + $property-class-modifier} {
58
- --#{$prefix}#{$css-variable-name}: #{$value};
59
- }
60
-
61
- @each $pseudo in $state {
62
- .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
63
- --#{$prefix}#{$css-variable-name}: #{$value};
64
- }
65
- }
66
- } @else {
67
- .#{$property-class + $infix + $property-class-modifier} {
68
- @each $property in $properties {
69
- @if $is-local-vars {
70
- @each $local-var, $variable in $is-local-vars {
71
- --#{$prefix}#{$local-var}: #{$variable};
72
- }
73
- }
74
- #{$property}: $value if($enable-important-utilities, !important, null);
75
- }
76
- }
77
-
78
- @each $pseudo in $state {
79
- .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
80
- @each $property in $properties {
81
- @if $is-local-vars {
82
- @each $local-var, $variable in $is-local-vars {
83
- --#{$prefix}#{$local-var}: #{$variable};
84
- }
85
- }
86
- #{$property}: $value if($enable-important-utilities, !important, null);
87
- }
88
- }
89
- }
90
- }
91
-
92
- @if $is-rtl == false {
93
- /* rtl:end:remove */
94
- }
95
- }
96
- }
97
- }
1
+ // Utility generator
2
+ // Used to generate utilities & print utilities
3
+ @mixin generate-utility($utility, $infix, $is-rfs-media-query: false) {
4
+ $values: map-get($utility, values);
5
+
6
+ // If the values are a list or string, convert it into a map
7
+ @if type-of($values) == "string" or type-of(nth($values, 1)) != "list" {
8
+ $values: zip($values, $values);
9
+ }
10
+
11
+ @each $key, $value in $values {
12
+ $properties: map-get($utility, property);
13
+
14
+ // Multiple properties are possible, for example with vertical or horizontal margins or paddings
15
+ @if type-of($properties) == "string" {
16
+ $properties: append((), $properties);
17
+ }
18
+
19
+ // Use custom class if present
20
+ $property-class: if(map-has-key($utility, class), map-get($utility, class), nth($properties, 1));
21
+ $property-class: if($property-class == null, "", $property-class);
22
+
23
+ // Use custom CSS variable name if present, otherwise default to `class`
24
+ $css-variable-name: if(map-has-key($utility, css-variable-name), map-get($utility, css-variable-name), map-get($utility, class));
25
+
26
+ // State params to generate pseudo-classes
27
+ $state: if(map-has-key($utility, state), map-get($utility, state), ());
28
+
29
+ $infix: if($property-class == "" and str-slice($infix, 1, 1) == "-", str-slice($infix, 2), $infix);
30
+
31
+ // Don't prefix if value key is null (e.g. with shadow class)
32
+ $property-class-modifier: if($key, if($property-class == "" and $infix == "", "", "-") + $key, "");
33
+
34
+ @if map-get($utility, rfs) {
35
+ // Inside the media query
36
+ @if $is-rfs-media-query {
37
+ $val: rfs-value($value);
38
+
39
+ // Do not render anything if fluid and non fluid values are the same
40
+ $value: if($val == rfs-fluid-value($value), null, $val);
41
+ }
42
+ @else {
43
+ $value: rfs-fluid-value($value);
44
+ }
45
+ }
46
+
47
+ $is-css-var: map-get($utility, css-var);
48
+ $is-local-vars: map-get($utility, local-vars);
49
+ $is-rtl: map-get($utility, rtl);
50
+
51
+ @if $value != null {
52
+ @if $is-rtl == false {
53
+ /* rtl:begin:remove */
54
+ }
55
+
56
+ @if $is-css-var {
57
+ .#{$property-class + $infix + $property-class-modifier} {
58
+ --#{$prefix}#{$css-variable-name}: #{$value};
59
+ }
60
+
61
+ @each $pseudo in $state {
62
+ .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
63
+ --#{$prefix}#{$css-variable-name}: #{$value};
64
+ }
65
+ }
66
+ } @else {
67
+ .#{$property-class + $infix + $property-class-modifier} {
68
+ @each $property in $properties {
69
+ @if $is-local-vars {
70
+ @each $local-var, $variable in $is-local-vars {
71
+ --#{$prefix}#{$local-var}: #{$variable};
72
+ }
73
+ }
74
+ #{$property}: $value if($enable-important-utilities, !important, null);
75
+ }
76
+ }
77
+
78
+ @each $pseudo in $state {
79
+ .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
80
+ @each $property in $properties {
81
+ @if $is-local-vars {
82
+ @each $local-var, $variable in $is-local-vars {
83
+ --#{$prefix}#{$local-var}: #{$variable};
84
+ }
85
+ }
86
+ #{$property}: $value if($enable-important-utilities, !important, null);
87
+ }
88
+ }
89
+ }
90
+ }
91
+
92
+ @if $is-rtl == false {
93
+ /* rtl:end:remove */
94
+ }
95
+ }
96
+ }
97
+ }
@@ -1,29 +1,29 @@
1
- // stylelint-disable declaration-no-important
2
-
3
- // Hide content visually while keeping it accessible to assistive technologies
4
- //
5
- // See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
6
- // See: https://kittygiraudel.com/2016/10/13/css-hide-and-seek/
7
-
8
- @mixin visually-hidden() {
9
- position: absolute !important;
10
- width: 1px !important;
11
- height: 1px !important;
12
- padding: 0 !important;
13
- margin: -1px !important; // Fix for https://github.com/twbs/bootstrap/issues/25686
14
- overflow: hidden !important;
15
- clip: rect(0, 0, 0, 0) !important;
16
- white-space: nowrap !important;
17
- border: 0 !important;
18
- }
19
-
20
- // Use to only display content when it's focused, or one of its child elements is focused
21
- // (i.e. when focus is within the element/container that the class was applied to)
22
- //
23
- // Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
24
-
25
- @mixin visually-hidden-focusable() {
26
- &:not(:focus):not(:focus-within) {
27
- @include visually-hidden();
28
- }
29
- }
1
+ // stylelint-disable declaration-no-important
2
+
3
+ // Hide content visually while keeping it accessible to assistive technologies
4
+ //
5
+ // See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
6
+ // See: https://kittygiraudel.com/2016/10/13/css-hide-and-seek/
7
+
8
+ @mixin visually-hidden() {
9
+ position: absolute !important;
10
+ width: 1px !important;
11
+ height: 1px !important;
12
+ padding: 0 !important;
13
+ margin: -1px !important; // Fix for https://github.com/twbs/bootstrap/issues/25686
14
+ overflow: hidden !important;
15
+ clip: rect(0, 0, 0, 0) !important;
16
+ white-space: nowrap !important;
17
+ border: 0 !important;
18
+ }
19
+
20
+ // Use to only display content when it's focused, or one of its child elements is focused
21
+ // (i.e. when focus is within the element/container that the class was applied to)
22
+ //
23
+ // Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
24
+
25
+ @mixin visually-hidden-focusable() {
26
+ &:not(:focus):not(:focus-within) {
27
+ @include visually-hidden();
28
+ }
29
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "bootstrap-scss",
3
- "version": "5.2.0",
3
+ "version": "5.2.2",
4
4
  "description": "Bootstrap's SCSS files (only)",
5
5
  "main": "bootstrap.scss",
6
6
  "repository": {
@@ -1,47 +1,47 @@
1
- // Loop over each breakpoint
2
- @each $breakpoint in map-keys($grid-breakpoints) {
3
-
4
- // Generate media query if needed
5
- @include media-breakpoint-up($breakpoint) {
6
- $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
7
-
8
- // Loop over each utility property
9
- @each $key, $utility in $utilities {
10
- // The utility can be disabled with `false`, thus check if the utility is a map first
11
- // Only proceed if responsive media queries are enabled or if it's the base media query
12
- @if type-of($utility) == "map" and (map-get($utility, responsive) or $infix == "") {
13
- @include generate-utility($utility, $infix);
14
- }
15
- }
16
- }
17
- }
18
-
19
- // RFS rescaling
20
- @media (min-width: $rfs-mq-value) {
21
- @each $breakpoint in map-keys($grid-breakpoints) {
22
- $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
23
-
24
- @if (map-get($grid-breakpoints, $breakpoint) < $rfs-breakpoint) {
25
- // Loop over each utility property
26
- @each $key, $utility in $utilities {
27
- // The utility can be disabled with `false`, thus check if the utility is a map first
28
- // Only proceed if responsive media queries are enabled or if it's the base media query
29
- @if type-of($utility) == "map" and map-get($utility, rfs) and (map-get($utility, responsive) or $infix == "") {
30
- @include generate-utility($utility, $infix, true);
31
- }
32
- }
33
- }
34
- }
35
- }
36
-
37
-
38
- // Print utilities
39
- @media print {
40
- @each $key, $utility in $utilities {
41
- // The utility can be disabled with `false`, thus check if the utility is a map first
42
- // Then check if the utility needs print styles
43
- @if type-of($utility) == "map" and map-get($utility, print) == true {
44
- @include generate-utility($utility, "-print");
45
- }
46
- }
47
- }
1
+ // Loop over each breakpoint
2
+ @each $breakpoint in map-keys($grid-breakpoints) {
3
+
4
+ // Generate media query if needed
5
+ @include media-breakpoint-up($breakpoint) {
6
+ $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
7
+
8
+ // Loop over each utility property
9
+ @each $key, $utility in $utilities {
10
+ // The utility can be disabled with `false`, thus check if the utility is a map first
11
+ // Only proceed if responsive media queries are enabled or if it's the base media query
12
+ @if type-of($utility) == "map" and (map-get($utility, responsive) or $infix == "") {
13
+ @include generate-utility($utility, $infix);
14
+ }
15
+ }
16
+ }
17
+ }
18
+
19
+ // RFS rescaling
20
+ @media (min-width: $rfs-mq-value) {
21
+ @each $breakpoint in map-keys($grid-breakpoints) {
22
+ $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
23
+
24
+ @if (map-get($grid-breakpoints, $breakpoint) < $rfs-breakpoint) {
25
+ // Loop over each utility property
26
+ @each $key, $utility in $utilities {
27
+ // The utility can be disabled with `false`, thus check if the utility is a map first
28
+ // Only proceed if responsive media queries are enabled or if it's the base media query
29
+ @if type-of($utility) == "map" and map-get($utility, rfs) and (map-get($utility, responsive) or $infix == "") {
30
+ @include generate-utility($utility, $infix, true);
31
+ }
32
+ }
33
+ }
34
+ }
35
+ }
36
+
37
+
38
+ // Print utilities
39
+ @media print {
40
+ @each $key, $utility in $utilities {
41
+ // The utility can be disabled with `false`, thus check if the utility is a map first
42
+ // Then check if the utility needs print styles
43
+ @if type-of($utility) == "map" and map-get($utility, print) == true {
44
+ @include generate-utility($utility, "-print");
45
+ }
46
+ }
47
+ }