buzzword-bingo/src/app/components/themeswitcher.tsx

"use client";

import React from 'react';

export default function ThemeSwitcher(){
	const [theme, setTheme] = React.useState("dark");

	React.useEffect(() => {document.body.setAttribute("data-theme", theme)});

	return(
		<ul className="p-2 right-0 text-base-content z-10">
			<li><a onClick={() => setTheme("light")}>Light</a></li>
			<li><a onClick={() => setTheme("dark")}>Dark</a></li>
			<li><a onClick={() => setTheme("synthwave")}>Synthwave</a></li>
			<li><a onClick={() => setTheme("cyberpunk")}>Cyberpunk</a></li>
			<li><a onClick={() => setTheme("valentine")}>Valentine</a></li>
			<li><a onClick={() => setTheme("pastel")}>Pastel</a></li>
			<li><a onClick={() => setTheme("aqua")}>Aqua</a></li>
			<li><a onClick={() => setTheme("coffee")}>Coffee</a></li>
			<li><a onClick={() => setTheme("dim")}>Dim</a></li>
		</ul>
	);
}