80 lines
1.7 KiB
HTML
80 lines
1.7 KiB
HTML
<script>
|
|
function openNavDrawer() {
|
|
navDrawerOverlay.classList.toggle('d-none')
|
|
navDrawer.style.transform = 'translate(0)'
|
|
window.location.hash = '#nav'
|
|
}
|
|
|
|
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)
|
|
closeNavDrawer()
|
|
})()
|
|
|
|
if (window.location.hash == '#nav') {
|
|
history.replaceState("", document.title, window.location.pathname);
|
|
}
|
|
|
|
window.addEventListener('hashchange', function(e) {
|
|
if (window.location.hash == '') {
|
|
closeNavDrawer()
|
|
history.replaceState("", document.title, window.location.pathname);
|
|
}
|
|
})
|
|
</script>
|