gh_mirrors/newsnow
1
0
Fork 0
mirror of https://github.com/ourongxing/newsnow.git synced 2025-01-19 03:09:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: flash in loading

Browse Source
This commit is contained in:
Ou 2024-10-14 17:19:28 +08:00
parent 4607758dd0
commit dc0deb4ead
2 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/hooks/useDark.ts
View File

@ -4,7 +4,9 @@ import { useLocalStorage, useMedia } from "react-use"
export declare type ColorScheme = "dark" | "light" | "auto" export declare type ColorScheme = "dark" | "light" | "auto"
export function useDark(key = "color-scheme", defaultColorScheme: ColorScheme = "auto") { export function useDark(key = "color-scheme", defaultColorScheme: ColorScheme = "auto") {
const [colorScheme, setColorScheme] = useLocalStorage(key, defaultColorScheme) const [colorScheme, setColorScheme] = useLocalStorage(key, defaultColorScheme, {
raw: true,
})
const prefersDarkMode = useMedia("(prefers-color-scheme: dark)") const prefersDarkMode = useMedia("(prefers-color-scheme: dark)")
const isDark = useMemo(() => colorScheme === "auto" ? prefersDarkMode : colorScheme === "dark", [colorScheme, prefersDarkMode]) const isDark = useMemo(() => colorScheme === "auto" ? prefersDarkMode : colorScheme === "dark", [colorScheme, prefersDarkMode])

6
src/routes/__root.tsx
View File

@ -16,6 +16,12 @@ export const Route = createRootRouteWithContext<{
component: RootComponent, component: RootComponent,
notFoundComponent: NotFoundComponent, notFoundComponent: NotFoundComponent,
beforeLoad: () => { beforeLoad: () => {
const theme = localStorage.getItem("color-scheme") || "auto"
const isDark = window.matchMedia("(prefers-color-scheme: dark)").matches
if (!theme ? isDark : theme === "dark") {
document.documentElement.classList.add("dark")
}
const query = new URLSearchParams(window.location.search) const query = new URLSearchParams(window.location.search)
if (query.has("login")) { if (query.has("login")) {
[...query.entries()].forEach(key => localStorage.setItem(key[0], key[1])) [...query.entries()].forEach(key => localStorage.setItem(key[0], key[1]))