This commit is contained in:
KuroSago 2024-09-20 10:27:58 +08:00
parent 82705051eb
commit 3c877bcec6
3 changed files with 7 additions and 10 deletions

View File

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

View File

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

View File

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