diff options
| author | Mark Otto <[email protected]> | 2022-05-05 21:32:02 -0700 |
|---|---|---|
| committer | GitHub <[email protected]> | 2022-05-05 21:32:02 -0700 |
| commit | bca99232b8bef6a53719e4827de40729098d4ec8 (patch) | |
| tree | b8c3e0280377262d8602e345c8a0be7d9602f13d /scss | |
| parent | 5d9500bdfdd02b3b1d91df2be86b1723f517fc52 (diff) | |
| download | bootstrap-bca99232b8bef6a53719e4827de40729098d4ec8.tar.xz bootstrap-bca99232b8bef6a53719e4827de40729098d4ec8.zip | |
Iterate on border utilities (#36239)
* Remove `--bs-border-opacity: 1` from `.border-*` utilities
We set `--bs-border-opacity: 1` globally at the `:root` level, so redeclaring it on every `.border-*` utility doesn't make much sense. I think we can drop this.
* Remove global border-opacity var, restore on .border-color classes, move .border-color utils down the list to fix some specificity issues
* Add some demos of border utils to the docs
Diffstat (limited to 'scss')
| -rw-r--r-- | scss/_root.scss | 1 | ||||
| -rw-r--r-- | scss/_utilities.scss | 28 |
2 files changed, 14 insertions, 15 deletions
diff --git a/scss/_root.scss b/scss/_root.scss index 36f9849ef..e16d2a3f6 100644 --- a/scss/_root.scss +++ b/scss/_root.scss @@ -57,7 +57,6 @@ --#{$prefix}border-style: #{$border-style}; --#{$prefix}border-color: #{$border-color}; --#{$prefix}border-color-translucent: #{$border-color-translucent}; - --#{$prefix}border-opacity: 1; --#{$prefix}border-radius: #{$border-radius}; --#{$prefix}border-radius-sm: #{$border-radius-sm}; diff --git a/scss/_utilities.scss b/scss/_utilities.scss index 9e6052909..1e0d141ac 100644 --- a/scss/_utilities.scss +++ b/scss/_utilities.scss @@ -98,25 +98,11 @@ $utilities: map-merge( // scss-docs-start utils-borders "border": ( property: border, - local-vars: ( - "border-opacity": 1 - ), values: ( null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) var(--#{$prefix}border-color), 0: 0, ) ), - "border-opacity": ( - css-var: true, - class: border-opacity, - values: ( - 10: .1, - 25: .25, - 50: .5, - 75: .75, - 100: 1 - ) - ), "border-top": ( property: border-top, values: ( @@ -150,6 +136,9 @@ $utilities: map-merge( "border-color": ( property: border-color, class: border, + local-vars: ( + "border-opacity": 1 + ), values: $utilities-border-colors ), "border-width": ( @@ -158,6 +147,17 @@ $utilities: map-merge( class: border, values: $border-widths ), + "border-opacity": ( + css-var: true, + class: border-opacity, + values: ( + 10: .1, + 25: .25, + 50: .5, + 75: .75, + 100: 1 + ) + ), // scss-docs-end utils-borders // Sizing utilities // scss-docs-start utils-sizing |