Updated divisions to math.div (#7549)

* Updated divisions to math.div on Reversi (game.board.vue)

* Update src/client/pages/reversi/game.board.vue

Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>

* Oops. Forgot to put it all through parenthesis

* Imported sass:math

* Fixes on drive.vue

* Forgot the stupid comma

Co-authored-by: syuilo <Syuilotan@yahoo.co.jp>

src/client/pages/reversi/game.board.vue

@@ -350,6 +350,9 @@ export default defineComponent({
 </script>
 
 <style lang="scss" scoped>
+
+@use "sass:math";
+
 .xqnhankfuuilcwvhgsopeqncafzsquya {
 	text-align: center;
 
@@ -388,11 +391,11 @@ export default defineComponent({
 				font-size: 0.8em;
 
 				&:first-child {
-					margin-left: -($gap / 2);
+					margin-left: -(math.div($gap, 2));
 				}
 
 				&:last-child {
-					margin-right: -($gap / 2);
+					margin-right: -(math.div($gap, 2));
 				}
 			}
 		}
@@ -413,11 +416,11 @@ export default defineComponent({
 					font-size: 12px;
 
 					&:first-child {
-						margin-top: -($gap / 2);
+						margin-top: -(math.div($gap, 2));
 					}
 
 					&:last-child {
-						margin-bottom: -($gap / 2);
+						margin-bottom: -(math.div($gap, 2));
 					}
 				}
 			}

src/client/pages/settings/drive.vue

@@ -220,6 +220,9 @@ export default defineComponent({
 </script>
 
 <style lang="scss" scoped>
+
+@use "sass:math";
+
 .uawsfosz {
 	> div {
 		padding: 24px;
@@ -227,12 +230,12 @@ export default defineComponent({
 		> .meter {
 			$size: 12px;
 			background: rgba(0, 0, 0, 0.1);
-			border-radius: ($size / 2);
+			border-radius: math.div($size, 2);
 			overflow: hidden;
 
 			> div {
 				height: $size;
-				border-radius: ($size / 2);
+				border-radius: math.div($size, 2);
 			}
 		}
 	}