2021-10-05 12:03:24 +02:00
|
|
|
// Set theme on page load
|
|
|
|
// This is done outside the Angular app to avoid a flash of unthemed content before it loads
|
|
|
|
// The defaultTheme is also set in the html itself to make sure that some theming is always applied
|
|
|
|
(function () {
|
2021-12-17 15:57:11 +01:00
|
|
|
const defaultTheme = "light";
|
|
|
|
const htmlEl = document.documentElement;
|
|
|
|
let theme = defaultTheme;
|
2021-10-05 12:03:24 +02:00
|
|
|
|
2022-01-28 17:30:45 +01:00
|
|
|
const globalState = window.localStorage.getItem("global");
|
|
|
|
if (globalState != null) {
|
|
|
|
const globalStateJson = JSON.parse(globalState);
|
|
|
|
if (globalStateJson != null && globalStateJson.theme != null) {
|
|
|
|
if (globalStateJson.theme.indexOf("system") > -1) {
|
2021-12-17 15:57:11 +01:00
|
|
|
theme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
|
2022-01-28 17:30:45 +01:00
|
|
|
} else if (globalStateJson.theme.indexOf("dark") > -1) {
|
2021-12-17 15:57:11 +01:00
|
|
|
theme = "dark";
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if (!htmlEl.classList.contains("theme_" + theme)) {
|
|
|
|
htmlEl.classList.remove("theme_" + defaultTheme);
|
|
|
|
htmlEl.classList.add("theme_" + theme);
|
2021-10-05 12:03:24 +02:00
|
|
|
}
|
2021-12-17 15:57:11 +01:00
|
|
|
}
|
2021-10-05 12:03:24 +02:00
|
|
|
})();
|