xfy/DefectingCat.github.io
1
0
Fork 0
mirror of https://github.com/DefectingCat/DefectingCat.github.io synced 2025-07-16 01:01:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix darkmode

Browse Source
This commit is contained in:
DefectingCat
2023-11-10 09:42:35 +08:00
parent 5335a6cc46
commit e83fd2dff5
1 changed files with 10 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
components/pages/dark-mode-btn.tsx
View File

@ -8,6 +8,14 @@ const DarkModeBtn = () => {
const { mounted } = useMounted(); const { mounted } = useMounted();
const { systemTheme, theme, setTheme } = useTheme(); const { systemTheme, theme, setTheme } = useTheme();
const currentTheme = theme === 'system' ? systemTheme : theme; const currentTheme = theme === 'system' ? systemTheme : theme;
const handleTheme = (type: 'light' | 'dark') => () => {
const map = {
light: 'latte',
dark: 'mocha',
};
document.body.className = map[type];
setTheme(type);
};
if (!mounted) { if (!mounted) {
return ( return (
@ -26,11 +34,11 @@ const DarkModeBtn = () => {
<> <>
{currentTheme === 'dark' ? ( {currentTheme === 'dark' ? (
<button> <button>
<FiSun className="w-5 h-5" onClick={() => setTheme('light')} /> <FiSun className="w-5 h-5" onClick={handleTheme('light')} />
</button> </button>
) : ( ) : (
<button> <button>
<FiMoon className="w-5 h-5" onClick={() => setTheme('dark')} /> <FiMoon className="w-5 h-5" onClick={handleTheme('dark')} />
</button> </button>
)} )}
</> </>