style: elevate enterprise admin visual foundation

This commit is contained in:
hailin
2026-07-02 15:52:23 +08:00
parent a16e0be5b1
commit ce423bd90b
11 changed files with 85 additions and 58 deletions

View File

@@ -13,7 +13,7 @@ export function AppTopbar({ onMobileMenuClick }: AppTopbarProps) {
const { logout, user } = useAuth()
return (
<header className="sticky top-0 z-20 flex h-14 items-center justify-between border-b border-border bg-surface/95 px-6 backdrop-blur">
<header className="sticky top-0 z-20 flex h-14 items-center justify-between border-b border-border/80 bg-surface/95 px-4 shadow-sm backdrop-blur sm:px-6 lg:px-8">
<div className="flex min-w-0 items-center gap-2 text-sm">
<Button
variant="ghost"
@@ -24,23 +24,23 @@ export function AppTopbar({ onMobileMenuClick }: AppTopbarProps) {
>
<Menu data-icon="inline-start" />
</Button>
<span className="font-medium text-foreground">AI 工单平台</span>
<ChevronRight className="size-4 text-muted-foreground" />
<span className="hidden font-medium text-foreground sm:inline">企业服务治理中台</span>
<ChevronRight className="hidden size-4 text-muted-foreground sm:block" />
<span className="truncate text-muted-foreground">当前工作区</span>
</div>
<div className="flex items-center gap-3">
<Badge variant="info">本地环境</Badge>
<Badge variant="outline" className="hidden sm:inline-flex">本地环境</Badge>
<Separator orientation="vertical" className="h-5" />
<Button variant="ghost" size="icon" aria-label="通知">
<Bell data-icon="inline-start" />
</Button>
<Button variant="ghost" className="gap-2">
<Button variant="ghost" className="hidden gap-2 sm:inline-flex">
<UserRound data-icon="inline-start" />
<span>{user?.display_name || user?.username || '当前用户'}</span>
</Button>
<Button variant="outline" className="gap-2" onClick={() => void logout()}>
<LogOut data-icon="inline-start" />
<span>退出</span>
<span className="hidden sm:inline">退出</span>
</Button>
</div>
</header>