Skip to content

Commit 13d6f3c

Browse files
KazariEXKazariEX
committed
refactor(ui): remove theme selector
1 parent 58dd271 commit 13d6f3c

File tree

7 files changed

+32
-111
lines changed

7 files changed

+32
-111
lines changed

‎ui/src/App.vue‎

Lines changed: 8 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import { useI18n } from 'vue-i18n'
77
import { useRouter } from 'vue-router'
88
import AppSidebar from '@/components/AppSidebar.vue'
99
import LoginForm from '@/components/LoginForm.vue'
10-
import ThemeToggle from '@/components/ThemeToggle.vue'
1110
import { SidebarInset, SidebarProvider, SidebarTrigger } from '@/components/ui/sidebar'
1211
import { Toaster } from '@/components/ui/sonner'
1312
import { useThemeStore } from '@/stores/theme'
@@ -85,19 +84,16 @@ onUIOpened()
8584
<AppSidebar />
8685
<SidebarInset>
8786
<div class="md:hidden bg-background border-b border-border sticky top-0 z-50">
88-
<div class="flex items-center justify-between h-14 px-4">
89-
<div class="flex items-center gap-3">
90-
<SidebarTrigger class="h-8 w-8" />
91-
<div class="flex items-center gap-2">
92-
<div class="rounded-lg bg-primary p-1.5 text-primary-foreground">
93-
<Zap class="h-3 w-3" />
94-
</div>
95-
<h1 class="text-base font-semibold">
96-
{{ t('appName') }}
97-
</h1>
87+
<div class="flex items-center gap-3 h-14 px-4">
88+
<SidebarTrigger class="h-8 w-8" />
89+
<div class="flex items-center gap-2">
90+
<div class="rounded-lg bg-primary p-1.5 text-primary-foreground">
91+
<Zap class="h-3 w-3" />
9892
</div>
93+
<h1 class="text-base font-semibold">
94+
{{ t('appName') }}
95+
</h1>
9996
</div>
100-
<ThemeToggle />
10197
</div>
10298
</div>
10399
<RouterView />

