Fix colour scheme toggling when switching from default dark mode (#2494)
* Fix colour scheme toggling when switching from default dark mode * Add workaround for Chrome bug where disabling element doesn't cause rerender
This commit is contained in:
parent
fe2d145d5a
commit
67fe49b322
|
@ -3,21 +3,24 @@ const pygmentsNormal = document.getElementById("pyg");
|
||||||
const pygmentsDark = document.getElementById("pyg-dark");
|
const pygmentsDark = document.getElementById("pyg-dark");
|
||||||
|
|
||||||
const makeLight = () => {
|
const makeLight = () => {
|
||||||
dark.media = pygmentsNormal.media = pygmentsDark.media = ""
|
|
||||||
dark.disabled = pygmentsDark.disabled = true
|
dark.disabled = pygmentsDark.disabled = true
|
||||||
|
dark.media = pygmentsNormal.media = pygmentsDark.media = ""
|
||||||
pygmentsNormal.disabled = false
|
pygmentsNormal.disabled = false
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const makeDark = () => {
|
const makeDark = () => {
|
||||||
dark.media = pygmentsNormal.media = pygmentsDark.media = ""
|
|
||||||
dark.disabled = pygmentsDark.disabled = false
|
dark.disabled = pygmentsDark.disabled = false
|
||||||
|
dark.media = pygmentsNormal.media = pygmentsDark.media = ""
|
||||||
pygmentsNormal.disabled = true
|
pygmentsNormal.disabled = true
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
const toggleColourScheme = () => {
|
const toggleColourScheme = () => {
|
||||||
if (localStorage.getItem("colour_scheme") === "dark") {
|
const colourScheme = localStorage.getItem("colour_scheme")
|
||||||
|
const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches
|
||||||
|
|
||||||
|
if ((colourScheme === "dark") || (!colourScheme && prefersDark)) {
|
||||||
makeLight()
|
makeLight()
|
||||||
localStorage.setItem("colour_scheme", "light")
|
localStorage.setItem("colour_scheme", "light")
|
||||||
} else {
|
} else {
|
||||||
|
|
Loading…
Reference in New Issue