add other projects

apps/admin.saladeaula.digital/app/components/dark-mode.tsx

@@ -0,0 +1,54 @@
+'use client'
+
+import { Moon, Sun, SunMoon } from 'lucide-react'
+import { useTheme } from 'next-themes'
+
+import { Button } from '@/components/ui/button'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger
+} from '@/components/ui/dropdown-menu'
+import dark from './logo-dark.svg'
+import light from './logo-light.svg'
+
+export function ModeToggle() {
+  const { setTheme } = useTheme()
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button
+          variant="link"
+          size="icon"
+          className="cursor-pointer text-muted-foreground"
+        >
+          <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" />
+          <span className="sr-only">Alternar tema</span>
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent align="end" className="*:cursor-pointer">
+        <DropdownMenuItem onClick={() => setTheme('light')}>
+          <Sun /> Claro
+        </DropdownMenuItem>
+        <DropdownMenuItem onClick={() => setTheme('dark')}>
+          <Moon /> Escuro
+        </DropdownMenuItem>
+        <DropdownMenuItem onClick={() => setTheme('system')}>
+          <SunMoon /> Sistema
+        </DropdownMenuItem>
+      </DropdownMenuContent>
+    </DropdownMenu>
+  )
+}
+
+export function ThemedImage() {
+  return (
+    <>
+      <img src={light} className="h-8" data-hide-on-theme="dark" />
+      <img src={dark} className="h-8" data-hide-on-theme="light" />
+    </>
+  )
+}