{% extends "base.html" %}

{% block layout_class %}has-sidebar{% endblock %}

{% block sidebar_toggle %}<button class="sidebar-toggle" aria-label="Sidebar"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg></button>{% endblock %}

{% block body %}
<aside class="sidebar">
  <nav class="sidebar-nav">
    {% for section in nav %}
    <div class="nav-section">
      <a href="{{ section.url }}" class="nav-section-title {% if section.active %}active{% endif %}">{{ section.title }}</a>
      {% if section.children %}
      <ul class="nav-list">
        {% for item in section.children %}
        <li><a href="{{ item.url }}" class="{% if item.active %}active{% endif %}">{{ item.title }}</a></li>
        {% endfor %}
      </ul>
      {% endif %}
    </div>
    {% endfor %}
  </nav>
</aside>
<main class="content">
  <article>
    <h1>{{ page.title }}</h1>
    {{ content | safe }}
  </article>
</main>
{% endblock %}
