Enable resetting the colour scheme to the system appearance
This commit is contained in:
parent
694faa0517
commit
051b32a983
@ -67,6 +67,10 @@
|
||||
<input type="radio" name="color-scheme" value="light">
|
||||
Light
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" name="color-scheme" value="system">
|
||||
System
|
||||
</label>
|
||||
</fieldset>
|
||||
</header>
|
||||
{{ content | safe }}
|
||||
@ -90,11 +94,7 @@
|
||||
return localStorage.getItem('color-scheme');
|
||||
}
|
||||
|
||||
if (window.matchMedia('(prefers-color-scheme: dark)')?.matches) {
|
||||
return "dark";
|
||||
}
|
||||
|
||||
return "light";
|
||||
return "system";
|
||||
};
|
||||
|
||||
const data = new Proxy({
|
||||
@ -110,7 +110,7 @@
|
||||
});
|
||||
|
||||
const onRadioChange = e => {
|
||||
data[e.target.name] = e.target.value;
|
||||
data[e.target.name] = e.target.value;
|
||||
}
|
||||
|
||||
document.querySelectorAll('[name="color-scheme"]').forEach(radio => {
|
||||
|
@ -59,6 +59,12 @@ header > * {
|
||||
}
|
||||
}
|
||||
|
||||
&:has([value="system"]) {
|
||||
&::before {
|
||||
content: "\f390";
|
||||
}
|
||||
}
|
||||
|
||||
&:has(:checked)::before {
|
||||
text-shadow: var(--color-decoration) 1px 0 10px;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user