8x48/homepage
1
0
Fork 0
mirror of https://github.com/gethomepage/homepage.git synced 2026-01-11 11:32:09 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

add theme switcher

Browse Source
This commit is contained in:
Ben Phelps
2022-08-25 11:14:17 +03:00
parent 5711b22b4e
commit 1b2fa720c6
8 changed files with 469 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/utils/theme-context.js
View File

@@ -2,7 +2,7 @@ import { createContext, useState, useEffect } from "react";
const getInitialTheme = () => {
if (typeof window !== "undefined" && window.localStorage) {
const storedPrefs = window.localStorage.getItem("color-theme");
const storedPrefs = window.localStorage.getItem("theme-mode");
if (typeof storedPrefs === "string") {
return storedPrefs;
}
@@ -13,7 +13,7 @@ const getInitialTheme = () => {
}
}
return "light"; // light theme as the default;
return "dark"; // dark as the default mode
};
export const ThemeContext = createContext();
@@ -28,7 +28,7 @@ export const ThemeProvider = ({ initialTheme, children }) => {
root.classList.remove(isDark ? "light" : "dark");
root.classList.add(rawTheme);
localStorage.setItem("color-theme", rawTheme);
localStorage.setItem("theme-mode", rawTheme);
};
if (initialTheme) {
@@ -39,9 +39,5 @@ export const ThemeProvider = ({ initialTheme, children }) => {
rawSetTheme(theme);
}, [theme]);
return (
<ThemeContext.Provider value={{ theme, setTheme }}>
{children}
</ThemeContext.Provider>
);
return <ThemeContext.Provider value={{ theme, setTheme }}>{children}</ThemeContext.Provider>;
};