feat: add dark/light theme

This commit is contained in:
engigu
2025-09-30 22:24:29 +08:00
parent f3f378115d
commit 415bed6093
11 changed files with 175 additions and 56 deletions
@@ -44,10 +44,10 @@ export default {
:key="item.id"
@click="$emit('update:activeTab', item.id)"
:class="[
'w-full flex items-center px-4 py-3 text-left text-sm font-medium transition-colors',
'w-full flex items-center px-4 py-3 text-left text-sm font-medium transition-colors rounded-md',
activeTab === item.id
? 'bg-blue-50 text-blue-700 border-r-2 border-blue-700'
: 'text-gray-600 hover:bg-gray-50 hover:text-gray-900'
? 'bg-accent text-accent-foreground border-r-2 border-primary dark:bg-accent/40'
: 'text-muted-foreground hover:bg-muted hover:text-foreground dark:hover:bg-white/5'
]"
>
<component :is="item.icon" class="mr-3 w-5 h-5" />
@@ -111,9 +111,9 @@ export default {
<label class="text-sm font-medium text-gray-700">站点图标(只支持svg文本)</label>
<Input v-model="state.logo" placeholder="请输入自定义的网站logosvg文本)" />
<!-- SVG预览 -->
<div v-if="state.logo" class="mt-2 p-3 border border-gray-200 rounded-md bg-gray-50">
<div class="text-xs text-gray-500 mb-2">预览效果</div>
<div class="flex items-center justify-center w-16 h-16 bg-white border border-gray-300 rounded"
<div v-if="state.logo" class="mt-2 p-3 border border-border rounded-md bg-card">
<div class="text-xs text-muted-foreground mb-2">预览效果</div>
<div class="flex items-center justify-center w-16 h-16 bg-white dark:bg-white border border-border rounded"
v-html="state.logo"></div>
</div>
</div>