keycloak-scim/aggregation/navbar.html

<ul id="globalnav">
    <li><a href="../getting_started/{masterFile}.html">Getting Started</a></li>
    <li><a href="../server_installation/{masterFile}.html">Server Installation</a></li>
    <li><a href="../securing_apps/{masterFile}.html">Securing Apps</a></li>
    <li><a href="../server_admin/{masterFile}.html">Server Admin</a></li>
    <li><a href="../server_development/{masterFile}.html">Server Development</a></li>
    <li><a href="../authorization_services/{masterFile}.html">Authorization Services</a></li>
    <li><a href="../upgrading/{masterFile}.html">Upgrading</a></li>
    <li><a href="../release_notes/{masterFile}.html">Release Notes</a></li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/tocbot/4.4.2/tocbot.js"></script>

<script>
    var oldtoc = document.getElementById('toctitle').nextElementSibling;
    var newtoc = document.createElement('div');
    newtoc.setAttribute('id', 'tocbot');
    newtoc.setAttribute('class', 'js-toc');
    oldtoc.parentNode.replaceChild(newtoc, oldtoc);
    tocbot.init({ contentSelector: '#content',
        headingSelector: 'h2, h3, h4',
        smoothScroll: false
    });
    var handleTocOnResize = function() {
        var width = window.innerWidth
                    || document.documentElement.clientWidth
                    || document.body.clientWidth;
        if (width < 768) {
            tocbot.refresh({
                contentSelector: '#content',
                headingSelector: 'h2, h3, h4',
                collapseDepth: 6,
                activeLinkClass: 'ignoreactive',
                throttleTimeout: 1000,
                smoothScroll: false
            });
        }
        else {
            tocbot.refresh({
                contentSelector: '#content',
                headingSelector: 'h2, h3, h4',
                smoothScroll: false
            });
        }
    };
    window.addEventListener('resize', handleTocOnResize);
    handleTocOnResize();
</script>