summaryrefslogtreecommitdiffstats
path: root/scss/_utilities.scss
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2023-06-24 12:44:40 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2023-06-24 12:44:49 +0000
commitdb46bfc03f3a22752ef6bd91ae577d893872a216 (patch)
tree89d924513bc95e6bac4dc8e26f0da84caa477b7b /scss/_utilities.scss
parentReleasing debian version 5.2.3+dfsg-8. (diff)
downloadbootstrap-html-db46bfc03f3a22752ef6bd91ae577d893872a216.tar.xz
bootstrap-html-db46bfc03f3a22752ef6bd91ae577d893872a216.zip
Merging upstream version 5.3.0+dfsg.
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'scss/_utilities.scss')
-rw-r--r--scss/_utilities.scss185
1 files changed, 172 insertions, 13 deletions
diff --git a/scss/_utilities.scss b/scss/_utilities.scss
index 1e0d141..e6069c9 100644
--- a/scss/_utilities.scss
+++ b/scss/_utilities.scss
@@ -22,6 +22,20 @@ $utilities: map-merge(
)
),
// scss-docs-end utils-float
+ // Object Fit utilities
+ // scss-docs-start utils-object-fit
+ "object-fit": (
+ responsive: true,
+ property: object-fit,
+ values: (
+ contain: contain,
+ cover: cover,
+ fill: fill,
+ scale: scale-down,
+ none: none,
+ )
+ ),
+ // scss-docs-end utils-object-fit
// Opacity utilities
// scss-docs-start utils-opacity
"opacity": (
@@ -40,6 +54,14 @@ $utilities: map-merge(
property: overflow,
values: auto hidden visible scroll,
),
+ "overflow-x": (
+ property: overflow-x,
+ values: auto hidden visible scroll,
+ ),
+ "overflow-y": (
+ property: overflow-y,
+ values: auto hidden visible scroll,
+ ),
// scss-docs-end utils-overflow
// scss-docs-start utils-display
"display": (
@@ -47,7 +69,7 @@ $utilities: map-merge(
print: true,
property: display,
class: d,
- values: inline inline-block block grid table table-row table-cell flex inline-flex none
+ values: inline inline-block block grid inline-grid table table-row table-cell flex inline-flex none
),
// scss-docs-end utils-display
// scss-docs-start utils-shadow
@@ -62,6 +84,14 @@ $utilities: map-merge(
)
),
// scss-docs-end utils-shadow
+ // scss-docs-start utils-focus-ring
+ "focus-ring": (
+ css-var: true,
+ css-variable-name: focus-ring-color,
+ class: focus-ring,
+ values: map-loop($theme-colors-rgb, rgba-css-var, "$key", "focus-ring")
+ ),
+ // scss-docs-end utils-focus-ring
// scss-docs-start utils-position
"position": (
property: position,
@@ -141,9 +171,13 @@ $utilities: map-merge(
),
values: $utilities-border-colors
),
+ "subtle-border-color": (
+ property: border-color,
+ class: border,
+ values: $utilities-border-subtle
+ ),
"border-width": (
- css-var: true,
- css-variable-name: border-width,
+ property: border-width,
class: border,
values: $border-widths
),
@@ -450,6 +484,18 @@ $utilities: map-merge(
class: gap,
values: $spacers
),
+ "row-gap": (
+ responsive: true,
+ property: row-gap,
+ class: row-gap,
+ values: $spacers
+ ),
+ "column-gap": (
+ responsive: true,
+ property: column-gap,
+ class: column-gap,
+ values: $spacers
+ ),
// scss-docs-end utils-spacing
// Text
// scss-docs-start utils-text
@@ -473,11 +519,12 @@ $utilities: map-merge(
property: font-weight,
class: fw,
values: (
- light: $font-weight-light,
lighter: $font-weight-lighter,
+ light: $font-weight-light,
normal: $font-weight-normal,
- bold: $font-weight-bold,
+ medium: $font-weight-medium,
semibold: $font-weight-semibold,
+ bold: $font-weight-bold,
bolder: $font-weight-bolder
)
),
@@ -535,9 +582,12 @@ $utilities: map-merge(
values: map-merge(
$utilities-text-colors,
(
- "muted": $text-muted,
+ "muted": var(--#{$prefix}secondary-color), // deprecated
"black-50": rgba($black, .5), // deprecated
"white-50": rgba($white, .5), // deprecated
+ "body-secondary": var(--#{$prefix}secondary-color),
+ "body-tertiary": var(--#{$prefix}tertiary-color),
+ "body-emphasis": var(--#{$prefix}emphasis-color),
"reset": inherit,
)
)
@@ -552,7 +602,62 @@ $utilities: map-merge(
100: 1
)
),
+ "text-color": (
+ property: color,
+ class: text,
+ values: $utilities-text-emphasis-colors
+ ),
// scss-docs-end utils-color
+ // scss-docs-start utils-links
+ "link-opacity": (
+ css-var: true,
+ class: link-opacity,
+ state: hover,
+ values: (
+ 10: .1,
+ 25: .25,
+ 50: .5,
+ 75: .75,
+ 100: 1
+ )
+ ),
+ "link-offset": (
+ property: text-underline-offset,
+ class: link-offset,
+ state: hover,
+ values: (
+ 1: .125em,
+ 2: .25em,
+ 3: .375em,
+ )
+ ),
+ "link-underline": (
+ property: text-decoration-color,
+ class: link-underline,
+ local-vars: (
+ "link-underline-opacity": 1
+ ),
+ values: map-merge(
+ $utilities-links-underline,
+ (
+ null: rgba(var(--#{$prefix}link-color-rgb), var(--#{$prefix}link-underline-opacity, 1)),
+ )
+ )
+ ),
+ "link-underline-opacity": (
+ css-var: true,
+ class: link-underline-opacity,
+ state: hover,
+ values: (
+ 0: 0,
+ 10: .1,
+ 25: .25,
+ 50: .5,
+ 75: .75,
+ 100: 1
+ ),
+ ),
+ // scss-docs-end utils-links
// scss-docs-start utils-bg-color
"background-color": (
property: background-color,
@@ -563,7 +668,9 @@ $utilities: map-merge(
values: map-merge(
$utilities-bg-colors,
(
- "transparent": transparent
+ "transparent": transparent,
+ "body-secondary": rgba(var(--#{$prefix}secondary-bg-rgb), var(--#{$prefix}bg-opacity)),
+ "body-tertiary": rgba(var(--#{$prefix}tertiary-bg-rgb), var(--#{$prefix}bg-opacity)),
)
)
),
@@ -578,6 +685,11 @@ $utilities: map-merge(
100: 1
)
),
+ "subtle-background-color": (
+ property: background-color,
+ class: bg,
+ values: $utilities-bg-subtle
+ ),
// scss-docs-end utils-bg-color
"gradient": (
property: background-image,
@@ -606,7 +718,7 @@ $utilities: map-merge(
2: var(--#{$prefix}border-radius),
3: var(--#{$prefix}border-radius-lg),
4: var(--#{$prefix}border-radius-xl),
- 5: var(--#{$prefix}border-radius-2xl),
+ 5: var(--#{$prefix}border-radius-xxl),
circle: 50%,
pill: var(--#{$prefix}border-radius-pill)
)
@@ -614,22 +726,62 @@ $utilities: map-merge(
"rounded-top": (
property: border-top-left-radius border-top-right-radius,
class: rounded-top,
- values: (null: var(--#{$prefix}border-radius))
+ values: (
+ null: var(--#{$prefix}border-radius),
+ 0: 0,
+ 1: var(--#{$prefix}border-radius-sm),
+ 2: var(--#{$prefix}border-radius),
+ 3: var(--#{$prefix}border-radius-lg),
+ 4: var(--#{$prefix}border-radius-xl),
+ 5: var(--#{$prefix}border-radius-xxl),
+ circle: 50%,
+ pill: var(--#{$prefix}border-radius-pill)
+ )
),
"rounded-end": (
property: border-top-right-radius border-bottom-right-radius,
class: rounded-end,
- values: (null: var(--#{$prefix}border-radius))
+ values: (
+ null: var(--#{$prefix}border-radius),
+ 0: 0,
+ 1: var(--#{$prefix}border-radius-sm),
+ 2: var(--#{$prefix}border-radius),
+ 3: var(--#{$prefix}border-radius-lg),
+ 4: var(--#{$prefix}border-radius-xl),
+ 5: var(--#{$prefix}border-radius-xxl),
+ circle: 50%,
+ pill: var(--#{$prefix}border-radius-pill)
+ )
),
"rounded-bottom": (
property: border-bottom-right-radius border-bottom-left-radius,
class: rounded-bottom,
- values: (null: var(--#{$prefix}border-radius))
+ values: (
+ null: var(--#{$prefix}border-radius),
+ 0: 0,
+ 1: var(--#{$prefix}border-radius-sm),
+ 2: var(--#{$prefix}border-radius),
+ 3: var(--#{$prefix}border-radius-lg),
+ 4: var(--#{$prefix}border-radius-xl),
+ 5: var(--#{$prefix}border-radius-xxl),
+ circle: 50%,
+ pill: var(--#{$prefix}border-radius-pill)
+ )
),
"rounded-start": (
property: border-bottom-left-radius border-top-left-radius,
class: rounded-start,
- values: (null: var(--#{$prefix}border-radius))
+ values: (
+ null: var(--#{$prefix}border-radius),
+ 0: 0,
+ 1: var(--#{$prefix}border-radius-sm),
+ 2: var(--#{$prefix}border-radius),
+ 3: var(--#{$prefix}border-radius-lg),
+ 4: var(--#{$prefix}border-radius-xl),
+ 5: var(--#{$prefix}border-radius-xxl),
+ circle: 50%,
+ pill: var(--#{$prefix}border-radius-pill)
+ )
),
// scss-docs-end utils-border-radius
// scss-docs-start utils-visibility
@@ -640,8 +792,15 @@ $utilities: map-merge(
visible: visible,
invisible: hidden,
)
- )
+ ),
// scss-docs-end utils-visibility
+ // scss-docs-start utils-zindex
+ "z-index": (
+ property: z-index,
+ class: z,
+ values: $zindex-levels,
+ )
+ // scss-docs-end utils-zindex
),
$utilities
);