gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-08 07:28:59 +01:00
Code Issues Actions 11 Packages Projects Releases Wiki Activity

fix(share): TOC indicator no longer working due to layout changes

Browse Source
This commit is contained in:
Elian Doran 2025-10-30 08:49:48 +02:00
parent 413b16b51c
commit 78f067965f
No known key found for this signature in database
1 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
packages/share-theme/src/scripts/modules/toc.ts
View File

@ -3,14 +3,15 @@
* it even exists for users without client-side js * it even exists for users without client-side js
* and that means it loads with the page so it avoids * and that means it loads with the page so it avoids
* all potential reshuffling or layout recalculations. * all potential reshuffling or layout recalculations.
* *
* So, all this function needs to do is make the links * So, all this function needs to do is make the links
* perform smooth animation, and adjust the "active" * perform smooth animation, and adjust the "active"
* entry as the user scrolls. * entry as the user scrolls.
*/ */
export default function setupToC() { export default function setupToC() {
const container = document.getElementById("right-pane");
const toc = document.getElementById("toc"); const toc = document.getElementById("toc");
if (!toc) return; if (!toc || !container) return;
// Get all relevant elements // Get all relevant elements
const sections = document.getElementById("content")!.querySelectorAll("h2, h3, h4, h5, h6"); const sections = document.getElementById("content")!.querySelectorAll("h2, h3, h4, h5, h6");
@ -23,7 +24,7 @@ export default function setupToC() {
if (!target) return; if (!target) return;
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
target.scrollIntoView({behavior: "smooth"}); target.scrollIntoView({behavior: "smooth"});
}); });
} }
@ -32,15 +33,15 @@ export default function setupToC() {
function changeLinkState() { function changeLinkState() {
let index = sections.length; let index = sections.length;
// Work backkwards to find the first matching section // Work backwards to find the first matching section
while (--index && window.scrollY + 50 < (sections[index] as HTMLElement).offsetTop) {} // eslint-disable-line no-empty while (--index && container!.scrollTop + 50 < (sections[index] as HTMLElement).offsetTop) {} // eslint-disable-line no-empty
// Update the "active" item in ToC // Update the "active" item in ToC
links.forEach((link) => link.classList.remove("active")); links.forEach((link) => link.classList.remove("active"));
links[index].classList.add("active"); links[index].classList.add("active");
} }
// Initial render // Initial render
changeLinkState(); changeLinkState();
window.addEventListener("scroll", changeLinkState); container.addEventListener("scroll", changeLinkState);
} }