71 lines
1.5 KiB
Plaintext
Raw Normal View History

<aside class="left-sidebar">
<details class="toc__wrapper" open>
<summary class="toc__heading">
Contents
</summary>
{{ content | toc | safe }}
</details>
</aside>
<style>
.toc__wrapper {
position: sticky;
top: 4rem;
}
.toc__heading {
font-size: 1.3rem;
font-weight: 700;
color: var(--clr-sub-heading);
cursor: pointer;
}
.toc ol,
.toc ol ol {
display: grid;
gap: 0.3em;
}
.toc ol {
border-top: 0.1em solid var(--clr-title-border);
padding-left: 1.5em;
padding-top: 1em;
}
.toc ol ol {
border-top: none;
list-style-type: disc;
padding-left: 1.5em;
padding-top: 0.3em;
}
.toc ol a {
font-size: 1.1rem;
padding-left: 0.3em;
}
.toc ol ol a {
padding: 0;
font-size: 1rem;
}
</style>
<script defer>
// Close article ToC accordion for small screen sizes
const tocWrapper = docucument.querySelector('.toc__wrapper');
if (window.innerWidth < 480) {
tocWrapper.removeAttribute("open");
} else {
tocWrapper.setAttribute("open", true);
}
// Remove the stickiness of the sidebar ToC if it is larger than screen height
function preventSidebarOverflow() {
2024-04-16 00:47:32 +08:00
if (document.documentElement.clientHeight < tocWrapper.offsetHeight + 50) {
tocWrapper.style.marginTop = "0";
tocWrapper.style.position = "static";
}
}
preventSidebarOverflow();
</script>