This commit is contained in:
parent
5cde595f96
commit
fb6c9780f6
2 changed files with 27 additions and 13 deletions
|
@ -1,11 +1,12 @@
|
||||||
window.addEventListener("load", () => {
|
window.addEventListener("load", () => {
|
||||||
|
/* Configuration */
|
||||||
hljs.configure({
|
hljs.configure({
|
||||||
noHighlightRe: /^$/i,
|
noHighlightRe: /^$/i,
|
||||||
languageDetectRe: /\blanguage-hljs-([\w-]+)\b/i,
|
languageDetectRe: /\blanguage-hljs-([\w-]+)\b/i,
|
||||||
});
|
});
|
||||||
|
|
||||||
hljs.addPlugin(new CopyButtonPlugin());
|
hljs.addPlugin(new CopyButtonPlugin());
|
||||||
|
|
||||||
|
/* Aliases of langs */
|
||||||
const aliases = {
|
const aliases = {
|
||||||
bash: ["fish"],
|
bash: ["fish"],
|
||||||
};
|
};
|
||||||
|
@ -13,17 +14,32 @@ window.addEventListener("load", () => {
|
||||||
hljs.registerAliases(aliases[lang], { languageName: lang });
|
hljs.registerAliases(aliases[lang], { languageName: lang });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Highlight */
|
||||||
hljs.highlightAll();
|
hljs.highlightAll();
|
||||||
|
|
||||||
hljs.initLineNumbersOnLoad();
|
hljs.initLineNumbersOnLoad();
|
||||||
|
|
||||||
document
|
/* Theme */
|
||||||
.getElementById(
|
const dark = "dark";
|
||||||
`hljs-${
|
const light = "light";
|
||||||
window.matchMedia("(prefers-color-scheme: dark)").matches
|
const attribute = ["disabled", "disabled"];
|
||||||
? "dark"
|
const updateTheme = (theme) => {
|
||||||
: "light"
|
{
|
||||||
}-theme`
|
const elementToEnable = document.getElementById(
|
||||||
)
|
`hljs-${theme.matches ? dark : light}-theme`
|
||||||
.removeAttribute("disabled");
|
);
|
||||||
|
const elementToDisable = document.getElementById(
|
||||||
|
`hljs-${theme.matches ? light : dark}-theme`
|
||||||
|
);
|
||||||
|
|
||||||
|
if (elementToEnable.hasAttribute(attribute[0])) {
|
||||||
|
elementToEnable.removeAttribute(attribute[0]);
|
||||||
|
}
|
||||||
|
elementToDisable.setAttribute(...attribute);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const darkModePreference = window.matchMedia("(prefers-color-scheme: dark)");
|
||||||
|
updateTheme(darkModePreference);
|
||||||
|
|
||||||
|
darkModePreference.addEventListener("change", (theme) => updateTheme(theme));
|
||||||
});
|
});
|
||||||
|
|
|
@ -2,13 +2,11 @@
|
||||||
id="hljs-light-theme"
|
id="hljs-light-theme"
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/base16/solarized-light.min.css"
|
href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/base16/solarized-light.min.css"
|
||||||
disabled="disabled"
|
|
||||||
/>
|
/>
|
||||||
<link
|
<link
|
||||||
id="hljs-dark-theme"
|
id="hljs-dark-theme"
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/base16/dracula.min.css"
|
href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/base16/dracula.min.css"
|
||||||
disabled="disabled"
|
|
||||||
/>
|
/>
|
||||||
<link
|
<link
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
|
|
Loading…
Reference in a new issue