Follow the system theme automatically when dark mode toggle was not set before (#1696)

* follow browser theme unless darkmode was set before

* trigger workflow
This commit is contained in:
Lelouch He
2025-11-21 15:46:25 +01:00
committed by GitHub
parent c50bb49205
commit 7afda4aa37
+19 -6
View File
@@ -99,14 +99,27 @@ export class MainUI {
}, [viewState.uiOptions.vimMode]);
useEffect(() => {
const darkMode = viewState.uiOptions.darkMode === undefined
? globalThis.matchMedia("(prefers-color-scheme: dark)").matches
: viewState.uiOptions.darkMode;
const updateTheme = () => {
const darkMode = viewState.uiOptions.darkMode === undefined
? globalThis.matchMedia("(prefers-color-scheme: dark)").matches
: viewState.uiOptions.darkMode;
document.documentElement.dataset.theme = darkMode ? "dark" : "light";
document.documentElement.dataset.theme = darkMode ? "dark" : "light";
if (this.client.isDocumentEditor()) {
this.client.documentEditor.updateTheme();
if (this.client.isDocumentEditor()) {
this.client.documentEditor.updateTheme();
}
};
updateTheme();
if (viewState.uiOptions.darkMode === undefined) {
const mediaQuery = globalThis.matchMedia("(prefers-color-scheme: dark)");
mediaQuery.addEventListener("change", updateTheme);
return () => {
mediaQuery.removeEventListener("change", updateTheme);
};
}
}, [viewState.uiOptions.darkMode]);