{% extends "default/module.html.jinja2" %}
{% block title %}Module List &ndash; pdoc {{ __version__ }}{% endblock %}
{% block style %}
    {{ super() | safe }}
    <style>
        header.pdoc {
            margin-bottom: -4rem;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
        }

        header.pdoc img {
            max-width: 200px;
            max-height: 75px;
            padding-right: 2rem;
        }

        header.pdoc input[type=search] {
            outline-offset: 0;
            font-size: 1.5rem;
            min-width: 60%;
            flex-grow: 1;
            padding-left: .5rem;
            margin: 1.75rem 0;
        }
    </style>
{% endblock %}
{% block nav %}
    <nav class="pdoc">
        <label id="navtoggle" for="togglestate" class="pdoc-button">{% include 'navtoggle.svg' %}</label>
        <input id="togglestate" type="checkbox">
        <div>
            <h2>Available Modules</h2>
            <ul>
                {% for submodule in all_modules %}
                    <li><a href="{{ submodule.replace(".","/") }}.html">{{ submodule }}</a></li>
                {% endfor %}
            </ul>
        </div>
    </nav>
    <header class="pdoc">
        {% block logo %}
            <a href="https://pdoc.dev">
                <img src="data:image/svg+xml,{% filter urlencode %}{% include "pdoc-logo.svg" %}{% endfilter %}"
                     alt="pdoc logo"/>
            </a>
        {% endblock %}
        <input type="search" placeholder="Search API Documentation..." aria-label="search box">
    </header>
{% endblock %}
{% block module_info %}{% endblock %}
{% block module_contents %}{% endblock %}
