Convert stylus to sass

Author: davenquinn

package.json

@@ -8,7 +8,7 @@
   "scripts": {
     "dev": "storybook dev -p 6006 --no-open",
     "build:storybook": "storybook build --debug",
-    "build": "NODE_NO_WARNINGS=1 tsx scripts/publish-helpers/build-all.ts",
+    "build": "NODE_NO_WARNINGS=1 tsx scripts/publish-helpers build",
     "status": "NODE_NO_WARNINGS=1 tsx scripts/publish-helpers status",
     "prepare": "NODE_NO_WARNINGS=1 tsx scripts/publish-helpers prepare",
     "publish": "NODE_NO_WARNINGS=1 tsx scripts/publish-helpers publish",
@@ -44,29 +44,24 @@
     "marked": "^11.0",
     "marked-terminal": "^7.1.0",
     "node-fetch": "^3.2.9",
-    "react": "^19",
-    "react-dom": "^19",
+    "react": "^18||^19",
+    "react-dom": "^18||^19",
     "storybook": "10.1.11",
     "tsx": "^4.19.1",
     "typescript": "^5.8.3",
     "underscore": "^1.12.0",
     "use-async-effect": "^2.2.1",
-    "vite": "^7.2.7"
+    "madge": "^8.0.0",
+    "prettier": "^3.7.4"
   },
   "resolutions": {
-    "@types/react": "18.3.12",
     "react": "^19",
-    "react-dom": "^19",
-    "rollup": "4.44.2"
+    "react-dom": "^19"
   },
   "workspaces": [
     "packages/*",
     "toolchain/*",
     "examples/*"
   ],
-  "packageManager": "[email protected]",
-  "devDependencies": {
-    "madge": "^8.0.0",
-    "prettier": "^3.7.4"
-  }
+  "packageManager": "[email protected]"
 }

packages/map-interface/src/location-details/info-blocks.module.sass

@@ -0,0 +1,35 @@
+.chip
+  padding: 3px 6px
+  margin: 2px 6px 2px 0
+  border-radius: 5px
+  text-align: center
+  &.emphasized
+    font-weight: 600
+
+.age-chip-container
+  font-family: 'Montserrat', sans-serif
+  font-weight: 700
+  display: inline-block
+
+.age-chip
+  display: inline-block
+
+:global(.bp6-dark) .age-chip
+  color: #fff
+
+.age-chip-age
+  font-size: 75%
+
+.age-chip-ma
+  font-size: 70%
+  font-weight: 400
+
+.age-ma
+  font-style: italic
+
+.lith-chip
+  display: inline-block
+  font-size: 12px
+  background-repeat: repeat
+  background-size: cover
+  //background-color: rgba(255,255,255,0.5);

packages/map-interface/src/location-details/info-blocks.module.styl

@@ -1,39 +1,39 @@
 .spacer
-  flex-grow 1
-  pointer-events none
+  flex-grow: 1
+  pointer-events: none
 
 .infodrawer-content
-  margin: 0;
+  margin: 0
 
 .macrostrat-detail
-  display: flex;
-  align-items: center;
-  margin 0.2em 0 0.4em;
+  display: flex
+  align-items: center
+  margin: 0.2em 0 0.4em
 
   .expansion-summary-title
-    margin-right: 0.8em;
+    margin-right: 0.8em
 
     &:after
-      content: ":";
+      content: ":"
 
 .described-age, .macrostrat-detail
-  display: flex;
-  align-items: center;
+  display: flex
+  align-items: center
 
   .expansion-summary-title
-    margin-right: 0.8em;
+    margin-right: 0.8em
 
     &:after
-      content: ":";
+      content: ":"
 
   .description
-    font-style italic
-    font-size 0.7em
+    font-style: italic
+    font-size: 0.7em
     max-width: 100px
     text-align: right
 
   .age-chips
-    flex-grow 1
+    flex-grow: 1
 
 
 // &.loading
@@ -43,22 +43,22 @@
 
 
 .spacer
-  flex-grow 1
-  pointer-events none
+  flex-grow: 1
+  pointer-events: none
 
 .macrostrat-unit
   h3
-    margin: 0.5em 0 0.5em;
-    flex-grow: 1;
+    margin: 0.5em 0 0.5em
+    flex-grow: 1
 
   .description
     margin-right: 1em
 
 .description
-  font-style italic
+  font-style: italic
 
 .age-refinement-plot
-  position relative
+  position: relative
 
   .age-refinement-bar
     border-radius: 3px