feat: 支持Dark Mode

This commit is contained in:
shaw
2025-08-22 22:09:38 +08:00
parent 8328b6ddac
commit d2f0ac37a9
37 changed files with 3226 additions and 1155 deletions

View File

@@ -2,7 +2,7 @@
<div class="flex items-center gap-4">
<!-- Logo区域 -->
<div
class="flex h-12 w-12 flex-shrink-0 items-center justify-center overflow-hidden rounded-xl border border-gray-300/30 bg-gradient-to-br from-blue-500/20 to-purple-500/20 backdrop-blur-sm"
class="flex h-12 w-12 flex-shrink-0 items-center justify-center overflow-hidden rounded-xl border border-gray-300/30 bg-gradient-to-br from-blue-500/20 to-purple-500/20 backdrop-blur-sm dark:border-gray-600/30 dark:from-blue-600/20 dark:to-purple-600/20"
>
<template v-if="!loading">
<img
@@ -12,9 +12,9 @@
:src="logoSrc"
@error="handleLogoError"
/>
<i v-else class="fas fa-cloud text-xl text-gray-700" />
<i v-else class="fas fa-cloud text-xl text-gray-700 dark:text-gray-300" />
</template>
<div v-else class="h-8 w-8 animate-pulse rounded bg-gray-300/50" />
<div v-else class="h-8 w-8 animate-pulse rounded bg-gray-300/50 dark:bg-gray-600/50" />
</div>
<!-- 标题区域 -->
@@ -25,11 +25,14 @@
{{ title }}
</h1>
</template>
<div v-else-if="loading" class="h-8 w-64 animate-pulse rounded bg-gray-300/50" />
<div
v-else-if="loading"
class="h-8 w-64 animate-pulse rounded bg-gray-300/50 dark:bg-gray-600/50"
/>
<!-- 插槽用于版本信息等额外内容 -->
<slot name="after-title" />
</div>
<p v-if="subtitle" class="mt-0.5 text-sm leading-tight text-gray-600">
<p v-if="subtitle" class="mt-0.5 text-sm leading-tight text-gray-600 dark:text-gray-400">
{{ subtitle }}
</p>
</div>