diff options
| author | Rafi <rafi.bogra@gmail.com> | 2020-12-17 08:02:20 +0300 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2020-12-17 08:02:20 +0300 |
| commit | b424650ab51bc5163f7d07cd4a8d9f5a5a364f19 (patch) | |
| tree | c40285030b6fc3e82cd2380df27a08bc141456bc /scss | |
| parent | f12657b39ff9c8ba2826b01a1690ed57db14e684 (diff) | |
Fix: variables collide with globals (#32492)
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Diffstat (limited to 'scss')
| -rw-r--r-- | scss/_alert.scss | 12 | ||||
| -rw-r--r-- | scss/_list-group.scss | 10 |
2 files changed, 11 insertions, 11 deletions
diff --git a/scss/_alert.scss b/scss/_alert.scss index 3d9b69bcd3..34f1e84edf 100644 --- a/scss/_alert.scss +++ b/scss/_alert.scss @@ -44,14 +44,14 @@ // Generate contextual modifier classes for colorizing the alert. @each $state, $value in $theme-colors { - $background: shift-color($value, $alert-bg-scale); - $border: shift-color($value, $alert-border-scale); - $color: shift-color($value, $alert-color-scale); - @if (contrast-ratio($background, $color) < $min-contrast-ratio) { - $color: mix($value, color-contrast($background), abs($alert-color-scale)); + $alert-background: shift-color($value, $alert-bg-scale); + $alert-border: shift-color($value, $alert-border-scale); + $alert-color: shift-color($value, $alert-color-scale); + @if (contrast-ratio($alert-background, $alert-color) < $min-contrast-ratio) { + $alert-color: mix($value, color-contrast($alert-background), abs($alert-color-scale)); } .alert-#{$state} { - @include alert-variant($background, $border, $color); + @include alert-variant($alert-background, $alert-border, $alert-color); } } // scss-docs-end alert-modifiers diff --git a/scss/_list-group.scss b/scss/_list-group.scss index a95adc181c..7e23b8e0c0 100644 --- a/scss/_list-group.scss +++ b/scss/_list-group.scss @@ -152,12 +152,12 @@ // Organizationally, this must come after the `:hover` states. @each $state, $value in $theme-colors { - $background: shift-color($value, $list-group-item-bg-scale); - $color: shift-color($value, $list-group-item-color-scale); - @if (contrast-ratio($background, $color) < $min-contrast-ratio) { - $color: mix($value, color-contrast($background), abs($alert-color-scale)); + $list-group-background: shift-color($value, $list-group-item-bg-scale); + $list-group-color: shift-color($value, $list-group-item-color-scale); + @if (contrast-ratio($list-group-background, $list-group-color) < $min-contrast-ratio) { + $list-group-color: mix($value, color-contrast($list-group-background), abs($alert-color-scale)); } - @include list-group-item-variant($state, $background, $color); + @include list-group-item-variant($state, $list-group-background, $list-group-color); } // scss-docs-end list-group-modifiers |