Convert styles to use var(--color) correctly

FyreByrd · FyreByrd · commit 9593a64a42e0 · 2026-05-11T11:30:42.000-05:00
diff --git a/convert/convertStyles.ts b/convert/convertStyles.ts
@@ -101,6 +101,11 @@ export function convertStyles(dataDir: string, configData: ConfigTaskOutput, ver
                         }
                         line = line.replace('/fonts', joinUrlPath('$assets', finalPath));
                     }
+                    // fix CSS color var usage that doesn't use `var(--var)` syntax
+                    const colorMatch = line.match(/color: ((?!var\(--).*Color)/i);
+                    if (colorMatch) {
+                        line = line.replace(colorMatch[1], `var(--${colorMatch[1]})`);
+                    }
                     return line;
                 })
                 .join(eol);

Original file line number	Diff line number	Diff line change
`@@ -101,6 +101,11 @@ export function convertStyles(dataDir: string, configData: ConfigTaskOutput, ver`
`101`	`101`	`}`
`102`	`102`	`line = line.replace('/fonts', joinUrlPath('$assets', finalPath));`
`103`	`103`	`}`
	`104`	+ // fix CSS color var usage that doesn't use `var(--var)` syntax
	`105`	`+ const colorMatch = line.match(/color: ((?!var\(--).*Color)/i);`
	`106`	`+ if (colorMatch) {`
	`107`	+ line = line.replace(colorMatch[1], `var(--${colorMatch[1]})`);
	`108`	`+ }`
`104`	`109`	`return line;`
`105`	`110`	`})`
`106`	`111`	`.join(eol);`