Search

{#
	{% include '@component-search' with {
		modifier: 'modifier',
		aria: 'Site Search',
		label: 'Search',
		placeholder: '',
		button_text: 'Submit'
	} %}
#}
<div class="js-site-search site_search{% if modifier %} site_search_{{ modifier }}{% endif %}" id="site_search{% if modifier %}_{{ modifier }}{% endif %}" role="search" itemscope itemtype="https://schema.org/WebSite" aria-label="{{ aria }}">
	<meta itemprop="url" content="http://{{ config.domain }}">
	<form class="site_search_form" action="/static-html/templates/page-search.html" itemprop="potentialAction" itemscope itemtype="http://schema.org/SearchAction">
		<meta itemprop="target" content="http://{{ config.domain }}/static-html/templates/page-search.html?q={q}">
		<label class="js-site-search-label site_search_label" for="search_string_{% if modifier %}_{{ modifier }}{% endif %}">{{ label ?: 'Search' }}</label>
		<div class="site_search_field">
			<span class="site_search_button_hint_icon">
				<i class="fa-regular fa-magnifying-glass"></i>
			</span>
			<input class="js-site-search-input site_search_input" itemprop="query-input" type="search" id="search_string_{% if modifier %}_{{ modifier }}{% endif %}" name="q" {% if placeholder %} placeholder="{{ placeholder }}" {% endif %} required>
			<button class="site_search_button" type="submit" {% if not button_text %} aria-label="Search" {% endif %}>
				{% if button_text %}
					<span class="site_search_button_label">{{ button_text }}</span>
				{% endif %}
				<span class="site_search_button_icon">
					<i class="fa-regular fa-magnifying-glass"></i>
				</span>
			</button>
		</div>
	</form>
</div>