diff --git a/core/bourbon/library/_modular-scale.scss b/core/bourbon/library/_modular-scale.scss index 81f2ab9a0..311ffde8e 100644 --- a/core/bourbon/library/_modular-scale.scss +++ b/core/bourbon/library/_modular-scale.scss @@ -67,6 +67,8 @@ /// /// @require {function} _fetch-bourbon-setting +@use "sass:math"; + @function modular-scale( $increment, $value: _fetch-bourbon-setting("modular-scale-base"), @@ -78,7 +80,7 @@ // scale $v2 to just above $v1 @while $v2 > $v1 { - $v2: ($v2 / $ratio); // will be off-by-1 + $v2: math.div($v2, $ratio); // will be off-by-1 } @while $v2 < $v1 { $v2: ($v2 * $ratio); // will fix off-by-1 @@ -102,15 +104,15 @@ @if $increment < 0 { // adjust $v2 to just below $v1 @if $double-stranded { - $v2: ($v2 / $ratio); + $v2: math.div($v2, $ratio); } @for $i from $increment through -1 { - @if $double-stranded and ($v1 / $ratio) < $v2 { + @if $double-stranded and math.div($v1, $ratio) < $v2 { $value: $v2; - $v2: ($v2 / $ratio); + $v2: math.div($v2, $ratio); } @else { - $v1: ($v1 / $ratio); + $v1: math.div($v1, $ratio); $value: $v1; } } diff --git a/core/bourbon/library/_strip-unit.scss b/core/bourbon/library/_strip-unit.scss index f4f660a35..b0e260d0d 100644 --- a/core/bourbon/library/_strip-unit.scss +++ b/core/bourbon/library/_strip-unit.scss @@ -12,6 +12,8 @@ /// // Output /// $dimension: 10; +@use "sass:math"; + @function strip-unit($value) { - @return ($value / ($value * 0 + 1)); + @return math.div($value, $value * 0 + 1); } diff --git a/core/bourbon/library/_triangle.scss b/core/bourbon/library/_triangle.scss index 6ed32a1c3..90e0bb8f0 100644 --- a/core/bourbon/library/_triangle.scss +++ b/core/bourbon/library/_triangle.scss @@ -55,25 +55,25 @@ @if $direction == "up" { border-color: transparent transparent $color; - border-width: 0 ($width / 2) $height; + border-width: 0 ($width * 0.5) $height; } @else if $direction == "up-right" { border-color: transparent $color transparent transparent; border-width: 0 $width $width 0; } @else if $direction == "right" { border-color: transparent transparent transparent $color; - border-width: ($height / 2) 0 ($height / 2) $width; + border-width: ($height * 0.5) 0 ($height * 0.5) $width; } @else if $direction == "down-right" { border-color: transparent transparent $color; border-width: 0 0 $width $width; } @else if $direction == "down" { border-color: $color transparent transparent; - border-width: $height ($width / 2) 0; + border-width: $height ($width * 0.5) 0; } @else if $direction == "down-left" { border-color: transparent transparent transparent $color; border-width: $width 0 0 $width; } @else if $direction == "left" { border-color: transparent $color transparent transparent; - border-width: ($height / 2) $width ($height / 2) 0; + border-width: ($height * 0.5) $width ($height * 0.5) 0; } @else if $direction == "up-left" { border-color: $color transparent transparent; border-width: $width $width 0 0; diff --git a/core/bourbon/utilities/_contrast-ratio.scss b/core/bourbon/utilities/_contrast-ratio.scss index 1ba65ce15..55d38d587 100644 --- a/core/bourbon/utilities/_contrast-ratio.scss +++ b/core/bourbon/utilities/_contrast-ratio.scss @@ -19,13 +19,15 @@ /// /// @access private +@use "sass:math"; + @function _contrast-ratio($color-1, $color-2) { $-local-lightness-1: _lightness($color-1) + 0.05; $-local-lightness-2: _lightness($color-2) + 0.05; @if $-local-lightness-1 > $-local-lightness-2 { - @return $-local-lightness-1 / $-local-lightness-2; + @return math.div($-local-lightness-1, $-local-lightness-2); } @else { - @return $-local-lightness-2 / $-local-lightness-1; + @return math.div($-local-lightness-2, $-local-lightness-1); } } diff --git a/core/bourbon/utilities/_gamma.scss b/core/bourbon/utilities/_gamma.scss index 3e5145b12..ea570b0b3 100644 --- a/core/bourbon/utilities/_gamma.scss +++ b/core/bourbon/utilities/_gamma.scss @@ -10,11 +10,13 @@ /// /// @access private +@use "sass:math"; + @function _gamma($channel) { @if $channel < 0.03928 { - @return $channel / 12.92; + @return math.div($channel, 12.92); } @else { - $c: ($channel + 0.055) / 1.055; + $c: math.div($channel + 0.055, 1.055); @if function-exists("pow") { @return pow($c, 2.4); } @else { diff --git a/core/bourbon/utilities/_lightness.scss b/core/bourbon/utilities/_lightness.scss index a2929044b..998a29c31 100644 --- a/core/bourbon/utilities/_lightness.scss +++ b/core/bourbon/utilities/_lightness.scss @@ -11,14 +11,16 @@ /// /// @access private +@use "sass:math"; + @function _lightness($hex-color) { $-local-red-raw: red(rgba($hex-color, 1)); $-local-green-raw: green(rgba($hex-color, 1)); $-local-blue-raw: blue(rgba($hex-color, 1)); - $-local-red: _gamma($-local-red-raw / 255); - $-local-green: _gamma($-local-green-raw / 255); - $-local-blue: _gamma($-local-blue-raw / 255); + $-local-red: _gamma(math.div($-local-red-raw, 255)); + $-local-green: _gamma(math.div($-local-green-raw, 255)); + $-local-blue: _gamma(math.div($-local-blue-raw, 255)); @return $-local-red * 0.2126 + $-local-green * 0.7152 + $-local-blue * 0.0722; }