Leilukin
/
leilukin-site
mirror of https://github.com/helenclx/leilukin-site.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Move table of contents styling to the template

This commit is contained in:
Helen Chong 2024-04-16 00:28:11 +08:00
parent a045b39428
commit c8c0c1de68
2 changed files with 44 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/_includes/toc.njk
View File

@ -6,6 +6,50 @@
{{ content | toc | safe }} {{ content | toc | safe }}
</details> </details>
</aside> </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> <script defer>
// Close article ToC accordion for small screen sizes // Close article ToC accordion for small screen sizes
const tocWrapper = docucument.querySelector('.toc__wrapper'); const tocWrapper = docucument.querySelector('.toc__wrapper');

42
src/assets/css/main.css
View File

@ -465,48 +465,6 @@ main {
gap: 0.5rem; gap: 0.5rem;
} }
/* Table of Contents */
.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;
}
/* UTILITY CLASSES */ /* UTILITY CLASSES */
.bold-text { .bold-text {
font-weight: 700; font-weight: 700;