gitscope
/
← marzneshin / dashboard/src/features/theme-switch/theme-toggle/index.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/theme-switch/theme-toggle/index.tsx · v0.6.2
Source
1 1c0d1b7 Dawsh 2y ago import { Moon, Sun } from "lucide-react";
2 88bd1b0 Mrdn 2y ago import {
3 3c1143b Mardin 2y ago DropdownMenuSub,
4 3c1143b Mardin 2y ago DropdownMenuSubContent,
5 3c1143b Mardin 2y ago DropdownMenuSubTrigger,
6 88bd1b0 Mrdn 2y ago DropdownMenuItem,
7 3c1143b Mardin 2y ago DropdownMenuPortal,
8 1c0d1b7 Dawsh 2y ago } from "@marzneshin/components";
9 3c1143b Mardin 2y ago import { useTheme, Theme } from "../theme-provider";
10 1c0d1b7 Dawsh 2y ago import { useTranslation } from "react-i18next";
11 3c1143b Mardin 2y ago import { cn } from "@marzneshin/utils";
12 3c1143b Mardin 2y ago
13 3c1143b Mardin 2y ago const ThemeItem = ({ schema }: { schema: Theme }) => {
14 3c1143b Mardin 2y ago const { theme, setTheme } = useTheme();
15 3c1143b Mardin 2y ago const { t } = useTranslation();
16 3c1143b Mardin 2y ago return (
17 3c1143b Mardin 2y ago <DropdownMenuItem
18 3c1143b Mardin 2y ago className={cn({ "bg-primary text-secondary": theme === schema })}
19 3c1143b Mardin 2y ago onMouseDown={() => setTheme(schema)}>
20 3c1143b Mardin 2y ago {t(schema)}
21 3c1143b Mardin 2y ago </DropdownMenuItem>
22 3c1143b Mardin 2y ago );
23 3c1143b Mardin 2y ago }
24 88bd1b0 Mrdn 2y ago
25 88bd1b0 Mrdn 2y ago export function ThemeToggle() {
26 1c0d1b7 Dawsh 2y ago const { t } = useTranslation();
27 3c1143b Mardin 2y ago
28 88bd1b0 Mrdn 2y ago return (
29 3c1143b Mardin 2y ago <DropdownMenuSub>
30 3c1143b Mardin 2y ago <DropdownMenuSubTrigger arrowDir="left" className="w-full flex">
31 3c1143b Mardin 2y ago <div className="flex items-center ml-auto">
32 3c1143b Mardin 2y ago <Sun className="w-4 h-4 m-0 transition-all transform scale-100 rotate-0 dark:scale-0 dark:-rotate-90" />
33 3c1143b Mardin 2y ago <Moon className="w-4 h-4 m-0 transition-all transform scale-0 rotate-90 dark:scale-100 dark:rotate-0" />
34 3c1143b Mardin 2y ago </div>
35 3c1143b Mardin 2y ago <span>{t('theme')}</span>
36 3c1143b Mardin 2y ago </DropdownMenuSubTrigger>
37 3c1143b Mardin 2y ago <DropdownMenuPortal>
38 3c1143b Mardin 2y ago <DropdownMenuSubContent className="space-y-1">
39 3c1143b Mardin 2y ago <ThemeItem schema="light" />
40 3c1143b Mardin 2y ago <ThemeItem schema="dark" />
41 3c1143b Mardin 2y ago <ThemeItem schema="system" />
42 3c1143b Mardin 2y ago </DropdownMenuSubContent>
43 3c1143b Mardin 2y ago </DropdownMenuPortal>
44 3c1143b Mardin 2y ago </DropdownMenuSub>
45 1c0d1b7 Dawsh 2y ago );
46 3c1143b Mardin 2y ago
47 88bd1b0 Mrdn 2y ago }