xiaoxue_admin
/
xLog
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #340 from suemor233/fix/dark-mode-switch

This commit is contained in:
DIYgod 2023-04-14 15:27:45 +01:00 committed by GitHub
parent d03103c592 5d41e3df77
commit 00d5ca6f61
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/hooks/useDarkMode.ts
View File

@ -18,7 +18,7 @@ interface DarkModeConfig {
classNameDark?: string // A className to set "dark mode". Default = "dark-mode".
classNameLight?: string // A className to set "light mode". Default = "light-mode".
element?: HTMLElement | undefined | null // The element to apply the className. Default = `document.body`
storageKey?: string // Specify the `localStorage` key. Default = "darkMode". Sewt to `null` to disable persistent storage.
storageKey?: string // Specify the `localStorage` key. Default = "darkMode". set to `undefined` to disable persistent storage.
}
const useDarkMode = (
@ -37,11 +37,11 @@ const useDarkMode = (
useEffect(() => {
const presentedDarkMode = storageKey
? isServerSide()
? null
: getStorage(storageKey) || null
: null
? undefined
: getStorage(storageKey)
: undefined
if (presentedDarkMode !== null) {
if (presentedDarkMode !== undefined) {
if (presentedDarkMode === "true") {
setDarkMode(true)
} else if (presentedDarkMode === "false") {
@ -55,14 +55,14 @@ const useDarkMode = (
useEffect(() => {
const handler = (e: MediaQueryListEvent) => {
const storageValue = getStorage(storageKey || "darkMode")
if (storageValue === null) {
if (storageValue === undefined) {
setDarkMode(e.matches)
}
}
const focusHandler = () => {
const storageValue = getStorage(storageKey || "darkMode")
if (storageValue === null) {
if (storageValue === undefined) {
setDarkMode(window.matchMedia("(prefers-color-scheme: dark)").matches)
}
}