You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
website/_frontend/src/base.js

42 lines
1.4 KiB
JavaScript

document.addEventListener('DOMContentLoaded', function () {
renderMathInElement(document.body, {
delimiters: [
{ left: '$', right: '$', display: false },
{ left: '$$', right: '$$', display: true },
{ left: '\\(', right: '\\)', display: false },
{ left: '\\[', right: '\\]', display: true },
],
})
})
document.addEventListener('DOMContentLoaded', () => {
const $toggle = document.querySelector('#toggle-dark-mode')
const $toggleIcon = document.querySelector('#toggle-dark-mode i')
// Loads preferred dark from from localStorage or defaults to media query.
let prefersDarkMode =
localStorage.getItem('theme') !== undefined
? localStorage.getItem('theme') === 'dark'
: window.matchMedia('(prefers-color-scheme: dark)').matches
function storePrefersDarkMode(mode) {
prefersDarkMode = mode
localStorage.setItem('theme', mode ? 'dark' : 'light')
}
function displayToggle() {
document.body.classList.toggle('dark-mode', prefersDarkMode)
$toggleIcon.classList.toggle('fa-moon', prefersDarkMode)
$toggleIcon.classList.toggle('fa-sun', !prefersDarkMode)
document.dispatchEvent(new CustomEvent('theme:change'))
}
$toggle.addEventListener('click', () => {
storePrefersDarkMode(!prefersDarkMode)
displayToggle()
})
displayToggle()
})