- bookmark management with dnd-kit reordering, bulk edit, search, category filter/rename, and meta auto-fetch - migrate /bookmarks → /dashboard/bookmarks under (main) layout - homepage redesign with category grid, /-key search, dock tooltips - theme toggle + use-theme, sonner toasts, alert-dialog/skeleton, visual refresh of auth pages Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
27 lines
697 B
TypeScript
27 lines
697 B
TypeScript
"use client";
|
|
|
|
import { Moon, Sun } from "lucide-react";
|
|
import { useTheme } from "@/lib/use-theme";
|
|
|
|
export function ThemeToggle({ className }: { className?: string }) {
|
|
const { theme, toggle, mounted } = useTheme();
|
|
|
|
return (
|
|
<button
|
|
type="button"
|
|
onClick={toggle}
|
|
aria-label={mounted ? (theme === "dark" ? "切换到浅色" : "切换到深色") : "切换主题"}
|
|
className={
|
|
className ??
|
|
"flex h-full w-full items-center justify-center text-foreground/80 hover:text-foreground"
|
|
}
|
|
>
|
|
{mounted && theme === "dark" ? (
|
|
<Sun className="h-5 w-5" />
|
|
) : (
|
|
<Moon className="h-5 w-5" />
|
|
)}
|
|
</button>
|
|
);
|
|
}
|