fix: dark mode flush

This commit is contained in:
DIYgod 2023-07-18 16:33:16 +01:00
parent 2fbf21d60c
commit dcd64efea6
No known key found for this signature in database
2 changed files with 11 additions and 9 deletions

View File

@ -14,17 +14,17 @@ export const ColorSchemeInjector = () => {
<script
dangerouslySetInnerHTML={{
__html: `(() => {
var DARK_MODE_STORAGE_KEY = "${DARK_MODE_STORAGE_KEY}";
var namespace = "xlog"
var getStorage = () => {
const data = {}
let DARK_MODE_STORAGE_KEY = "${DARK_MODE_STORAGE_KEY}";
let namespace = "xlog"
let getStorage = (key) => {
let data = {}
try {
data = JSON.parse(localStorage.getItem(namespace) || "{}")
} catch (error) {}
return data
return data[key]
}
var COLOR_SCHEME_LIGHT = "${COLOR_SCHEME_LIGHT}";
var COLOR_SCHEME_DARK = "${COLOR_SCHEME_DARK}";
let COLOR_SCHEME_LIGHT = "${COLOR_SCHEME_LIGHT}";
let COLOR_SCHEME_DARK = "${COLOR_SCHEME_DARK}";
let data = {}
const isDark = getStorage(DARK_MODE_STORAGE_KEY)
@ -36,7 +36,7 @@ if (typeof isDark === "undefined") {
document.documentElement.classList.add(currentColorScheme)
} else {
document.documentElement.classList.add(
isDark ? COLOR_SCHEME_DARK : COLOR_SCHEME_LIGHT,
isDark === "true" ? COLOR_SCHEME_DARK : COLOR_SCHEME_LIGHT,
)
}
})();`,

View File

@ -184,7 +184,9 @@ const mockElement = {
export const useDarkMode = () => {
const { toggle, value } = useDarkModeInternal(
getStorage(DARK_MODE_STORAGE_KEY),
getStorage(DARK_MODE_STORAGE_KEY) === undefined
? undefined
: getStorage(DARK_MODE_STORAGE_KEY) === "true",
{
classNameDark: COLOR_SCHEME_DARK,
classNameLight: COLOR_SCHEME_LIGHT,