1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-31 09:05:47 +02:00

Update color and background-color utilities

- Adds new functions to generate additional Sass maps
- Adds new root variables for rgb() versions of our theme colors, plus a few extras
- Adds ability to change the alpha transparency of text color and background color utilities with new utilities, inline styles, or local CSS var
- Updates documentation for color and background-color utilities pages
- Deprecates .text-black-50 and .text-white-50 since those (and additional transparency levels) can be generated on the fly

Change approach slightly to prevent cascade
This commit is contained in:
Mark Otto
2021-05-24 11:56:19 -07:00
committed by Mark Otto
parent a2f92d1aab
commit e72916e5b7
7 changed files with 223 additions and 15 deletions

View File

@@ -514,32 +514,55 @@ $utilities: map-merge(
"color": (
property: color,
class: text,
local-vars: (
"text-opacity": 1
),
values: map-merge(
$theme-colors,
$utilities-text-colors,
(
"white": $white,
"body": $body-color,
"muted": $text-muted,
"black-50": rgba($black, .5),
"white-50": rgba($white, .5),
"black-50": rgba($black, .5), // deprecated
"white-50": rgba($white, .5), // deprecated
"reset": inherit,
)
)
),
"text-opacity": (
css-var: true,
class: text-opacity,
values: (
25: .25,
50: .5,
75: .75,
100: 1
)
),
// scss-docs-end utils-color
// scss-docs-start utils-bg-color
"background-color": (
property: background-color,
class: bg,
local-vars: (
"bg-opacity": 1
),
values: map-merge(
$theme-colors,
$utilities-bg-colors,
(
"body": $body-bg,
"white": $white,
"transparent": transparent
)
)
),
"bg-opacity": (
css-var: true,
class: bg-opacity,
values: (
10: .1,
25: .25,
50: .5,
75: .75,
100: 1
)
),
// scss-docs-end utils-bg-color
"gradient": (
property: background-image,