<!-- Template for Subitems --> {% macro render_subitems(subitems) %} {% for subitem in subitems %} {% if subitem.subitems %} <li class="dropdown-submenu position-relative"> <a class="dropdown-item dropdown-toggle" href="#" title="{{ subitem.description }}"> {% if subitem.icon is defined and subitem.icon.class is defined %} <i class="{{ subitem.icon.class }}"></i> {{ subitem.name }} {% else %} <p>Missing icon in subitem: {{ subitem }}</p> {% endif %} </a> <ul class="dropdown-menu"> {{ render_subitems(subitem.subitems) }} </ul> </li> {% elif subitem.identifier or subitem.warning or subitem.info %} <li> <a class="dropdown-item" onclick='openDynamicPopup({{ subitem|tojson|safe }})' data-bs-toggle="tooltip" title="{{ subitem.description }}"> <i class="{{ subitem.icon.class }}"></i> {{ subitem.name }} </a> </li> {% else %} <li> <a class="dropdown-item" href="{{ subitem.url }}" target="{{ subitem.target|default('_blank') }}" data-bs-toggle="tooltip" title="{{ subitem.description }}"> {% if subitem.icon is defined and subitem.icon.class is defined %} <i class="{{ subitem.icon.class }}"></i> {{ subitem.name }} {% else %} <p>Missing icon in subitem: {{ subitem }}</p> {% endif %} </a> </li> {% endif %} {% endfor %} {% endmacro %} <!-- Navigation Bar --> <nav class="navbar navbar-expand-lg navbar-light bg-light"> <div class="container-fluid"> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav{{menu_type}}" aria-controls="navbarNav{{menu_type}}" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav{{menu_type}}"> <ul class="navbar-nav {% if menu_type == 'header' %}ms-auto{% endif %}"> {% for item in navigation[menu_type] %} {% if item.url %} <!-- Single Item --> <li class="nav-item"> <a class="nav-link" href="{{ item.url }}" target="{{ item.target|default('_blank') }}" data-bs-toggle="tooltip" title="{{ item.description }}"> <i class="{{ item.icon.class }}"></i> {{ item.name }} </a> </li> {% else %} <!-- Dropdown Menu --> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown{{ loop.index }}" role="button" data-bs-toggle="dropdown" data-bs-display="dynamic" aria-expanded="false"> {% if item.icon is defined and item.icon.class is defined %} <i class="{{ item.icon.class }}"></i> {{ item.name }} {% else %} <p>Missing icon in item: {{ item }}</p> {% endif %} </a> <ul class="dropdown-menu"> {{ render_subitems(item.subitems) }} </ul> </li> {% endif %} {% endfor %} </ul> </div> </div> </nav>