Files
mandelstudio/mandelstudio/templates/partials/search_modal.html

35 lines
1.4 KiB
HTML

{% load i18n %}
<div class="modal fade" id="siteSearchModal" tabindex="-1" aria-labelledby="siteSearchModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content">
<div class="modal-header border-0 pb-0">
<h2 class="h4 modal-title" id="siteSearchModalLabel">{% trans "Search" %}</h2>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% trans "Close" %}"></button>
</div>
<div class="modal-body pt-2">
<form method="get" rel="search" action="{% url 'search:search' %}" class="search_form" id="search_form">
<div class="search-input-wrapper">
<input type="search" name="q" placeholder="{% trans 'Search the whole site' %}" class="form-control form-control-lg" autocomplete="off" required="" id="id_q" title="{% trans 'Search' %}">
<button class="btn btn-primary btn-lg mt-3 w-100" type="submit">
{% trans "Search" %}
</button>
</div>
</form>
<p class="text-muted mt-3 mb-0">
{% trans "Tip: start typing to see suggestions." %}
</p>
</div>
</div>
</div>
</div>
<script>
document.addEventListener('shown.bs.modal', function (event) {
if (event.target && event.target.id === 'siteSearchModal') {
const input = event.target.querySelector('#id_q');
if (input) input.focus();
}
});
</script>