<div class="nav-item dropdown">
    <a class="nav-link dropdown-toggle" type="button" data-toggle="dropdown">🧭 Navigation</a>
    <div class="dropdown-menu">
        <div id="navigator-content" style="height: auto; max-height: 50vh; overflow-y: scroll;"></div>
        <script>
            $(() => $("{{ include.headers }}").each((i, h) => {
                let offset = `${0.5 + Number(h.nodeName.substring(1)) - 1}rem`;
                $("#navigator-content").append(`
                    <a class="nav-item nav-link dropdown-item-text" href="#${h.id}" style="padding-left: ${offset}; white-space: nowrap;">
                        ${h.innerText.trim()}
                    </a>`);
            }));
        </script>
    </div>
</div>