|
| 1 | +(() => { |
| 2 | + "use strict"; |
| 3 | + const hljsStyleCdnDefault = |
| 4 | + "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/default.min.css"; |
| 5 | + const hljsStyleCdnDark = |
| 6 | + "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/base16/synth-midnight-terminal-dark.min.css"; |
| 7 | + |
| 8 | + const hlCssLinkTag = document.querySelector("#hl-css"); |
| 9 | + const storedTheme = localStorage.getItem("theme"); |
| 10 | + const cdnMap = { |
| 11 | + light: hljsStyleCdnDefault, |
| 12 | + dark: hljsStyleCdnDark, |
| 13 | + }; |
| 14 | + const getPreferredTheme = () => { |
| 15 | + if (storedTheme) { |
| 16 | + return storedTheme; |
| 17 | + } |
| 18 | + return window.matchMedia("(prefers-color-scheme: dark)").matches |
| 19 | + ? "dark" |
| 20 | + : "light"; |
| 21 | + }; |
| 22 | + const setTheme = function (theme) { |
| 23 | + if ( |
| 24 | + theme === "auto" && |
| 25 | + window.matchMedia("(prefers-color-scheme: dark)").matches |
| 26 | + ) { |
| 27 | + document.documentElement.setAttribute("data-bs-theme", "dark"); |
| 28 | + } else { |
| 29 | + document.documentElement.setAttribute("data-bs-theme", theme); |
| 30 | + } |
| 31 | + }; |
| 32 | + const getToggleToTheme = (currentTheme) => |
| 33 | + currentTheme === "dark" ? "light" : "dark"; |
| 34 | + const initTheme = () => { |
| 35 | + const currentTheme = getPreferredTheme(); |
| 36 | + setTheme(currentTheme); |
| 37 | + const toggleTargetTheme = getToggleToTheme(currentTheme); |
| 38 | + hlCssLinkTag.setAttribute("href", cdnMap?.[currentTheme]); |
| 39 | + document.querySelectorAll("[data-bs-theme-value]").forEach((toggle) => { |
| 40 | + const toggleTheme = () => { |
| 41 | + document |
| 42 | + .querySelectorAll("[data-bs-theme-value]") |
| 43 | + .forEach((_toggle) => { |
| 44 | + const targetTheme = getToggleToTheme( |
| 45 | + document.documentElement.getAttribute("data-bs-theme"), |
| 46 | + ); |
| 47 | + hlCssLinkTag.setAttribute("href", cdnMap?.[targetTheme]); |
| 48 | + setTheme(targetTheme); |
| 49 | + localStorage.setItem("theme", targetTheme); |
| 50 | + }); |
| 51 | + }; |
| 52 | + console.log("", toggleTargetTheme); |
| 53 | + toggle.setAttribute("data-bs-theme-value", toggleTargetTheme); |
| 54 | + toggle.addEventListener("click", toggleTheme); |
| 55 | + }); |
| 56 | + }; |
| 57 | + initTheme(); |
| 58 | + window |
| 59 | + .matchMedia("(prefers-color-scheme: dark)") |
| 60 | + .addEventListener("change", () => { |
| 61 | + if (storedTheme !== "light" || storedTheme !== "dark") { |
| 62 | + setTheme(getPreferredTheme()); |
| 63 | + } |
| 64 | + }); |
| 65 | + |
| 66 | + window.rustQuizSetTheme = setTheme; |
| 67 | +})(); |
0 commit comments