first commit

2026-09-28 13:52:25 +07:00
commit 566275348c
262 changed files with 37008 additions and 0 deletions
@@ -0,0 +1,28 @@
+import Icon from '@/components/site/icon';
+import { useAppearance } from '@/hooks/use-appearance';
+import { cn } from '@/lib/utils';
+
+/** Switches the whole app between light and dark mode. */
+export default function ThemeToggle({ className }: { className?: string }) {
+    const { resolvedAppearance, updateAppearance } = useAppearance();
+    const isDark = resolvedAppearance === 'dark';
+    const label = isDark ? 'Ganti ke mode terang' : 'Ganti ke mode gelap';
+
+    return (
+        <button
+            type="button"
+            onClick={() => updateAppearance(isDark ? 'light' : 'dark')}
+            aria-label={label}
+            title={label}
+            className={cn(
+                'border-outline-variant/50 bg-surface-container-low text-on-surface hover:border-primary/60 hover:text-primary inline-flex h-10 w-10 cursor-pointer items-center justify-center rounded-xl border transition-colors',
+                className,
+            )}
+        >
+            <Icon
+                name={isDark ? 'light_mode' : 'dark_mode'}
+                className="text-xl"
+            />
+        </button>
+    );
+}