diff --git a/frontend/scripts/build-tokens.ts b/frontend/scripts/build-tokens.ts index a36d2792f..d971ded83 100644 --- a/frontend/scripts/build-tokens.ts +++ b/frontend/scripts/build-tokens.ts @@ -3,11 +3,11 @@ * * The TypeScript module is the single source of truth. This script declares * the JS-path → CSS-variable mapping and writes the CSS file. Run it via - * `npm run tokens` (also wired into predev / prebuild). + * `npm run build:tokens` (also wired into predev / prebuild). * * Adding a new token: add it to src/v2/tokens/index.ts, then add a mapping * entry below if the default convention does not produce the desired CSS - * variable name. Re-run `npm run tokens`. + * variable name. Re-run `npm run build:tokens`. */ import { writeFile, readFile } from "node:fs/promises"; import { dirname, resolve } from "node:path"; @@ -27,7 +27,7 @@ import { motion, radius, space, -} from "../src/v2/tokens/index.ts"; +} from "../src/v2/tokens/index.js"; const __dirname = dirname(fileURLToPath(import.meta.url)); const OUTPUT = resolve(__dirname, "../src/v2/styles/tokens.css"); @@ -38,16 +38,6 @@ function camelToKebab(s: string): string { type Entry = [cssName: string, value: string]; -function map>( - obj: T, - toName: (key: keyof T & string) => string, -): Entry[] { - return Object.entries(obj).map(([k, v]) => [ - toName(k as keyof T & string), - v, - ]); -} - const NAME_OVERRIDES = { space: { rowPad: "--r-row-pad" }, layout: { @@ -133,7 +123,7 @@ const HEADER = `/* * RomM v2 Design Tokens — CSS Custom Properties * * GENERATED FILE — do not hand-edit. Source: src/v2/tokens/index.ts - * Regenerate with: npm run tokens + * Regenerate with: npm run build:tokens * * Scoped under .r-v2 so v1 styling is unaffected. Theme palettes live under * .r-v2.r-v2-dark and .r-v2.r-v2-light. The classes are toggled on @@ -165,10 +155,17 @@ const css = [ ), ].join("\n"); -const existing = await readFile(OUTPUT, "utf-8").catch(() => ""); -if (existing === css) { - process.stdout.write("tokens.css up-to-date\n"); -} else { +async function main() { + const existing = await readFile(OUTPUT, "utf-8").catch(() => ""); + if (existing === css) { + process.stdout.write("tokens.css up-to-date\n"); + return; + } await writeFile(OUTPUT, css, "utf-8"); process.stdout.write(`tokens.css regenerated (${css.length} bytes)\n`); } + +main().catch((err) => { + console.error(err); + process.exit(1); +}); diff --git a/frontend/src/v2/composables/useThemeClass/index.ts b/frontend/src/v2/composables/useThemeClass/index.ts deleted file mode 100644 index e32fed8dd..000000000 --- a/frontend/src/v2/composables/useThemeClass/index.ts +++ /dev/null @@ -1,14 +0,0 @@ -// useThemeClass — returns a reactive class string ("r-v2-dark" | "r-v2-light") -// derived from the active Vuetify theme. Layouts attach it to their root -// element so theme-scoped CSS (`:global(.r-v2.r-v2-light) .foo`) flips with -// the theme. -import { computed, type ComputedRef } from "vue"; -import { useTheme } from "vuetify"; -import { V2_THEME_DARK } from "@/v2/theme/vuetify"; - -export function useThemeClass(): ComputedRef<"r-v2-dark" | "r-v2-light"> { - const theme = useTheme(); - return computed(() => - theme.global.name.value === V2_THEME_DARK ? "r-v2-dark" : "r-v2-light", - ); -} diff --git a/frontend/src/v2/layouts/AppLayout.vue b/frontend/src/v2/layouts/AppLayout.vue index 1e46cacbe..e0435f59b 100644 --- a/frontend/src/v2/layouts/AppLayout.vue +++ b/frontend/src/v2/layouts/AppLayout.vue @@ -18,11 +18,8 @@ import { BACKGROUND_ART_KEY } from "@/v2/composables/useBackgroundArt"; import { useGamepad } from "@/v2/composables/useGamepad"; import { useGlobalHotkeys } from "@/v2/composables/useGlobalHotkeys"; import { useInputModality } from "@/v2/composables/useInputModality"; -import { useThemeClass } from "@/v2/composables/useThemeClass"; import { installBackMorph } from "@/v2/composables/useViewTransition"; -const themeClass = useThemeClass(); - // Shared reactive background art — views paint covers via the injected setter. const layerA = ref(null); const layerB = ref(null); @@ -64,7 +61,7 @@ onBeforeUnmount(() => {