33 lines
1.1 KiB
TypeScript
33 lines
1.1 KiB
TypeScript
'use client';
|
|
|
|
import { MoonIcon, SunIcon } from '@repo/ui/lotties';
|
|
import { Button } from '@shadcn/ui/button';
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuTrigger,
|
|
} from '@shadcn/ui/dropdown-menu';
|
|
import { useTheme } from 'next-themes';
|
|
|
|
export default function ThemeSwitch() {
|
|
const { setTheme } = useTheme();
|
|
|
|
return (
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button variant='ghost' size='icon'>
|
|
<MoonIcon className='size-8 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0' />
|
|
<SunIcon className='roate-90 absolute size-8 scale-0 transition-all dark:rotate-0 dark:scale-100' />
|
|
<span className='sr-only'>Toggle theme</span>
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align='end'>
|
|
<DropdownMenuItem onClick={() => setTheme('light')}>Light</DropdownMenuItem>
|
|
<DropdownMenuItem onClick={() => setTheme('dark')}>Dark</DropdownMenuItem>
|
|
<DropdownMenuItem onClick={() => setTheme('system')}>System</DropdownMenuItem>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
);
|
|
}
|