fixed sass errors

bemusic · Oct 7, 2021 · ed394d2 · ed394d2
1 parent 5a42a55
commit ed394d2
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 11 deletions.
diff --git a/bemuse/src/app/ui/ModeSelectScene.scss b/bemuse/src/app/ui/ModeSelectScene.scss
@@ -1,3 +1,4 @@
+@use "sass:math";
 @import '~bemuse/ui/common';
 
 .ModeSelectScene {
@@ -51,7 +52,7 @@
     border-radius: 1em;
     background: rgba(#41454b, 0.8);
     width: 22em;
-    height: 22em * 9 / 16;
+    height: math.div(22em * 9, 16);
     box-shadow: 0 2px 8px black;
     rect,
     circle {

diff --git a/bemuse/src/app/ui/MusicListItemChart.scss b/bemuse/src/app/ui/MusicListItemChart.scss
@@ -1,3 +1,4 @@
+@use "sass:math";
 @import '~bemuse/ui/common';
 
 .MusicListItemChart {
@@ -9,7 +10,7 @@
   width: $size;
   height: $size;
   border: 1px solid rgba(#000, 0.3);
-  border-radius: $size / 5;
+  border-radius: math.div($size, 5);
   font-size: 1rem;
   color: rgba(#000, 0.6);
   text-align: center;

diff --git a/bemuse/src/app/ui/OptionsInputKeys.scss b/bemuse/src/app/ui/OptionsInputKeys.scss
@@ -1,3 +1,4 @@
+@use "sass:math";
 @import '~bemuse/ui/common';
 
 .OptionsInputKeys {
@@ -59,30 +60,30 @@
   &[data-arrangement='kb'] {
     width: 420px;
     .OptionsInputKey {
-      width: (100% / 7);
+      width: math.div(100%, 7);
       top: 0%;
       &[data-n='1'] {
-        left: (100% / 7) * 0;
+        left: math.div(100%, 7) * 0;
       }
       &[data-n='2'] {
-        left: (100% / 7) * 1;
+        left: math.div(100%, 7) * 1;
       }
       &[data-n='3'] {
-        left: (100% / 7) * 2;
+        left: math.div(100%, 7) * 2;
       }
       &[data-n='4'] {
-        left: (100% / 7) * 1;
-        width: (100% / 7) * 5;
+        left: math.div(100%, 7) * 1;
+        width: math.div(100%, 7) * 5;
         top: 50%;
       }
       &[data-n='5'] {
-        left: (100% / 7) * 4;
+        left: math.div(100%, 7) * 4;
       }
       &[data-n='6'] {
-        left: (100% / 7) * 5;
+        left: math.div(100%, 7) * 5;
       }
       &[data-n='7'] {
-        left: (100% / 7) * 6;
+        left: math.div(100%, 7) * 6;
       }
     }
   }