mode-watcher
Advanced tools
Comparing version 0.0.1 to 0.0.2
@@ -42,9 +42,11 @@ // Modified version of the light switch by: https://skeleton.dev | ||
export function setModeCurrent(value) { | ||
const htmlElClasses = document.documentElement.classList; | ||
const htmlEl = document.documentElement; | ||
const classDark = 'dark'; | ||
if (value === true) { | ||
htmlElClasses.remove(classDark); | ||
htmlEl.classList.remove(classDark); | ||
htmlEl.style.colorScheme = 'light'; | ||
} | ||
else { | ||
htmlElClasses.add(classDark); | ||
htmlEl.classList.add(classDark); | ||
htmlEl.style.colorScheme = 'dark'; | ||
} | ||
@@ -58,3 +60,3 @@ modeCurrent.set(value); | ||
export function setInitialClassState() { | ||
const htmlElClasses = document.documentElement.classList; | ||
const htmlEl = document.documentElement; | ||
const condLocalStorageUserPrefs = localStorage.getItem('modeUserPrefers') === 'false'; | ||
@@ -64,6 +66,8 @@ const condLocalStorageUserPrefsExist = !('modeUserPrefers' in localStorage); | ||
if (condLocalStorageUserPrefs || (condLocalStorageUserPrefsExist && condMatchMedia)) { | ||
htmlElClasses.add('dark'); | ||
htmlEl.classList.add('dark'); | ||
htmlEl.style.colorScheme = 'dark'; | ||
} | ||
else { | ||
htmlElClasses.remove('dark'); | ||
htmlEl.classList.remove('dark'); | ||
htmlEl.style.colorScheme = 'light'; | ||
} | ||
@@ -78,9 +82,11 @@ } | ||
function setMode(value) { | ||
const htmlElClasses = document.documentElement.classList; | ||
const htmlEl = document.documentElement; | ||
const classDark = 'dark'; | ||
if (value === true) { | ||
htmlElClasses.remove(classDark); | ||
htmlEl.classList.remove(classDark); | ||
htmlEl.style.colorScheme = 'light'; | ||
} | ||
else { | ||
htmlElClasses.add(classDark); | ||
htmlEl.classList.add(classDark); | ||
htmlEl.style.colorScheme = 'dark'; | ||
} | ||
@@ -87,0 +93,0 @@ } |
{ | ||
"name": "mode-watcher", | ||
"version": "0.0.1", | ||
"version": "0.0.2", | ||
"exports": { | ||
@@ -5,0 +5,0 @@ ".": { |
9097
168