Fix fluff up

This commit is contained in:
Sonny Bakker 2021-01-23 13:56:12 +01:00
parent 3df43d4c66
commit c20033e8ea

View file

@ -3,16 +3,16 @@ function isCSSVariablesSupported() {
} }
function changeTheme(e) { function changeTheme(e) {
const isDark = sessionStorage.getItem('t-dark') ? true : false; const currentPref = sessionStorage.getItem('t-dark');
const isDark = currentPref && currentPref === 'true' ? true : false;
if (isDark) { if (isDark) {
document.documentElement.classList.add('js-t-dark');
} else {
document.documentElement.classList.remove('js-t-dark'); document.documentElement.classList.remove('js-t-dark');
} else {
document.documentElement.classList.add('js-t-dark');
} }
try { try {
console.log(`Setting storage to ${!isDark}`);
sessionStorage.setItem('t-dark', !isDark); sessionStorage.setItem('t-dark', !isDark);
} catch (e) { } catch (e) {
// do nothing. // do nothing.
@ -23,17 +23,14 @@ function prefersDarkTheme() {
try { try {
const currentPref = sessionStorage.getItem('t-dark'); const currentPref = sessionStorage.getItem('t-dark');
if (currentPref === 'true') { if (currentPref && currentPref === 'true') {
console.log('Current pref set');
return true; return true;
} else if ( } else if (
!currentPref && !currentPref &&
window.matchMedia('(prefers-color-scheme: dark)').matches window.matchMedia('(prefers-color-scheme: dark)').matches
) { ) {
console.log('Media query matches');
return true; return true;
} else { } else {
console.log('Does not prefersDarkTheme');
return false; return false;
} }
} catch (e) { } catch (e) {
@ -41,15 +38,15 @@ function prefersDarkTheme() {
} }
} }
function toggleDarkTheme(dark) { function toggleDarkTheme(isDark) {
if (dark) { if (isDark) {
document.documentElement.classList.add('js-t-dark'); document.documentElement.classList.add('js-t-dark');
} else { } else {
document.documentElement.classList.remove('js-t-dark'); document.documentElement.classList.remove('js-t-dark');
} }
try { try {
sessionStorage.setItem('t-dark', dark); sessionStorage.setItem('t-dark', isDark);
} catch (e) { } catch (e) {
// do nothing. // do nothing.
} }
@ -60,7 +57,6 @@ function initThemeSelector() {
const mqPrefersDarkTheme = window.matchMedia('(prefers-color-scheme: dark)'); const mqPrefersDarkTheme = window.matchMedia('(prefers-color-scheme: dark)');
if (prefersDarkTheme()) { if (prefersDarkTheme()) {
console.log('Prefers dark theme');
toggleDarkTheme(true); toggleDarkTheme(true);
} }