Rename scale-color() function to shift-color() to avoid collision with Sass's own color function (#32149)

4 files changed, 13 insertions, 14 deletions

diff --git a/scss/_alert.scss b/scss/_alert.scss
index 24fa2bd140..3d9b69bcd3 100644
--- a/scss/_alert.scss
+++ b/scss/_alert.scss
@@ -44,9 +44,9 @@
 // Generate contextual modifier classes for colorizing the alert.
 
 @each $state, $value in $theme-colors {
-  $background: scale-color($value, $alert-bg-scale);
-  $border: scale-color($value, $alert-border-scale);
-  $color: scale-color($value, $alert-color-scale);
+  $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));
   }
diff --git a/scss/_functions.scss b/scss/_functions.scss
index b95fbf94e2..29114fc816 100644
--- a/scss/_functions.scss
+++ b/scss/_functions.scss
@@ -161,9 +161,8 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003
   @return mix(black, $color, $weight);
 }
 
-// Scale a color:
 // Shade the color if the weight is positive, else tint it
-@function scale-color($color, $weight) {
+@function shift-color($color, $weight) {
   @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));
 }
 // scss-docs-end color-functions
diff --git a/scss/_list-group.scss b/scss/_list-group.scss
index 2ce0c8b159..3d82f8f439 100644
--- a/scss/_list-group.scss
+++ b/scss/_list-group.scss
@@ -152,8 +152,8 @@
 // Organizationally, this must come after the `:hover` states.
 
 @each $state, $value in $theme-colors {
-  $background: scale-color($value, $list-group-item-bg-scale);
-  $color: scale-color($value, $list-group-item-color-scale);
+  $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));
   }
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 2a8b45e14c..0b64330e96 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -275,7 +275,7 @@ $body-text-align:           null !default;
 $link-color:                              $primary !default;
 $link-decoration:                         underline !default;
 $link-shade-percentage:                   20% !default;
-$link-hover-color:                        scale-color($link-color, $link-shade-percentage) !default;
+$link-hover-color:                        shift-color($link-color, $link-shade-percentage) !default;
 $link-hover-decoration:                   null !default;
 
 $stretched-link-pseudo-element:           after !default;
@@ -535,12 +535,12 @@ $table-caption-color:         $text-muted !default;
 $table-bg-scale:              -80% !default;
 
 $table-variants: (
-  "primary":    scale-color($primary, $table-bg-scale),
-  "secondary":  scale-color($secondary, $table-bg-scale),
-  "success":    scale-color($success, $table-bg-scale),
-  "info":       scale-color($info, $table-bg-scale),
-  "warning":    scale-color($warning, $table-bg-scale),
-  "danger":     scale-color($danger, $table-bg-scale),
+  "primary":    shift-color($primary, $table-bg-scale),
+  "secondary":  shift-color($secondary, $table-bg-scale),
+  "success":    shift-color($success, $table-bg-scale),
+  "info":       shift-color($info, $table-bg-scale),
+  "warning":    shift-color($warning, $table-bg-scale),
+  "danger":     shift-color($danger, $table-bg-scale),
   "light":      $light,
   "dark":       $dark,
 ) !default;