35 lines
1 KiB
JavaScript
35 lines
1 KiB
JavaScript
|
(() => {
|
||
|
const targetElement = document.documentElement;
|
||
|
const defaultTheme = targetElement.getAttribute('data-color-mode');
|
||
|
changeGiscusTheme(defaultTheme);
|
||
|
const observer = new MutationObserver((mutationsList, observer) => {
|
||
|
for (const mutation of mutationsList) {
|
||
|
if (mutation.type === 'attributes') {
|
||
|
const value = targetElement.getAttribute('data-color-mode');
|
||
|
changeGiscusTheme(value);
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
|
||
|
observer.observe(targetElement, {
|
||
|
attributes: true,
|
||
|
attributeOldValue: true,
|
||
|
});
|
||
|
|
||
|
function changeGiscusTheme(theme = 'light') {
|
||
|
const iframe = document.querySelector('.giscus-frame');
|
||
|
if (iframe) {
|
||
|
const config = {
|
||
|
giscus: {
|
||
|
setConfig: {
|
||
|
theme: theme.toLocaleLowerCase(),
|
||
|
},
|
||
|
},
|
||
|
};
|
||
|
iframe.contentWindow.postMessage(config, 'https://giscus.app');
|
||
|
const script = document.querySelector('script[data-script-id="giscus"]');
|
||
|
script.setAttribute('data-theme', theme);
|
||
|
}
|
||
|
}
|
||
|
})();
|