add swap animation to theme toggle

This commit is contained in:
Nathaniel Tampus
2023-03-06 15:50:41 +08:00
parent da1a556eea
commit f08623993f

View File

@@ -27,13 +27,10 @@ export default function ThemeToggle() {
<button <button
type="button" type="button"
onClick={() => changeTheme(darkTheme ? "light" : "dark")} onClick={() => changeTheme(darkTheme ? "light" : "dark")}
className="btn btn-ghost btn-circle" className={"btn btn-ghost btn-circle swap swap-rotate" + (darkTheme ? " swap-active" : "")}
> >
{darkTheme ? ( <IconSun className="swap-on m-auto block h-full" />
<IconSun className="m-auto block h-full" /> <IconMoon className="swap-off m-auto block h-full" />
) : (
<IconMoon className="m-auto block h-full" />
)}
</button> </button>
); );
} }