mirror of https://github.com/astral-sh/ruff
Fix dark theme on initial page load (#13077)
This commit is contained in:
parent
1f2cb09853
commit
2d5fe9a6d3
|
|
@ -105,8 +105,6 @@ async function startPlayground(): Promise<{
|
|||
await initRuff();
|
||||
const monaco = await loader.init();
|
||||
|
||||
console.log(monaco);
|
||||
|
||||
setupMonaco(monaco);
|
||||
|
||||
const response = await restore();
|
||||
|
|
|
|||
|
|
@ -6,16 +6,14 @@ import { useState } from "react";
|
|||
export type Theme = "dark" | "light";
|
||||
|
||||
export function useTheme(): [Theme, (theme: Theme) => void] {
|
||||
const [localTheme, setLocalTheme] = useState<Theme>(() =>
|
||||
detectInitialTheme(),
|
||||
);
|
||||
const [localTheme, setLocalTheme] = useState<Theme>(() => {
|
||||
const theme = detectInitialTheme();
|
||||
toggleTheme(theme);
|
||||
return theme;
|
||||
});
|
||||
|
||||
const setTheme = (mode: Theme) => {
|
||||
if (mode === "dark") {
|
||||
document.body.classList.add("dark");
|
||||
} else {
|
||||
document.body.classList.remove("dark");
|
||||
}
|
||||
toggleTheme(mode);
|
||||
localStorage.setItem("theme", mode);
|
||||
setLocalTheme(mode);
|
||||
};
|
||||
|
|
@ -35,3 +33,11 @@ function detectInitialTheme(): Theme {
|
|||
return "light";
|
||||
}
|
||||
}
|
||||
|
||||
function toggleTheme(theme: Theme) {
|
||||
if (theme === "dark") {
|
||||
document.body.classList.add("dark");
|
||||
} else {
|
||||
document.body.classList.remove("dark");
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue