{% extends "layout.html" %}
{% block main_content %}
<div data-ou-book-theme-content="">
  <h1>Search</h1>
  <form id="search-form" action="" method="get" class="flex flex-row mb-8">
    <label class="flex-1"><span class="sr-only">Search for</span>
      <input type="search" name="q" value="" autocomplete="off" autocorrect="off" autocapitalize="off"
        spellcheck="false" data-ou-form-field-input="" />
    </label>
    <input type="submit" value="Search" data-ou-button="" data-ou-search-button="" />
  </form>
  <div id="search-results"></div>
</div>
<script>
  document.querySelector('#search-form input[name="q"]').focus();
</script>
{% endblock %}
{% block scripts -%}
{{ super() }}
<script src="{{ pathto('_static/searchtools.js', 1) }}"></script>
<script src="{{ pathto('_static/language_data.js', 1) }}"></script>
<script src="{{ pathto('searchindex.js', 1) }}"></script>
{%- endblock scripts %}