rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-03-15 15:29:22 +01:00
Code Issues Actions Packages Releases Activity

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

Browse Source
This commit is contained in:
Mark Otto 2020-11-13 10:50:59 -08:00 committed by GitHub
parent 483b6413e9
commit 55f2192a39
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 20 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
scss/_alert.scss
View File

@ -44,9 +44,9 @@
// Generate contextual modifier classes for colorizing the alert. // Generate contextual modifier classes for colorizing the alert.
@each $state, $value in $theme-colors { @each $state, $value in $theme-colors {
$background: scale-color($value, $alert-bg-scale); $background: shift-color($value, $alert-bg-scale);
$border: scale-color($value, $alert-border-scale); $border: shift-color($value, $alert-border-scale);
$color: scale-color($value, $alert-color-scale); $color: shift-color($value, $alert-color-scale);
@if (contrast-ratio($background, $color) < $min-contrast-ratio) { @if (contrast-ratio($background, $color) < $min-contrast-ratio) {
$color: mix($value, color-contrast($background), abs($alert-color-scale)); $color: mix($value, color-contrast($background), abs($alert-color-scale));
} }

3
scss/_functions.scss
View File

@ -161,9 +161,8 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003
@return mix(black, $color, $weight); @return mix(black, $color, $weight);
} }
// Scale a color:
// Shade the color if the weight is positive, else tint it // 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)); @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));
} }
// scss-docs-end color-functions // scss-docs-end color-functions

4
scss/_list-group.scss
View File

@ -152,8 +152,8 @@
// Organizationally, this must come after the `:hover` states. // Organizationally, this must come after the `:hover` states.
@each $state, $value in $theme-colors { @each $state, $value in $theme-colors {
$background: scale-color($value, $list-group-item-bg-scale); $background: shift-color($value, $list-group-item-bg-scale);
$color: scale-color($value, $list-group-item-color-scale); $color: shift-color($value, $list-group-item-color-scale);
@if (contrast-ratio($background, $color) < $min-contrast-ratio) { @if (contrast-ratio($background, $color) < $min-contrast-ratio) {
$color: mix($value, color-contrast($background), abs($alert-color-scale)); $color: mix($value, color-contrast($background), abs($alert-color-scale));
} }

14
scss/_variables.scss
View File

@ -275,7 +275,7 @@ $body-text-align: null !default;
$link-color: $primary !default; $link-color: $primary !default;
$link-decoration: underline !default; $link-decoration: underline !default;
$link-shade-percentage: 20% !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; $link-hover-decoration: null !default;
$stretched-link-pseudo-element: after !default; $stretched-link-pseudo-element: after !default;
@ -535,12 +535,12 @@ $table-caption-color: $text-muted !default;
$table-bg-scale: -80% !default; $table-bg-scale: -80% !default;
$table-variants: ( $table-variants: (
"primary": scale-color($primary, $table-bg-scale), "primary": shift-color($primary, $table-bg-scale),
"secondary": scale-color($secondary, $table-bg-scale), "secondary": shift-color($secondary, $table-bg-scale),
"success": scale-color($success, $table-bg-scale), "success": shift-color($success, $table-bg-scale),
"info": scale-color($info, $table-bg-scale), "info": shift-color($info, $table-bg-scale),
"warning": scale-color($warning, $table-bg-scale), "warning": shift-color($warning, $table-bg-scale),
"danger": scale-color($danger, $table-bg-scale), "danger": shift-color($danger, $table-bg-scale),
"light": $light, "light": $light,
"dark": $dark, "dark": $dark,
) !default; ) !default;

8
site/content/docs/5.0/migration.md
View File

@ -7,6 +7,12 @@ aliases: "/migration/"
toc: true toc: true
--- ---
## Beta 1
### Sass
- Renamed `scale-color()` function to `shift-color()` to avoid collision with Sass's own color scaling function.
## v5.0.0-alpha3 ## v5.0.0-alpha3
### Browser support ### Browser support
@ -15,7 +21,7 @@ toc: true
### Sass ### Sass
- The color system which worked with `color-level()` and `$theme-color-interval` was removed in favor of a new color system. All `lighten()` and `darken()` functions in our codebase are replaced by `tint-color()` and `shade-color()`. These functions will mix the color with either white or black instead of changing its lightness by a fixed amount. The `scale-color()` will either tint or shade a color depending on whether its weight parameter is positive or negative. [See #30622](https://github.com/twbs/bootstrap/pull/30622) for more details. - The color system which worked with `color-level()` and `$theme-color-interval` was removed in favor of a new color system. All `lighten()` and `darken()` functions in our codebase are replaced by `tint-color()` and `shade-color()`. These functions will mix the color with either white or black instead of changing its lightness by a fixed amount. The `scale-color()` (changed to `shift-color()` in Beta 1) will either tint or shade a color depending on whether its weight parameter is positive or negative. [See #30622](https://github.com/twbs/bootstrap/pull/30622) for more details.
- Spinners now honor `prefers-reduced-motion: reduce` by slowing down animations. [See #31882](https://github.com/twbs/bootstrap/pull/31882). - Spinners now honor `prefers-reduced-motion: reduce` by slowing down animations. [See #31882](https://github.com/twbs/bootstrap/pull/31882).
### Reboot ### Reboot