{% extends "/layouts/base.twig" %}

{% block layout %}
<div class="lg:flex lg:items-start lg:min-h-screen">
  {% include "/sections/aside.twig" %}

  <div
    class="sticky top-0 z-30 block mb-4 border-b lg:hidden bg-main border-line-dimmed group-data-[mobile-menu]/html:border-0">
    <div class="w-full max-w-4xl mx-auto">
      {% include "/sections/mobile-nav.twig" %}
    </div>
  </div>

  <div class="container">
    <div
      class="flex flex-col md:pt-10 min-h-screen grow group-data-[mobile-menu]/html:hidden lg:group-data-[mobile-menu]/html:flex w-full mx-auto max-w-4xl">
      <main class="flex flex-col gap-5 grow md:gap-8">
        {% block template %}{% endblock %}
      </main>

      {% block footer %}
      {% include "/sections/footer.twig" %}
      {% endblock %}
    </div>
  </div>
</div>

{% include "/snippets/workspace/switcher.twig" %}
{% endblock %}

{% block scripts %}
{% if view_namespace in ['app', 'admin'] %}
<script src="assets/{{ view_namespace }}.js?v={{ version }}"></script>
{% endif %}
{% endblock %}