change theme by clicking on the logo

This commit is contained in:
Joshua 2022-10-18 23:03:37 +02:00
parent 0984413e2f
commit 2ea10a2e69
2 changed files with 13 additions and 5 deletions

View file

@ -7,7 +7,7 @@ const Navbar = () => {
<> <>
<div className={styles.center}> <div className={styles.center}>
<Title /> <Title />
<ThemeToggle /> {/* <ThemeToggle /> */}
</div> </div>
</> </>
); );

View file

@ -1,14 +1,22 @@
import Image from "next/image"; import Image from "next/image";
import styles from "styles/Title.module.sass"; import styles from "styles/Title.module.sass";
import { useTheme } from 'next-themes' import { useTheme } from 'next-themes'
function the(t) {
switch (t) {
case "light":
return "dark";
case "dark":
return "light";
}
}
const Title = () => { const Title = () => {
const { resolvedTheme: theme } = useTheme() const { resolvedTheme: theme, setTheme: set } = useTheme();
const logo_size = 150; const logo_size = 150;
return ( return (
<> <>
<Image <Image onClick={() => set(the(theme))}
src={`/logos/${theme || "dark"}.svg`} src={`/logos/${theme || "dark"}.svg`}
width={logo_size} width={logo_size}
height={logo_size / 4} height={logo_size / 4}