‎ui/src/components/AppSidebar.vue‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
import { BarChart3, Brain, Grid3X3, InfoIcon, Settings } from 'lucide-vue-next'
33
import { useI18n } from 'vue-i18n'
44
import ServiceStatus from '@/components/ServiceStatus.vue'
5-
import ThemeToggle from '@/components/ThemeToggle.vue'
65
import {
76
Sidebar,
87
SidebarContent,
@@ -101,11 +100,7 @@ const { t } = useI18n()
101100

102101
<SidebarFooter>
103102
<div class="px-2">
104-
<ServiceStatus variant="full">
105-
<template #actions>
106-
<ThemeToggle />
107-
</template>
108-
</ServiceStatus>
103+
<ServiceStatus variant="full" />
109104
</div>
110105
</SidebarFooter>
111106
</Sidebar>

‎ui/src/components/LoginForm.vue‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import { useI18n } from 'vue-i18n'
44
import LanguageSelector from '@/components/LanguageSelector.vue'
55
import ServiceStatus from '@/components/ServiceStatus.vue'
66
import StartServiceButton from '@/components/StartServiceButton.vue'
7-
import ThemeToggle from '@/components/ThemeToggle.vue'
87
import { Button } from '@/components/ui/button'
98
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
109
import { Input } from '@/components/ui/input'
@@ -159,9 +158,8 @@ async function handleSubmit() {
159158
</CardContent>
160159
</Card>
161160

162-
<div class="flex gap-2 fixed right-4 bottom-4">
161+
<div class="fixed right-4 bottom-4">
163162
<LanguageSelector compact />
164-
<ThemeToggle />
165163
</div>
166164
</div>
167165
</template>

‎ui/src/components/ServiceStatus.vue‎

Lines changed: 16 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -40,25 +40,22 @@ const serviceStore = useServiceStore()
4040
</div>
4141
</div>
4242

43-
<div class="flex items-center justify-between">
44-
<HoverCard :open-delay="400">
45-
<HoverCardTrigger>
46-
<div class="h-8 flex items-center gap-1 text-xs text-sidebar-foreground/70">
47-
<div
48-
class="mx-1 h-2 w-2 rounded-full mb-[2px]"
49-
:class="serviceStore.serverConnected ? 'bg-green-500' : 'bg-red-500'"
50-
/>
51-
<span class="text-sm select-none">{{ serviceStore.serverConnected ? t('connected') : t('disconnected') }}</span>
52-
</div>
53-
</HoverCardTrigger>
54-
<HoverCardContent v-if="serviceStore.serverConnected" :side-offset="0" class="pt-2 py-1">
55-
<div class="font-mono text-sm text-center mt-1">
56-
{{ serviceStore.serviceHost }}
57-
</div>
58-
</HoverCardContent>
59-
</HoverCard>
60-
<slot name="actions" />
61-
</div>
43+
<HoverCard :open-delay="400">
44+
<HoverCardTrigger>
45+
<div class="h-8 flex items-center justify-center gap-2 text-xs text-sidebar-foreground/70">
46+
<div
47+
class="h-2 w-2 rounded-full mb-[2px]"
48+
:class="serviceStore.serverConnected ? 'bg-green-500' : 'bg-red-500'"
49+
/>
50+
<span class="text-sm select-none">{{ serviceStore.serverConnected ? t('connected') : t('disconnected') }}</span>
51+
</div>
52+
</HoverCardTrigger>
53+
<HoverCardContent v-if="serviceStore.serverConnected" :side-offset="0" class="pt-2 py-1">
54+
<div class="font-mono text-sm text-center mt-1">
55+
{{ serviceStore.serviceHost }}
56+
</div>
57+
</HoverCardContent>
58+
</HoverCard>
6259
</div>
6360

6461
<!-- Compact variant (used in login form) -->

‎ui/src/components/ThemeSelector.vue‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script setup lang="ts">
22
import type { Theme } from '@/stores/theme'
3-
import { Moon, Sun } from 'lucide-vue-next'
3+
import { Monitor, Moon, Sun } from 'lucide-vue-next'
44
import { useI18n } from 'vue-i18n'
55
import {
66
Select,
@@ -15,9 +15,9 @@ const { t } = useI18n()
1515
const themeStore = useThemeStore()
1616
1717
const themeOptions = [
18+
{ value: 'system' as const, label: t('systemMode'), icon: Monitor },
1819
{ value: 'light' as const, label: t('lightMode'), icon: Sun },
1920
{ value: 'dark' as const, label: t('darkMode'), icon: Moon },
20-
// { value: 'system' as const, label: t('systemMode'), icon: Monitor },
2121
]
2222
2323
function handleThemeChange(newTheme: unknown) {
@@ -61,13 +61,13 @@ function handleThemeChange(newTheme: unknown) {
6161
zh-CN:
6262
theme: 主题
6363
themeDescription: 选择您偏好的颜色主题
64+
systemMode: 跟随系统
6465
lightMode: 浅色模式
6566
darkMode: 深色模式
66-
systemMode: 跟随系统
6767
en-US:
6868
theme: Theme
6969
themeDescription: Choose your preferred color theme
70+
systemMode: System Mode
7071
lightMode: Light Mode
7172
darkMode: Dark Mode
72-
systemMode: System Mode
7373
</i18n>

‎ui/src/components/ThemeToggle.vue‎

Lines changed: 0 additions & 65 deletions
This file was deleted.

‎ui/src/stores/theme.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { defineStore } from 'pinia'
22
import { ref, watch } from 'vue'
33

4-
export type Theme = 'light' | 'dark' | 'system'
4+
export type Theme = 'system' | 'light' | 'dark'
55

66
export const useThemeStore = defineStore('theme', () => {
77
const theme = ref<Theme>('system')
@@ -10,7 +10,7 @@ export const useThemeStore = defineStore('theme', () => {
1010
// Initialize theme from localStorage or default to system
1111
function initTheme() {
1212
const savedTheme = localStorage.getItem('theme') as Theme | null
13-
if (savedTheme && ['light', 'dark', 'system'].includes(savedTheme)) {
13+
if (savedTheme && ['system', 'light', 'dark'].includes(savedTheme)) {
1414
theme.value = savedTheme
1515
}
1616
updateTheme()

0 commit comments

Comments
 (0)