static/css/dark-mode.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

const toggleTheme = function() {
	document.documentElement.style.setProperty(this.id, Number(this.checked));
	localStorage.setItem(this.id, Number(this.checked));
};

const initInput = function(styleVariable=null) {
	let initValue = localStorage.getItem(styleVariable);
	if (initValue) {
		initValue = Number(initValue);
		document.documentElement.style.setProperty(styleVariable, initValue);
	} else {
		initValue = getComputedStyle(document.body).getPropertyValue(styleVariable);
		initValue = Number(initValue);
	};

	const inputObject = document.getElementById(styleVariable);
	if (inputObject) {
		if (inputObject.type == 'checkbox') {
			inputObject.addEventListener('change', toggleTheme);
			inputObject.checked = initValue
		};
	};
};

initInput('--dark-theme-check');