Python
/
ruff
mirror of https://github.com/astral-sh/ruff
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix dark theme on initial page load (#13077)

This commit is contained in:
Micha Reiser 2024-08-23 14:53:43 +02:00 committed by GitHub
parent 1f2cb09853
commit 2d5fe9a6d3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 14 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
playground/src/Editor/Chrome.tsx
View File

@ -105,8 +105,6 @@ async function startPlayground(): Promise<{
await initRuff(); await initRuff();
const monaco = await loader.init(); const monaco = await loader.init();
console.log(monaco);
setupMonaco(monaco); setupMonaco(monaco);
const response = await restore(); const response = await restore();

22
playground/src/Editor/theme.ts
View File

@ -6,16 +6,14 @@ import { useState } from "react";
export type Theme = "dark" | "light"; export type Theme = "dark" | "light";
export function useTheme(): [Theme, (theme: Theme) => void] { export function useTheme(): [Theme, (theme: Theme) => void] {
const [localTheme, setLocalTheme] = useState<Theme>(() => const [localTheme, setLocalTheme] = useState<Theme>(() => {
detectInitialTheme(), const theme = detectInitialTheme();
); toggleTheme(theme);
return theme;
});
const setTheme = (mode: Theme) => { const setTheme = (mode: Theme) => {
if (mode === "dark") { toggleTheme(mode);
document.body.classList.add("dark");
} else {
document.body.classList.remove("dark");
}
localStorage.setItem("theme", mode); localStorage.setItem("theme", mode);
setLocalTheme(mode); setLocalTheme(mode);
}; };
@ -35,3 +33,11 @@ function detectInitialTheme(): Theme {
return "light"; return "light";
} }
} }
function toggleTheme(theme: Theme) {
if (theme === "dark") {
document.body.classList.add("dark");
} else {
document.body.classList.remove("dark");
}
}