generated from nhcarrigan/template
43 lines
1.5 KiB
Plaintext
43 lines
1.5 KiB
Plaintext
---
|
|
import { Icon } from "@astrojs/starlight/components";
|
|
---
|
|
|
|
{/* This is intentionally inlined to avoid FOUC. */}
|
|
<script is:inline>
|
|
const analytics = document.getElementById('analytics');
|
|
const title = document.querySelector('title');
|
|
analytics.setAttribute('event-page', title.innerText ?? "NHCarrigan Docs");
|
|
analytics.setAttribute('event-path', window.location.pathname);
|
|
window.StarlightThemeProvider = (() => {
|
|
const storedTheme =
|
|
typeof localStorage !== 'undefined' && localStorage.getItem('starlight-theme');
|
|
const theme =
|
|
storedTheme ||
|
|
(window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark');
|
|
document.documentElement.dataset.theme = theme === 'light' ? 'light' : 'dark';
|
|
console.log(document.documentElement)
|
|
return {
|
|
updatePickers(theme = storedTheme || 'auto') {
|
|
document.querySelectorAll('starlight-theme-select').forEach((picker) => {
|
|
const select = picker.querySelector('select');
|
|
if (select) select.value = theme;
|
|
/** @type {HTMLTemplateElement | null} */
|
|
const tmpl = document.querySelector(`#theme-icons`);
|
|
const newIcon = tmpl && tmpl.content.querySelector('.' + theme);
|
|
if (newIcon) {
|
|
const oldIcon = picker.querySelector('svg.label-icon');
|
|
if (oldIcon) {
|
|
oldIcon.replaceChildren(...newIcon.cloneNode(true).childNodes);
|
|
}
|
|
}
|
|
});
|
|
},
|
|
};
|
|
})();
|
|
</script>
|
|
|
|
<template id="theme-icons">
|
|
<Icon name="sun" class="light" />
|
|
<Icon name="moon" class="dark" />
|
|
<Icon name="laptop" class="auto" />
|
|
</template> |