23 lines
742 B
TypeScript
23 lines
742 B
TypeScript
"use client";
|
|
|
|
import { Moon, Sun } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
import { useAppTheme } from "@/components/ThemeProvider";
|
|
|
|
export function ThemeToggle() {
|
|
const { theme, toggleTheme } = useAppTheme();
|
|
|
|
return (
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
onClick={toggleTheme}
|
|
className="relative rounded-full cursor-pointer hover:bg-transparent transition-colors"
|
|
aria-label="Toggle theme"
|
|
>
|
|
<Sun className={`h-5 w-5 transition-all absolute ${theme === "light" ? "rotate-0 scale-100" : "rotate-90 scale-0"}`} />
|
|
<Moon className={`h-5 w-5 transition-all absolute ${theme === "dark" ? "rotate-0 scale-100" : "rotate-90 scale-0"}`} />
|
|
</Button>
|
|
);
|
|
}
|