<form action="#" method="GET" role="search" class="search-form flex items-center flex-1 max-w-md relative border-b border-black/16 group hover:border-neutral-800/64 focus-within:border-black" @click.prevent="openSearchLayer" @keypress="openSearchLayer">
<label for="search" class="sr-only">Recherche</label>
<input type="text" id="search" name="q" placeholder="Quel est votre besoin/problème de peau ?" class="w-full p-2 pr-8 bg-transparent border-0 text-body-sm hover:text-dark/72 focus:text-dark focus:outline-none focus:ring-transparent" x-model="searchQuery">
<button type="button" class="absolute right-0 flex items-center justify-center pr-2 focus:outline-none focus:ring-2 focus:ring-neutral-800">
<span class="sr-only">Lancer la recherche</span>
<span aria-hidden="true">
<svg class=" shrink-0" width="24" height="24" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" stroke="currentColor" stroke-width="1.5" fill="none" />
</svg> </span>
</button>
</form>
<button id="search-openSearchLayer" class="sr-only" tabindex="-1" aria-hidden="true">Retour recherche</button>
<form action="#" method="GET" role="search"
class="search-form flex items-center flex-1 max-w-md relative border-b border-black/16 group hover:border-neutral-800/64 focus-within:border-black"
@click.prevent="openSearchLayer" @keypress="openSearchLayer" {{ form_attribute|default('') }}>
<label for="search" class="sr-only">Recherche</label>
<input type="text"
id="search"
name="q"
placeholder="Quel est votre besoin/problème de peau ?"
class="w-full p-2 pr-8 bg-transparent border-0 text-body-sm hover:text-dark/72 focus:text-dark focus:outline-none focus:ring-transparent"
x-model="searchQuery"
{{ input_attribute|default('') }}
>
<button type="button"
class="absolute right-0 flex items-center justify-center pr-2 focus:outline-none focus:ring-2 focus:ring-neutral-800"
{{ button_attribute|default('') }}
>
<span class="sr-only">Lancer la recherche</span>
<span aria-hidden="true">
{% render "@icons-heroicons--magnifying-glass-outline" %}
</span>
</button>
</form>
<button id="search-openSearchLayer" class="sr-only" tabindex="-1" aria-hidden="true">Retour recherche</button>
/* No context defined. */
No notes defined.