function setColorMode(mode) { // Switch between light/dark theme. `mode` is a string value of either 'dark' or 'light'. var hljs_light = document.getElementById('hljs-light'), hljs_dark = document.getElementById('hljs-dark'); document.documentElement.setAttribute('data-bs-theme', mode); if (mode == 'dark') { hljs_light.disabled = true; hljs_dark.disabled = false; } else { hljs_dark.disabled = true; hljs_light.disabled = false; } } function updateModeToggle(mode) { // Update icon and toggle checkmarks of color mode selector. var menu = document.getElementById('theme-menu'); document.querySelectorAll('[data-bs-theme-value]') .forEach(function(toggle) { if (mode == toggle.getAttribute('data-bs-theme-value')) { toggle.setAttribute('aria-pressed', 'true'); toggle.lastElementChild.classList.remove('d-none'); menu.firstElementChild.setAttribute('class', toggle.firstElementChild.getAttribute('class')); } else { toggle.setAttribute('aria-pressed', 'false'); toggle.lastElementChild.classList.add('d-none'); } }); } function onSystemColorSchemeChange(event) { // Update site color mode to match system color mode. setColorMode(event.matches ? 'dark' : 'light'); } var mql = window.matchMedia('(prefers-color-scheme: dark)'), defaultMode = document.documentElement.getAttribute('data-bs-theme'), storedMode = localStorage.getItem('mkdocs-colormode'); if (storedMode && storedMode != 'auto') { setColorMode(storedMode); updateModeToggle(storedMode); } else if (storedMode == 'auto' || defaultMode == 'auto') { setColorMode(mql.matches ? 'dark' : 'light'); updateModeToggle('auto'); mql.addEventListener('change', onSystemColorSchemeChange); } else { setColorMode(defaultMode); updateModeToggle(defaultMode); } document.querySelectorAll('[data-bs-theme-value]') .forEach(function(toggle) { toggle.addEventListener('click', function (e) { var mode = e.currentTarget.getAttribute('data-bs-theme-value'); localStorage.setItem('mkdocs-colormode', mode); if (mode == 'auto') { setColorMode(mql.matches ? 'dark' : 'light'); mql.addEventListener('change', onSystemColorSchemeChange); } else { setColorMode(mode); mql.removeEventListener('change', onSystemColorSchemeChange); } updateModeToggle(mode); }); });