denizk0461/pages
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improved styling of side-bound TableOfContents component

Browse Source
This commit is contained in:
denizk0461
2026-04-26 22:39:07 +02:00
parent a1effdec8e
commit 72347769c3
1 changed files with 14 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/lib/components/table-of-contents.svelte
View File

@@ -81,31 +81,38 @@
<style>
:global {
body {
--padding-indent-base: 44px;
--padding-level-indent: 24px;
}
.toc-container, .toc-container-side {
box-sizing: border-box;
padding: 16px 0;
border: var(--border-style) var(--border-dash-size) var(--color-highlight);
border-radius: var(--border-radius);
}
.toc-container {
--padding-indent-base: 44px;
--padding-level-indent: 24px;
max-width: var(--width-toc);
margin-left: auto;
margin-right: auto;
margin-top: 12px;
border: var(--border-style) var(--border-dash-size) var(--color-highlight);
background-color: var(--color-background-highlight);
}
.toc-container-side {
--padding-indent-base: 24px;
--padding-level-indent: 24px;
width: 400px;
margin: 0 12px 0 12px;
margin: 32px 12px 0 12px;
position: sticky;
top: 64px;
border-left: var(--border-style) var(--border-dash-size) var(--color-highlight);
}
.toc-container-side .toc-list a {
border-top-right-radius: var(--border-radius);
border-bottom-right-radius: var(--border-radius);
}
.toc-list {