mirror of
https://gitea.invidious.io/iv-org/invidious-copy-2022-04-11.git
synced 2024-08-15 00:43:26 +00:00
Use a MediaQueryListener to toggle on demand. Tested on OSX. (#925)
Closes #867.
This commit is contained in:
parent
c620a22017
commit
a3045a3953
1 changed files with 21 additions and 0 deletions
|
@ -28,6 +28,27 @@ window.addEventListener('load', function () {
|
|||
update_mode(window.localStorage.dark_mode);
|
||||
});
|
||||
|
||||
|
||||
var darkScheme = window.matchMedia('(prefers-color-scheme: dark)');
|
||||
var lightScheme = window.matchMedia('(prefers-color-scheme: light)');
|
||||
|
||||
darkScheme.addListener(scheme_switch);
|
||||
lightScheme.addListener(scheme_switch);
|
||||
|
||||
function scheme_switch (e) {
|
||||
// ignore this method if we have a preference set
|
||||
if (localStorage.getItem('dark_mode')) {
|
||||
return;
|
||||
}
|
||||
if (e.matches) {
|
||||
if (e.media.includes("dark")) {
|
||||
set_mode(true);
|
||||
} else if (e.media.includes("light")) {
|
||||
set_mode(false);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function set_mode (bool) {
|
||||
document.getElementById('dark_theme').media = !bool ? 'none' : '';
|
||||
document.getElementById('light_theme').media = bool ? 'none' : '';
|
||||
|
|
Loading…
Reference in a new issue