99// Configuration
1010
1111// Base font size
12+ @use " sass:math" ;
13+
1214$rfs-base-font-size : 1.25rem !default ;
1315$rfs-font-size-unit : rem !default ;
1416
@@ -43,21 +45,21 @@ $rfs-base-font-size-unit: unit($rfs-base-font-size);
4345
4446// Remove px-unit from $rfs-base-font-size for calculations
4547@if $rfs-base-font-size-unit == " px" {
46- $rfs-base-font-size : $rfs-base-font-size / ( $rfs-base-font-size * 0 + 1 );
48+ $rfs-base-font-size : math . div ( $rfs-base-font-size , $rfs-base-font-size * 0 + 1 );
4749}
4850@else if $rfs-base-font-size-unit == " rem" {
49- $rfs-base-font-size : $rfs-base-font-size / ( $rfs-base-font-size * 0 + 1 / $rfs-rem-value );
51+ $rfs-base-font-size : math . div ( $rfs-base-font-size , $rfs-base-font-size * 0 + math . div ( 1 , $rfs-rem-value ) );
5052}
5153
5254// Cache $rfs-breakpoint unit to prevent multiple calls
5355$rfs-breakpoint-unit-cache : unit ($rfs-breakpoint );
5456
5557// Remove unit from $rfs-breakpoint for calculations
5658@if $rfs-breakpoint-unit-cache == " px" {
57- $rfs-breakpoint : $rfs-breakpoint / ( $rfs-breakpoint * 0 + 1 );
59+ $rfs-breakpoint : math . div ( $rfs-breakpoint , $rfs-breakpoint * 0 + 1 );
5860}
5961@else if $rfs-breakpoint-unit-cache == " rem" or $rfs-breakpoint-unit-cache == " em" {
60- $rfs-breakpoint : $rfs-breakpoint / ( $rfs-breakpoint * 0 + 1 / $rfs-rem-value );
62+ $rfs-breakpoint : math . div ( $rfs-breakpoint , $rfs-breakpoint * 0 + math . div ( 1 , $rfs-rem-value ) );
6163}
6264
6365// Responsive font-size mixin
@@ -79,15 +81,15 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
7981
8082 // Remove px-unit from $fs for calculations
8183 @if $fs-unit == " px" {
82- $fs : $fs / ( $fs * 0 + 1 );
84+ $fs : math . div ( $fs , $fs * 0 + 1 );
8385 }
8486 @else if $fs-unit == " rem" {
85- $fs : $fs / ( $fs * 0 + 1 / $rfs-rem-value );
87+ $fs : math . div ( $fs , $fs * 0 + math . div ( 1 , $rfs-rem-value ) );
8688 }
8789
8890 // Set default font-size
8991 @if $rfs-font-size-unit == rem {
90- $rfs-static : #{$fs / $rfs-rem-value } rem#{$rfs-suffix } ;
92+ $rfs-static : #{math . div ( $fs , $rfs-rem-value ) } rem#{$rfs-suffix } ;
9193 }
9294 @else if $rfs-font-size-unit == px {
9395 $rfs-static : #{$fs } px#{$rfs-suffix } ;
@@ -103,20 +105,20 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
103105 $variable-unit : null;
104106
105107 // Calculate minimum font-size for given font-size
106- $fs-min : $rfs-base-font-size + ($fs - $rfs-base-font-size ) / $rfs-factor ;
108+ $fs-min : $rfs-base-font-size + math . div ($fs - $rfs-base-font-size , $rfs-factor ) ;
107109
108110 // Calculate difference between given font-size and minimum font-size for given font-size
109111 $fs-diff : $fs - $fs-min ;
110112
111113 // Base font-size formatting
112114 // No need to check if the unit is valid, because we did that before
113- $min-width : if ($rfs-font-size-unit == rem , #{$fs-min / $rfs-rem-value } rem , #{$fs-min } px );
115+ $min-width : if ($rfs-font-size-unit == rem , #{math . div ( $fs-min , $rfs-rem-value ) } rem , #{$fs-min } px );
114116
115117 // If two-dimensional, use smallest of screen width and height
116118 $variable-unit : if ($rfs-two-dimensional , vmin , vw );
117119
118120 // Calculate the variable width between 0 and $rfs-breakpoint
119- $variable-width : #{$fs-diff * 100 / $rfs-breakpoint }#{$variable-unit } ;
121+ $variable-width : #{math . div ( $fs-diff * 100 , $rfs-breakpoint ) }#{$variable-unit } ;
120122
121123 // Set the calculated font-size.
122124 $rfs-fluid : calc (#{$min-width } + #{$variable-width } ) #{$rfs-suffix } ;
@@ -132,7 +134,7 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
132134
133135 // RFS breakpoint formatting
134136 @if $rfs-breakpoint-unit == em or $rfs-breakpoint-unit == rem {
135- $mq-value : #{$rfs-breakpoint / $rfs-rem-value }#{$rfs-breakpoint-unit } ;
137+ $mq-value : #{math . div ( $rfs-breakpoint , $rfs-rem-value ) }#{$rfs-breakpoint-unit } ;
136138 }
137139 @else if $rfs-breakpoint-unit == px {
138140 $mq-value : #{$rfs-breakpoint } px;
0 commit comments