{% extends "base.html" %}

{% block body -%}
{{ super() }}
{% include "partials/icons.html" %}

<input type="checkbox" class="sidebar-toggle" name="__navigation" id="__navigation">
<input type="checkbox" class="sidebar-toggle" name="__toc" id="__toc">
<label class="overlay sidebar-overlay" for="__navigation">
  <div class="visually-hidden">Hide navigation sidebar</div>
</label>
<label class="overlay toc-overlay" for="__toc">
  <div class="visually-hidden">Hide table of contents sidebar</div>
</label>

{% if theme_announcement -%}
<div class="announcement">
  <aside class="announcement-content">
    {% block announcement %} {{ theme_announcement }} {% endblock announcement %}
  </aside>
</div>
{%- endif %}

<div class="page">
  <header class="mobile-header">
    <div class="header-left">
      <label class="nav-overlay-icon" for="__navigation">
        <div class="visually-hidden">Toggle site navigation sidebar</div>
        <i class="icon"><svg><use href="#svg-menu"></use></svg></i>
      </label>
    </div>
    <div class="header-center">
      <a href="{{ pathto(master_doc) }}"><div class="brand">{{ docstitle if docstitle else project }}</div></a>
    </div>
    <div class="header-right">
      <div class="theme-toggle-container theme-toggle-header">
        <button class="theme-toggle">
          <div class="visually-hidden">Toggle Light / Dark / Auto colour theme</div>
          <svg class="theme-icon-when-auto"><use href="#svg-sun-half"></use></svg>
          <svg class="theme-icon-when-dark"><use href="#svg-moon"></use></svg>
          <svg class="theme-icon-when-light"><use href="#svg-sun"></use></svg>
        </button>
      </div>
      <label class="toc-overlay-icon toc-header-icon{% if furo_hide_toc %} no-toc{% endif %}" for="__toc">
        <div class="visually-hidden">Toggle table of contents sidebar</div>
        <i class="icon"><svg><use href="#svg-toc"></use></svg></i>
      </label>
    </div>
  </header>
  <aside class="sidebar-drawer">
    <div class="sidebar-container">
      {% block left_sidebar %}
      <div class="sidebar-sticky">
        {%- for sidebar_section in sidebars %}
          {%- include sidebar_section %}
        {%- endfor %}
      </div>
      {% endblock left_sidebar %}
    </div>
  </aside>
  <div class="main">
    <div class="content">
      <div class="article-container">
        <a href="#" class="back-to-top muted-link">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
            <path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8v12z"></path>
          </svg>
          <span>{% trans %}Back to top{% endtrans %}</span>
        </a>
        <div class="content-icon-container">
          {% if theme_top_of_page_button == "edit" -%}
          {%- include "components/edit-this-page.html" with context -%}
          {%- elif theme_top_of_page_button != None -%}
          {{ warning("Got an unsupported value for 'top_of_page_button'") }}
          {%- endif -%}
          {#- Theme toggle -#}
          <div class="theme-toggle-container theme-toggle-content">
            <button class="theme-toggle">
              <div class="visually-hidden">Toggle Light / Dark / Auto colour theme</div>
              <svg class="theme-icon-when-auto"><use href="#svg-sun-half"></use></svg>
              <svg class="theme-icon-when-dark"><use href="#svg-moon"></use></svg>
              <svg class="theme-icon-when-light"><use href="#svg-sun"></use></svg>
            </button>
          </div>
          <label class="toc-overlay-icon toc-content-icon{% if furo_hide_toc %} no-toc{% endif %}" for="__toc">
            <div class="visually-hidden">Toggle table of contents sidebar</div>
            <i class="icon"><svg><use href="#svg-toc"></use></svg></i>
          </label>
        </div>
        <article role="main">
          {% block content %}{{ body }}{% endblock %}
        </article>
      </div>
      <footer>
        {% block footer %}
        <div class="related-pages">
          {% if next -%}
            <a class="next-page" href="{{ next.link }}">
              <div class="page-info">
                <div class="context">
                  <span>{{ _("Next") }}</span>
                </div>
                <div class="title">{{ next.title }}</div>
              </div>
              <svg class="furo-related-icon"><use href="#svg-arrow-right"></use></svg>
            </a>
          {%- endif %}
          {% if prev -%}
            <a class="prev-page" href="{{ prev.link }}">
              <svg class="furo-related-icon"><use href="#svg-arrow-right"></use></svg>
              <div class="page-info">
                <div class="context">
                  <span>{{ _("Previous") }}</span>
                </div>
                {% if prev.link == pathto(master_doc) %}
                <div class="title">{{ _("Home") }}</div>
                {% else %}
                <div class="title">{{ prev.title }}</div>
                {% endif %}
              </div>
            </a>
          {%- endif %}
        </div>
        <div class="bottom-of-page">
          <div class="left-details">
            <div class="copyright">
              {# MAREK #}
              {% from "basic-ng/components/edit-this-page.html" import determine_page_edit_link with context %}
              Copyright &#169; {{ copyright }} by <a href="https://www.gagolewski.com">Marek Gagolewski</a>.
              Some rights reserved. Licensed under <a href='https://creativecommons.org/licenses/by-nc-nd/4.0/'>CC BY-NC-ND 4.0</a>.
              Built with <a href="https://sphinx-doc.org/">Sphinx</a>
              and a customised <a href="https://github.com/pradyunsg/furo">Furo</a> theme.
              Last updated on {{ last_updated }}.
              This site will never display any ads: it is a non-profit project.
              It does not collect any data.
            </div>
          </div>
        </div>
        {% endblock footer %}
      </footer>
    </div>
    <aside class="toc-drawer{% if furo_hide_toc %} no-toc{% endif %}">
      {% block right_sidebar %}
      {% if not furo_hide_toc %}
      <div class="toc-sticky toc-scroll">
        <div class="toc-title-container">
          <span class="toc-title">
            {{ _("In this section") }}
          </span>
        </div>
        <div class="toc-tree-container">
          <div class="toc-tree">
            {{ toc }}
          </div>
        </div>
      </div>
      {% endif %}
      {% endblock right_sidebar %}
    </aside>
  </div>
</div>
{%- endblock %}
