feat: add Tooltips

This commit is contained in:
Li Xin 2025-04-20 21:33:03 +08:00
parent 2f6b6a1d8d
commit 65c8a5595f
2 changed files with 21 additions and 11 deletions

View File

@ -12,17 +12,21 @@ import {
DropdownMenuTrigger,
} from "~/components/ui/dropdown-menu";
import { Tooltip } from "./tooltip";
export function ThemeToggle() {
const { setTheme } = useTheme();
return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon">
<Sun className="h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" />
<Moon className="absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" />
</Button>
</DropdownMenuTrigger>
<Tooltip title="Change theme">
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon">
<Sun className="h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" />
<Moon className="absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" />
</Button>
</DropdownMenuTrigger>
</Tooltip>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={() => setTheme("light")}>
Light

View File

@ -15,6 +15,7 @@ import { Logo } from "./_components/logo";
import { MessagesBlock } from "./_components/messages-block";
import { ResearchBlock } from "./_components/research-block";
import { ThemeToggle } from "./_components/theme-toggle";
import { Tooltip } from "./_components/tooltip";
export default function HomePage() {
const openResearchId = useStore((state) => state.openResearchId);
@ -27,11 +28,16 @@ export default function HomePage() {
<header className="fixed top-0 left-0 flex h-12 w-full w-screen items-center justify-between px-4">
<Logo />
<div className="flex items-center">
<Button variant="ghost" size="icon" asChild>
<Link href="https://github.com/bytedance/deer-flow" target="_blank">
<GithubOutlined />
</Link>
</Button>
<Tooltip title="Visit DeerFlow on GitHub">
<Button variant="ghost" size="icon" asChild>
<Link
href="https://github.com/bytedance/deer-flow"
target="_blank"
>
<GithubOutlined />
</Link>
</Button>
</Tooltip>
<ThemeToggle />
</div>
</header>