other

src/mixins/theme.ts

@@ -4,16 +4,13 @@ import { useSystemInfoStore } from '@/stores/modules/system';
 export const themeMixin = {
   computed: {
     __themeModel() {
-      const themeStore = storeToRefs(useSystemInfoStore());
-      return themeStore.getThemeModel.value;
+      return useSystemInfoStore().getThemeModel;
     },
     __themeKey() {
-      const themeStore = storeToRefs(useSystemInfoStore());
-      return themeStore.getThemeKey.value;
+      return useSystemInfoStore().getThemeKey;
     },
     __theme() {
-      const themeStore = storeToRefs(useSystemInfoStore());
-      const theme = themeStore.getTheme.value;
+      const theme = useSystemInfoStore().getTheme;
       return Object.keys(theme)
         .map(key => `${key}:${theme[key]};`)
         .join('');

src/pages/colorCard/Scheme.vue

@@ -9,7 +9,7 @@
 
   ## Last Modified: 2024-09-05 10:45:49
 
-  Modified By: kurosago
+  Modified By: KuroSago
 
   ## Copyright (c) 2024 self.
 
@@ -34,7 +34,7 @@ defineComponent({
       v-for="(v, k) in props.scheme"
       :key="k" class="flex flex-col items-center justify-center "
     >
-      <span class="text-ellipsis w-full overflow-hidden">{{ k }}</span>
+      <span class="text-ellipsis w-full overflow-hidden text-onBackground">{{ k }}</span>
       <div
         class="flex-1 w-full flex items-center justify-center transition-background-color duration-300"
         :style="{

src/pages/colorCard/index.vue

@@ -88,11 +88,11 @@ const themeModelList: {
     <ColorPalette :palette="themeColor.palette" />
 
     <!-- lightScheme -->
-    <span>lightScheme</span>
+    <span class="text-onBackground">lightScheme</span>
     <Scheme :scheme="themeColor.lightScheme" />
 
     <!-- darkScheme -->
-    <span>darkScheme</span>
+    <span class="text-onBackground">darkScheme</span>
     <Scheme :scheme="themeColor.darkScheme" />
   </view>
 </template>