Add scss formatter

.dprint.json

@@ -14,7 +14,7 @@
         "semi": true,
         "htmlWhitespaceSensitivity": "ignore"
     },
-    "includes": ["**/*.{ts,tsx,js,jsx,cjs,mjs,json,md,toml,svelte}"],
+    "includes": ["**/*.{ts,tsx,js,jsx,cjs,mjs,json,md,toml,svelte,scss}"],
     "excludes": [
         ".vscode",
         "**/node_modules",
@@ -34,6 +34,7 @@
         "https://plugins.dprint.dev/json-0.17.4.wasm",
         "https://plugins.dprint.dev/markdown-0.15.3.wasm",
         "https://plugins.dprint.dev/toml-0.5.4.wasm",
-        "https://plugins.dprint.dev/prettier-0.26.1.json@fdbe31f6aecd24f9d6b924214710a6766050d03146163b4e241e6056b2462f2e"
+        "https://plugins.dprint.dev/prettier-0.26.1.json@fdbe31f6aecd24f9d6b924214710a6766050d03146163b4e241e6056b2462f2e",
+        "https://plugins.dprint.dev/disrupted/css-0.2.2.wasm"
     ]
 }

build/configure/src/web.rs

@@ -458,7 +458,10 @@ fn build_and_check_reviewer(build: &mut Build) -> Result<()> {
 }
 
 fn check_web(build: &mut Build) -> Result<()> {
-    let dprint_files = inputs![glob!["**/*.{ts,mjs,js,md,json,toml,svelte}", "target/**"]];
+    let dprint_files = inputs![glob![
+        "**/*.{ts,mjs,js,md,json,toml,svelte,scss}",
+        "target/**"
+    ]];
     build.add_action(
         "check:format:dprint",
         DPrint {

sass/_vars.scss

@@ -63,9 +63,9 @@ $vars: (
                 "Default background blur value",
                 (
                     default: 20px,
-                )
-            )
-        )
+                ),
+            ),
+        ),
     ),
     colors: (
         fg: (

sass/base.scss

@@ -54,9 +54,10 @@ body {
     }
 }
 
-button:not(.btn,.btn-close) {
+button:not(.btn, .btn-close) {
     /* override transition for instant hover response */
-    transition: color var(--transition) ease-in-out, box-shadow var(--transition) ease-in-out !important;
+    transition: color var(--transition) ease-in-out,
+        box-shadow var(--transition) ease-in-out !important;
     border-radius: prop(border-radius);
     @include button.base;
 }

sass/breakpoints.scss

@@ -83,4 +83,4 @@ $breakpoints: (
             }
         }
     }
-} ;
+}

ts/congrats/congrats-base.scss

@@ -6,4 +6,4 @@
 body {
     margin-left: 0.5em;
     margin-right: 0.5em;
-}
+}

ts/deck-options/deck-options-base.scss

@@ -24,4 +24,6 @@ input {
 }
 
 // Setting 100% height causes the sticky element to hide as you scroll down on Safari.
-html { height: initial; }
+html {
+    height: initial;
+}

ts/graphs/graphs-base.scss

@@ -5,4 +5,6 @@ button {
     margin-bottom: 5px;
 }
 
-html { height: initial; }
+html {
+    height: initial;
+}

ts/image-occlusion/image-occlusion-base.scss

@@ -19,7 +19,9 @@ html {
 }
 
 /** consistent font size **/
-:root { --font-size: 16px; }
-body { 
+:root {
+    --font-size: 16px;
+}
+body {
     font-size: 16px;
 }

ts/image-occlusion/review.scss

@@ -25,4 +25,4 @@
     left: 0;
     width: 100%;
     height: 100%;
-}
+}

ts/import-csv/import-csv-base.scss

@@ -20,4 +20,6 @@ body {
     padding: 0 1em 1em 1em;
 }
 
-html { height: initial; }
+html {
+    height: initial;
+}