mirror of
https://github.com/hanzo-apps/HIPs.git
synced 2026-10-30 14:47:28 +00:00
zeekay
e2136943ad
Switch to unified @hanzo/[email protected], Geist fonts, pure black/white HSL color scheme, fumadocs CSS overrides, Dracula syntax highlighting. Add HomeHeader, DocsFooter, SearchTrigger, ThemeToggle, Logo components. Rewrite homepage with hero, stats, categories, recent proposals sections. Expand source.ts to 14 categories covering all 85+ HIPs. Upgrade search dialog to cmdk + @radix-ui/react-dialog.
49 lines
1.6 KiB
TypeScript
49 lines
1.6 KiB
TypeScript
'use client';
|
|
|
|
import { useTheme } from 'next-themes';
|
|
import { useEffect, useState } from 'react';
|
|
|
|
export function ThemeToggle() {
|
|
const { setTheme, resolvedTheme } = useTheme();
|
|
const [mounted, setMounted] = useState(false);
|
|
|
|
useEffect(() => {
|
|
setMounted(true);
|
|
}, []);
|
|
|
|
if (!mounted) {
|
|
return (
|
|
<button
|
|
className="rounded-lg p-2 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
|
|
aria-label="Toggle theme"
|
|
>
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
|
|
<circle cx="12" cy="12" r="5" />
|
|
<path d="M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42" />
|
|
</svg>
|
|
</button>
|
|
);
|
|
}
|
|
|
|
const isDark = resolvedTheme === 'dark';
|
|
|
|
return (
|
|
<button
|
|
onClick={() => setTheme(isDark ? 'light' : 'dark')}
|
|
className="rounded-lg p-2 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
|
|
aria-label={`Switch to ${isDark ? 'light' : 'dark'} theme`}
|
|
>
|
|
{isDark ? (
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
|
|
<circle cx="12" cy="12" r="5" />
|
|
<path d="M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42" />
|
|
</svg>
|
|
) : (
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
|
|
<path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" />
|
|
</svg>
|
|
)}
|
|
</button>
|
|
);
|
|
}
|