fixes vuetifyjs#13694

RubenNL · May 24, 2021 · 93bd020 · 93bd020
1 parent dcbac86
commit 93bd020
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 7 deletions.
diff --git a/packages/vuetify/src/components/VColorPicker/_variables.scss b/packages/vuetify/src/components/VColorPicker/_variables.scss
@@ -1,3 +1,5 @@
+@use "sass:math";
+
 @import '../../styles/styles.sass';
 
 $color-picker-border-radius: $border-radius-root !default;
@@ -18,7 +20,7 @@ $color-picker-input-font-size: 0.75rem !default;
 $color-picker-input-margin: 8px !default;
 $color-picker-input-margin-bottom: 8px !default;
 $color-picker-slider-height: 10px !default;
-$color-picker-slider-border-radius: $color-picker-slider-height / 2 !default;
+$color-picker-slider-border-radius: math.div($color-picker-slider-height, 2) !default;
 $color-picker-preview-dot-size: 30px !default;
 $color-picker-preview-dot-margin: 24px !default;
 $color-picker-hue-margin-bottom: 24px !default;
diff --git a/packages/vuetify/src/styles/settings/_variables.scss b/packages/vuetify/src/styles/settings/_variables.scss
@@ -1,3 +1,5 @@
+@use "sass:math";
+
 @import '../tools/_functions.sass';
 
 $color-pack: true !default;
@@ -11,7 +13,7 @@ $rounded: () !default;
 $rounded: map-deep-merge(
   (
     0: 0,
-    'sm': $border-radius-root / 2,
+    'sm': math.div($border-radius-root, 2),
     null: $border-radius-root,
     'lg': $border-radius-root * 2,
     'xl': $border-radius-root * 6,
@@ -53,15 +55,15 @@ $grid-gutter: $spacer * 6 !default;
 $form-grid-gutter: $spacer * 2 !default;
 $grid-columns: 12 !default;
 
-$container-padding-x: $grid-gutter / 2 !default;
+$container-padding-x: math.div($grid-gutter, 2) !default;
 
 $grid-gutters: () !default;
 $grid-gutters: map-deep-merge(
   (
-    'xs': $grid-gutter / 12,
-    'sm': $grid-gutter / 6,
-    'md': $grid-gutter / 3,
-    'lg': $grid-gutter * 2/3,
+    'xs': math.div($grid-gutter, 12),
+    'sm': math.div($grid-gutter, 6),
+    'md': math.div($grid-gutter, 3),
+    'lg': math.div($grid-gutter * 2, 3),
     'xl': $grid-gutter
   ),
   $grid-gutters