feat(theme): 主题颜色匹配方法调整

theme-terminal/src/alpine/themeMode.ts

@@ -12,7 +12,7 @@ export const themeMode =  ():ThemeModeState => ({
 
     if (!storedTheme) return;
 
-    document.documentElement.setAttribute("data-mode", storedTheme);
+    document.documentElement.setAttribute("data-color-scheme", storedTheme);
     
     this.storedTheme = storedTheme;
   },
@@ -20,7 +20,7 @@ export const themeMode =  ():ThemeModeState => ({
   handleToggleThemeMode() {
     const targetTheme = this.storedTheme === "dark" ? "light" : "dark";
 
-    document.documentElement.setAttribute("data-mode", targetTheme);
+    document.documentElement.setAttribute("data-color-scheme", targetTheme);
     
     this.storedTheme = targetTheme;
 

theme-terminal/src/styles/theme.scss

@@ -1,4 +1,4 @@
-html[data-mode='light'] {
+html[data-color-scheme='light'] {
     --black: #3e3e3e;
     --red: #970b16;
     --green: #07962a;
@@ -21,7 +21,7 @@ html[data-mode='light'] {
     --selectionBackground: #a9c1e2;
 }
 
-html[data-mode='dark'] {
+html[data-color-scheme='dark'] {
     --black: #000000;
     --red: #f78166;
     --green: #56d364;
@@ -44,7 +44,7 @@ html[data-mode='dark'] {
     --selectionBackground: #3b5070;
 }
 
-[data-mode='light'] .d-block-light,
+[data-color-scheme='light'] .d-block-light,
-[data-mode='dark'] .d-block-dark {
+[data-color-scheme='dark'] .d-block-dark {
     display: block !important;
 }

theme-terminal/tailwind.config.js

@@ -14,7 +14,7 @@ module.exports = {
       },
     })),
   ],
-  darkMode: ['class', '[data-mode="dark"]'],
+  darkMode: ['class', '[data-color-scheme="dark"]'],
   safelist: [
     "prose-sm",
     "prose-base",

theme-terminal/theme.yaml

@@ -13,5 +13,5 @@ spec:
   repo: https://git.dev.cm/theme-terminal
   settingName: "theme-terminal-setting"
   configMapName: "theme-terminal-configMap"
-  version: 1.1.6
+  version: 1.1.7
   require: ">=2.20.0"