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

changed table of contents buttons from li to a

Browse Source
This commit is contained in:
denizk0461
2025-12-04 22:22:50 +00:00
parent 82e827a82c
commit 95d0996c42
1 changed files with 15 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/lib/table-of-contents.svelte
View File

@@ -15,9 +15,13 @@
let headers = getHeaders(); let headers = getHeaders();
headers.forEach(header => { headers.forEach(header => {
let headerId = getHeaderId(header); let headerId = getHeaderId(header);
var element = document.createElement("li"); var element = document.createElement("a");
element.classList += "toc-level-" + getHeaderLevel(header); element.classList += "toc-level-" + getHeaderLevel(header);
element.innerHTML = `<a href="#${headerId}">${(header as HTMLElement).innerHTML}</a>`; element.href = `#${headerId}`;
element.innerHTML = `${(header as HTMLElement).innerHTML}`;
// var element = document.createElement("span");
// element.classList += "toc-level-" + getHeaderLevel(header);
// element.innerHTML = `<a href="#${headerId}">${(header as HTMLElement).innerHTML}</a>`;
container.appendChild(element); container.appendChild(element);
}); });
}); });
@@ -86,10 +90,10 @@
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
.toc-list li { /* .toc-list li {
list-style: none; list-style: none;
} } */
.toc-list li a { .toc-list a {
width: 100%; width: 100%;
padding-top: 3px; padding-top: 3px;
padding-bottom: 3px; padding-bottom: 3px;
@@ -102,25 +106,25 @@
box-sizing: border-box; box-sizing: border-box;
} }
.toc-list li a:hover { .toc-list a:hover {
color: var(--color-text-dark); color: var(--color-text-dark);
background-color: var(--color-highlight); background-color: var(--color-highlight);
} }
.toc-level-0 a { .toc-level-0 {
font-weight: 800; font-weight: 800;
padding-left: 44px; padding-left: 44px;
} }
.toc-level-1 a { .toc-level-1 {
padding-left: 68px; padding-left: 68px;
} }
.toc-level-2 a { .toc-level-2 {
padding-left: 92px; padding-left: 92px;
} }
.toc-level-3 a { .toc-level-3 {
padding-left: 116px; padding-left: 116px;
} }
.toc-level-1 a::before, .toc-level-2 a::before, .toc-level-3 a::before { .toc-level-1::before, .toc-level-2::before, .toc-level-3::before {
content: "↳ "; content: "↳ ";
} }
} }