mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-30 16:50:00 +02:00
Code Issues Releases Wiki Activity

Update color and background-color utilities

Browse Source 
- 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
Download Patch File Download Diff File Expand all files Collapse all files

35
scss/mixins/_utilities.scss
View File

@@ -41,25 +41,46 @@
}
}
$is-css-var: map-get($utility, css-var);
$is-local-vars: map-get($utility, local-vars);
$is-rtl: map-get($utility, rtl);
@if $value != null {
@if $is-rtl == false {
/* rtl:begin:remove */
}
.#{$property-class + $infix + $property-class-modifier} {
@each $property in $properties {
#{$property}: $value if($enable-important-utilities, !important, null);
}
}
@each $pseudo in $state {
.#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
@if $is-css-var {
.#{$property-class + $infix + $property-class-modifier} {
--#{$variable-prefix}#{$property-class}: #{$value};
}
@each $pseudo in $state {
.#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
--#{$variable-prefix}#{$property-class}: #{$value};
}
}
} @else {
.#{$property-class + $infix + $property-class-modifier} {
@each $property in $properties {
@if $is-local-vars {
@each $local-var, $value in $is-local-vars {
--#{$variable-prefix}#{$local-var}: #{$value};
}
}
#{$property}: $value if($enable-important-utilities, !important, null);
}
}
@each $pseudo in $state {
.#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
@each $property in $properties {
#{$property}: $value if($enable-important-utilities, !important, null);
}
}
}
}
@if $is-rtl == false {
/* rtl:end:remove */
}