hmn
/
hmn
4
Fork 9
Code Issues 59 Pull Requests 1 Releases Activity

Fix TOC width issue

This commit is contained in:
Ben Visness 2022-09-17 16:26:52 -05:00
parent b27ddd1e7f
commit bdb08dd14b
1 changed files with 6 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/templates/src/education_article.html
View File

@ -74,11 +74,13 @@
// TOC // TOC
const FUDGE = 100; const FUDGE = 100;
const TOC_TOP_SPACING = 20; const TOC_TOP_SPACING = 20;
document.addEventListener('scroll', () => { function updateTOC() {
// Stickiness // Stickiness
const sidebarWidth = sidebar.clientWidth;
const stick = window.pageYOffset > sidebar.offsetTop-TOC_TOP_SPACING; const stick = window.pageYOffset > sidebar.offsetTop-TOC_TOP_SPACING;
tocContainer.style.position = stick ? 'fixed' : 'static'; tocContainer.style.position = stick ? 'fixed' : 'static';
tocContainer.style.top = `${TOC_TOP_SPACING}px`; tocContainer.style.top = `${TOC_TOP_SPACING}px`;
tocContainer.style.width = `${sidebarWidth}px`;
// Active items // Active items
let activeEntry = null; let activeEntry = null;
@ -95,7 +97,9 @@
if (activeEntry) { if (activeEntry) {
activeEntry.link.classList.add('active'); activeEntry.link.classList.add('active');
} }
}); }
document.addEventListener('scroll', updateTOC);
window.addEventListener('resize', updateTOC);
// Notes // Notes
function toggleNotes() { function toggleNotes() {