refactor: replace theme-light with light-theme

color/_var.scss

@@ -1,6 +1,6 @@
 /** Don't edit this file directly. It is generated by `material3-style color`. */
 
-@mixin theme-light {
+@mixin light-theme {
   --md-sys-color-primary: #6f43c0;
   --md-sys-color-on-primary: #ffffff;
   --md-sys-color-primary-container: #ebddff;
@@ -61,7 +61,7 @@
   --m3-color-inverse-primary: var(--md-sys-color-inverse-primary);
 }
 
-@mixin theme-dark {
+@mixin dark-theme {
   --md-sys-color-primary: #d3bbff;
   --md-sys-color-on-primary: #3f008d;
   --md-sys-color-primary-container: #5727a6;

color/style/dark-theme.scss

@@ -0,0 +1,5 @@
+@use '../var';
+
+:root {
+  @include var.dark-theme();
+}

color/style/light-theme.scss

@@ -0,0 +1,5 @@
+@use '../var';
+
+:root {
+  @include var.light-theme();
+}

example/color-demo/theme.scss

@@ -1,11 +1,11 @@
 @use './node_modules/material3-style/color/var';
 
 :root {
-  @include var.theme-light();
+  @include var.light-theme();
 }
 
 .dark:root {
-  @include var.theme-dark();
+  @include var.dark-theme();
 }
 
 body {

src/colorGen.ts

@@ -1,5 +1,6 @@
 import path from 'node:path'
 import fs from 'node:fs/promises'
+import { existsSync } from 'node:fs'
 import { fileURLToPath } from 'node:url'
 import type { Scheme } from '@material/material-color-utilities'
 import { argbFromHex, hexFromArgb, themeFromSourceColor } from '@material/material-color-utilities'
@@ -25,18 +26,21 @@ export async function generateTheme(input: string = '#673ab7', customColors?: st
   const targetFile = path.resolve(__dirname, '../color/_var.scss')
   const content = `/** Don't edit this file directly. It is generated by \`material3-style color\`. */
 
-@mixin theme-light {
+@mixin light-theme {
   ${lightVars}
 }
 
-@mixin theme-dark {
+@mixin dark-theme {
   ${darkVars}
 }
   `
   await fs.writeFile(targetFile, content, 'utf-8')
 
-  const cssLightFile = path.resolve(__dirname, '../color/css/theme-light.css')
-  const cssDarkFile = path.resolve(__dirname, '../color/css/theme-dark.css')
+  const cssLightFile = path.resolve(__dirname, '../color/css/light-theme.css')
+  const cssDarkFile = path.resolve(__dirname, '../color/css/dark-theme.css')
+  const cssDir = path.dirname(cssLightFile)
+  if (existsSync(cssDir))
+    await fs.mkdir(cssDir, { recursive: true })
   await Promise.all([
     fs.writeFile(cssLightFile, `:root {${lightVars.replaceAll(/[ \n]/g, '')}}`, 'utf-8'),
     fs.writeFile(cssDarkFile, `:root {${lightVars.replaceAll(/[ \n]/g, '')}}`, 'utf-8'),