67 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			67 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<script>
 | 
						|
	function openNavDrawer() {
 | 
						|
		navDrawerOverlay.classList.toggle('d-none')
 | 
						|
		navDrawer.style.transform = 'translate(0)'
 | 
						|
	}
 | 
						|
 | 
						|
	function closeNavDrawer() {
 | 
						|
		navDrawerOverlay.classList.toggle('d-none')
 | 
						|
		navDrawer.style.transform = 'translate(100%)'
 | 
						|
	}
 | 
						|
 | 
						|
	function currentTheme() {
 | 
						|
		var _isDark = JSON.parse(localStorage.getItem('themeIsDark'))
 | 
						|
		return _isDark
 | 
						|
	}
 | 
						|
 | 
						|
	function storeTheme(_isDark) {
 | 
						|
		localStorage.setItem('themeIsDark', _isDark)
 | 
						|
	}
 | 
						|
 | 
						|
	function setThemeTo(_isDark) {
 | 
						|
		var elems = [
 | 
						|
			...document.body.getElementsByTagName("*"),
 | 
						|
			document.body,
 | 
						|
		]
 | 
						|
 | 
						|
		elems.forEach(el => {
 | 
						|
			if (_isDark) {
 | 
						|
				el.classList.remove('light')
 | 
						|
				el.classList.add('dark')
 | 
						|
			} else {
 | 
						|
				el.classList.remove('dark')
 | 
						|
				el.classList.add('light')
 | 
						|
			}
 | 
						|
		})
 | 
						|
 | 
						|
		initToggle(_isDark)
 | 
						|
		storeTheme(_isDark)
 | 
						|
	}
 | 
						|
 | 
						|
	function toggleTheme() {
 | 
						|
		var th = currentTheme()
 | 
						|
		if (th === null) {
 | 
						|
			th = window.matchMedia("(prefers-color-scheme: dark)").matches
 | 
						|
		}
 | 
						|
		setThemeTo(!th)
 | 
						|
	}
 | 
						|
 | 
						|
	function initToggle(_isDark) {
 | 
						|
		if (_isDark) {
 | 
						|
			thToggle.innerHTML = '<i class="material-icons">wb_sunny</i>'
 | 
						|
		} else {
 | 
						|
			thToggle.innerHTML = '<i class="material-icons">brightness_2</i>'
 | 
						|
		}
 | 
						|
	}
 | 
						|
 | 
						|
	(function() {
 | 
						|
		var th = currentTheme()
 | 
						|
		if (th === null) {
 | 
						|
			initToggle(window.matchMedia("(prefers-color-scheme: dark)").matches)
 | 
						|
			return
 | 
						|
		}
 | 
						|
		setThemeTo(th)
 | 
						|
		initToggle(th)
 | 
						|
	})()
 | 
						|
</script>
 |