{% load static %}
{% comment %}
  Sidebar collapsible v2.

  Questo partial va incluso tramite {% include %}, che NON partecipa
  all'ereditarietà dei blocchi Django. I link di navigazione devono
  essere inseriti dentro {% block sidebar_items %} che si trova qui.
  Poiché il partial è sempre incluso (non esteso), il modo corretto
  di personalizzare i link è sovrascrivere l'intero {% block sidebar %}
  nel template figlio, replicando la struttura HTML della <nav>:

    {% block sidebar %}
    {% load static %}
    <nav class="ag-sidebar ag-sidebar--dark" id="agSidebar" aria-label="Menu laterale">
      <button class="ag-sidebar__toggle" id="agSidebarToggle"
              aria-label="Comprimi menu laterale" aria-expanded="true" aria-controls="agSidebar">
        ...
      </button>
      <ul class="ag-sidebar__nav">
        <li><a href="/" class="ag-sidebar__nav-link active">...</a></li>
      </ul>
    </nav>
    <script src="{% static 'agesci_theme/js/sidebar.js' %}" defer></script>
    {% endblock %}

  variant: "dark" (default) | "light"
{% endcomment %}
<nav class="ag-sidebar ag-sidebar--{{ variant|default:'dark' }}"
     id="agSidebar"
     aria-label="Menu laterale">
  <button class="ag-sidebar__toggle"
          id="agSidebarToggle"
          aria-label="Comprimi menu laterale"
          aria-expanded="true"
          aria-controls="agSidebar">
    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 16 16" aria-hidden="true">
      <path d="M0 3a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm5-1v12h9a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1zM4 2H2a1 1 0 0 0-1 1v10a1 1 0 0 0 1 1h2z"/>
    </svg>
    <span class="ag-sidebar__toggle-label ms-2">Menu</span>
  </button>

  <ul class="ag-sidebar__nav">
    {% block sidebar_items %}{% endblock %}
  </ul>
</nav>

<script src="{% static 'agesci_theme/js/sidebar.js' %}" defer></script>