This PR adds a few stylistic improvements to the distill-style blog posts: - Update distill blog post example to showcase sidenotes as an alternative to styles in PR #3077 - Showcase equations in sidenotes (closes #1242) - Add `overrides.js` to match footnotes and citation styles with global theme styling - Add "related posts" sections if enabled to distill style posts - Add "giscus" section if enabled to distill style posts https://github.com/user-attachments/assets/b19a9cd9-779d-4d89-a4fb-eb14fb384480
28 lines
1.4 KiB
JavaScript
28 lines
1.4 KiB
JavaScript
$(window).on("load", function () {
|
|
document.querySelectorAll("d-footnote").forEach(function (footnote) {
|
|
footnote.shadowRoot.querySelector("sup > span").setAttribute("style", "color: var(--global-theme-color);");
|
|
footnote.shadowRoot
|
|
.querySelector("d-hover-box")
|
|
.shadowRoot.querySelector("style")
|
|
.sheet.insertRule(".panel {background-color: var(--global-bg-color) !important;}");
|
|
footnote.shadowRoot
|
|
.querySelector("d-hover-box")
|
|
.shadowRoot.querySelector("style")
|
|
.sheet.insertRule(".panel {border-color: var(--global-divider-color) !important;}");
|
|
});
|
|
// Override styles of the citations.
|
|
document.querySelectorAll("d-cite").forEach(function (cite) {
|
|
cite.shadowRoot.querySelector("div > span").setAttribute("style", "color: var(--global-theme-color);");
|
|
cite.shadowRoot.querySelector("style").sheet.insertRule("ul li a {color: var(--global-text-color) !important; text-decoration: none;}");
|
|
cite.shadowRoot.querySelector("style").sheet.insertRule("ul li a:hover {color: var(--global-theme-color) !important;}");
|
|
cite.shadowRoot
|
|
.querySelector("d-hover-box")
|
|
.shadowRoot.querySelector("style")
|
|
.sheet.insertRule(".panel {background-color: var(--global-bg-color) !important;}");
|
|
cite.shadowRoot
|
|
.querySelector("d-hover-box")
|
|
.shadowRoot.querySelector("style")
|
|
.sheet.insertRule(".panel {border-color: var(--global-divider-color) !important;}");
|
|
});
|
|
});
|