feat: add workspace theme toggle

This commit is contained in:
2026-07-03 04:28:01 -07:00
parent c4d5222ddd
commit fb15d4db47
4 changed files with 147 additions and 6 deletions

View File

@@ -6,6 +6,7 @@ import { SignOutButton } from "@/modules/auth/components/SignOutButton";
import { AccountMenu } from "@/modules/shared/components/AccountMenu";
import { AppBreadcrumbs } from "@/modules/shared/components/AppBreadcrumbs";
import { AppSidebarNav } from "@/modules/shared/components/AppSidebarNav";
import { ThemeToggle } from "@/modules/shared/components/ThemeToggle";
import { UserAvatar } from "@/modules/shared/components/UserAvatar";
import { navItems } from "@/modules/shared/lib/navigation";
import { getWorkspaceHref } from "@/modules/shared/lib/workspace-routing";
@@ -30,7 +31,7 @@ export function AppShell({
return (
<div className="flex h-svh items-stretch overflow-hidden bg-background text-foreground">
<aside className="hidden h-svh w-64 shrink-0 border-r bg-white/78 backdrop-blur xl:block">
<aside className="hidden h-svh w-64 shrink-0 border-r bg-card/78 backdrop-blur xl:block">
<div className="flex h-full min-h-0 flex-col">
<Link href={dashboardHref} className="flex h-16 shrink-0 items-center gap-3 border-b px-5">
<span className="inline-flex size-10 items-center justify-center rounded-md bg-primary text-primary-foreground">
@@ -61,15 +62,18 @@ export function AppShell({
</span>
<AppBreadcrumbs />
</div>
<div className="flex min-w-0 items-center gap-2 xl:hidden">
<div className="hidden min-w-0 items-center gap-2 sm:flex">
<div className="flex min-w-0 items-center gap-2">
<ThemeToggle />
<div className="hidden min-w-0 items-center gap-2 sm:flex xl:hidden">
<p className="min-w-0 max-w-[min(52vw,24rem)] truncate whitespace-nowrap text-right text-sm leading-tight">
<span className="font-medium">{account.name}</span>
<span className="ml-2 text-muted-foreground">{account.email}</span>
</p>
<UserAvatar avatarUrl={account.avatarUrl} name={account.name} size="sm" />
</div>
<SignOutButton />
<div className="xl:hidden">
<SignOutButton />
</div>
</div>
</header>