{% macro sidbar_item(title, link) %}
<li class="nav-item">
    <a href="#" class="nav-link align-middle px-0">
        <span class="ms-1 d-none d-sm-inline"><a href="{{link}}" title="{{title}}">{{title}}</a></span>
    </a>
</li>
{% endmacro %}

<div id="sidebar" class="col-auto col-md-3 col-xl-2 px-sm-2 px-0">
    <div class="position-fixed d-flex flex-column align-items-center align-items-sm-start px-3 pt-2 text-white min-vh-100">
        <div class="d-flex align-items-center pb-3 mb-md-0 me-md-auto text-decoration-none">
            <span class="fs-5 d-none d-sm-inline">Scanscope</span>
        </div>
        <ul class="nav nav-pills flex-column mb-sm-auto mb-0 align-items-center align-items-sm-start" id="menu">
            {% for item in sidebar %}
                {{sidbar_item(item.title, item.link)}}
            {% endfor %}
        </ul>
    </div>
</div>
