You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

24 lines
757 B

import styles from '../styles/components/Buttons.module.css';
import Link from 'next/link'
import { useState, useEffect } from "react";
export default function ThemeToggle() {
const [activeTheme, setActiveTheme] = useState("light");
const inactiveTheme = activeTheme === "light" ? "dark" : "light";
useEffect(() => {
const savedTheme = window.localStorage.getItem("theme");
savedTheme && setActiveTheme(savedTheme);
}, []);
useEffect(() => {
document.body.dataset.theme = activeTheme;
window.localStorage.setItem("theme", activeTheme);
}, [activeTheme]);
return (
<a onClick={() => setActiveTheme(inactiveTheme)} href="#">
<span>🌙</span>
</a>
)
}