Clean up some style properties in react elements

src/music/features/visualizer/Visualizer.tsx

@@ -127,17 +127,8 @@ function Visualizer() {
                 ref={visualizer}
                 className="is-flex-grow-1 is-clipped is-relative"
             >
-                <canvas
-                    style={{
-                        display: "block",
-                        position: "absolute",
-                        boxSizing: "border-box",
-                    }}
-                ></canvas>
-                <span
-                    className="is-bottom-left"
-                    style={{ display: "relative" }}
-                ></span>
+                <canvas className="is-block is-absolute is-border-box"></canvas>
+                <span className="is-bottom-left"></span>
             </div>
         );
     } else {

src/music/music.scss

@@ -3,8 +3,12 @@ $fa-font-path: "npm:@fortawesome/fontawesome-free/webfonts";
 @import "~/node_modules/@fortawesome/fontawesome-free/scss/fontawesome";
 @import "~/node_modules/@fortawesome/fontawesome-free/scss/solid";
 
-.is-relative {
-  position: relative !important;
+.is-border-box {
+  box-sizing: border-box !important;
+}
+
+.is-absolute {
+  position: absolute !important;
 }
 
 .is-bottom-left {