56 lines
1.8 KiB
TypeScript
56 lines
1.8 KiB
TypeScript
'use client';
|
|
|
|
import { useTheme } from '@/components/theme-provider';
|
|
|
|
export default function Footer() {
|
|
const { theme, toggleTheme } = useTheme();
|
|
|
|
return (
|
|
<div className="max-w-7xl mx-auto py-8 px-4 sm:px-6 lg:px-8">
|
|
<div className="flex flex-col items-center gap-2 text-sm">
|
|
<button
|
|
onClick={toggleTheme}
|
|
className="flex items-center gap-2 px-4 py-2 rounded-full bg-card-soft hover:bg-[color:var(--accent-soft)] border border-[color:var(--border)] transition-colors text-[color:var(--ink-soft)] font-medium shadow-soft"
|
|
aria-label="Alternar tema"
|
|
>
|
|
{theme === 'light' ? (
|
|
<>
|
|
<svg
|
|
className="w-5 h-5"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"
|
|
/>
|
|
</svg>
|
|
<span>Modo escuro</span>
|
|
</>
|
|
) : (
|
|
<>
|
|
<svg
|
|
className="w-5 h-5"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"
|
|
/>
|
|
</svg>
|
|
<span>Modo claro</span>
|
|
</>
|
|
)}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|