diff --git a/eleventy.config.js b/eleventy.config.js index c362b91..06999b3 100644 --- a/eleventy.config.js +++ b/eleventy.config.js @@ -590,7 +590,10 @@ export default function (eleventyConfig) { // 5. Inject positioning script before // Sets each sidenote's top relative to .e-content, with overlap prevention. - const posScript = `(function(){function p(){if(window.innerWidth<1440)return;var a=document.querySelector('article.has-sidenotes');if(!a)return;var e=a.querySelector('.e-content');if(!e)return;var cr=e.getBoundingClientRect();var lb=0;a.querySelectorAll('.sidenote').forEach(function(s){var h=s.parentElement;var hr=h.getBoundingClientRect();var t=Math.max(hr.top-cr.top,lb);s.style.top=t+'px';lb=t+s.offsetHeight+8;});}document.addEventListener('DOMContentLoaded',p);window.addEventListener('load',p);window.addEventListener('resize',p);})();`; + // offsetTop is measured from .e-content's padding edge because .e-content + // is position:relative — its offsetParent. Script is injected at end of + // so DOM is ready; call p() immediately (rAF for paint stability). + const posScript = `(function(){function p(){if(window.innerWidth<1440)return;var a=document.querySelector('article.has-sidenotes');if(!a)return;var e=a.querySelector('.e-content');if(!e)return;var lb=0;a.querySelectorAll('.sidenote').forEach(function(s){var h=s.parentElement;var t=Math.max(h.offsetTop,lb);s.style.top=t+'px';lb=t+s.offsetHeight+8;});}requestAnimationFrame(p);window.addEventListener('load',p);window.addEventListener('resize',p);})();`; tree.walk(node => { if (node.tag === "body") { node.content = node.content || [];