mobile : center text button. homogenize close / open nav btns

This commit is contained in:
isUnknown 2025-02-21 09:37:28 +01:00
parent 455801a0d2
commit 6c245966e1
9 changed files with 92 additions and 64 deletions

View file

@ -1,8 +1,4 @@
<nav
class="panel"
x-data="{search: ''}"
>
<nav class="panel" x-data="{search: ''}">
<header>
<p class="sort-btns">
<button class="sort-btn sort-btn--years active">années</span></button>
@ -10,30 +6,20 @@
<button class="sort-btn sort-btn--all">voir tout</button>
</p>
<div class="search">
<input
class="search__input"
type="text"
placeholder="Chercher"
x-model="search"
>
<img
x-show="search.length === 0"
src="<?= url('assets/images/icons/search.svg') ?>"
class="search__icon"
alt="Icône loupe indiquant le champ de recherche."
>
<button
x-show="search.length > 0"
@click="search = ''"
class="search__icon"
>
<img src="<?= url('assets/images/icons/close.svg') ?>" alt="">
<input class="search__input" type="text" placeholder="Chercher" x-model="search">
<img x-show="search.length === 0"
src="<?= url('assets/images/icons/search.svg') ?>"
class="search__icon" alt="Icône loupe indiquant le champ de recherche.">
<button x-show="search.length > 0" @click="search = ''" class="search__icon">
<img
src="<?= url('assets/images/icons/close.svg') ?>"
alt="">
</button>
</div>
</header>
<?php snippet('nav__texts--all') ?>
<?php snippet('nav__texts--collection', ["collection" => "categories"]) ?>
<?php snippet('nav__texts--collection', ["collection" => "years"]) ?>
<button class="panel-close">fermer</button>
<?php snippet('nav__texts--collection', ['collection' => 'categories']) ?>
<?php snippet('nav__texts--collection', ['collection' => 'years']) ?>
<button class="less panel-close">textes</button>
</nav>
<div id="nav-overlay"></div>