{% extends "layout.html" %}

{% set title = _('Search') %}

{%- block scripts %}
  <meta name="robots" content="noindex" />
  {{- script() }}
  <script defer src="{{ pathto('_static/searchtools.js', 1) }}"></script>
  <script defer src="{{ pathto('_static/language_data.js', 1) }}"></script>
  <script defer src="{{ pathto('searchindex.js', 1) }}"></script>
  <script data-cfasync="false">
    const mode = localStorage.getItem("breeze-mode") || "auto";
    document.documentElement.dataset.mode = mode;
    if (mode === "auto") {
      const prefers = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"
      document.documentElement.dataset.theme = prefers;
    } else {
      document.documentElement.dataset.theme = mode;
    }
  </script>
{%- endblock %}

{% block main %}
  <h1 id="search-documentation">{{ _('Search') }}</h1>
  <noscript>
    <div class="admonition warning">
      <p>{% trans %}Please activate JavaScript to enable the search functionality.{% endtrans %}</p>
    </div>
  </noscript>
  <p>{% trans %}Searching for multiple words only shows matches that contain all words.{% endtrans %}</p>
  <form class="bz-search-form" action="" method="get">
    <input type="text" id="q" name="q" aria-labelledby="search-documentation" value="" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"/>
    <button type="submit">{{ _('search') }}</button>
  </form>
  <p><span id="search-progress"></span></p>
  <div id="search-results"></div>
{% endblock %}