search field working
This commit is contained in:
parent
4a310dcbbe
commit
4142493f0e
3 changed files with 51 additions and 18 deletions
|
|
@ -14,11 +14,11 @@
|
|||
class="panel panel--left"
|
||||
x-data="{search: ''}"
|
||||
>
|
||||
<span class="search">
|
||||
<div class="search">
|
||||
<input
|
||||
class="search__input"
|
||||
type="text"
|
||||
placeholder="page, auteur, année etc."
|
||||
placeholder="titre / auteur / année / catégorie"
|
||||
x-model="search"
|
||||
>
|
||||
<img
|
||||
|
|
@ -26,9 +26,8 @@
|
|||
class="search__icon"
|
||||
alt="Icône loupe indiquant le champ de recherche."
|
||||
>
|
||||
</span>
|
||||
<ul id="result"></ul>
|
||||
<ul id="panel__items">
|
||||
</div>
|
||||
<ul class="panel__items">
|
||||
<?php foreach($kirby->collection('years') as $year): ?>
|
||||
<li
|
||||
class="panel__item "
|
||||
|
|
@ -39,33 +38,59 @@
|
|||
:class="year ? '' : 'short'"
|
||||
@click="year = !year"
|
||||
>
|
||||
<h3 class="fs-xl color" style="--color:var(--color-secondary)"><?= $year->title() ?><span x-show="search.length > 0" x-text="` > 1`"></span></h3>
|
||||
<h3 class="fs-xl color" style="--color:var(--color-secondary)"><?= $year->title() ?></h3>
|
||||
<div
|
||||
class="panel__toggle-icon"
|
||||
x-text="year ? '-' : '+'"
|
||||
x-text="year || search.length > 0 ? '-' : '+'"
|
||||
></div>
|
||||
</button>
|
||||
<div
|
||||
class="panel-item-content"
|
||||
x-show="year"
|
||||
x-data="{edito: false}"
|
||||
x-show="year || search.length > 0"
|
||||
x-data='{ edito: false }'
|
||||
>
|
||||
<div
|
||||
class="panel-item-content__edito"
|
||||
:class="edito ? '' : 'short'"
|
||||
x-show="search.length === 0"
|
||||
>
|
||||
<?= $year->edito() ?>
|
||||
</div>
|
||||
<button
|
||||
:class="edito ? 'open' : 'close'"
|
||||
class="see-more toggle left" @click="edito = !edito"
|
||||
x-show="search.length === 0"
|
||||
class="see-more toggle left"
|
||||
@click="edito = !edito"
|
||||
>Lire</button>
|
||||
<ul class="panel-item-content__texts">
|
||||
<?php foreach($year->children() as $article): ?>
|
||||
<?php snippet(
|
||||
'text-item',
|
||||
array('article' => $article)
|
||||
) ?>
|
||||
<li
|
||||
class="text"
|
||||
x-data="{
|
||||
title: '<?= str_replace("'", "\'", $article->title()->value()) ?>',
|
||||
author: '<?= $article->author()->toUser()->name() ?>',
|
||||
yearParent: '<?= $article->parent()->title()->value() ?>',
|
||||
category: '<?= $article->category() ?>',
|
||||
}"
|
||||
x-show="
|
||||
title.toLowerCase().includes(search.toLowerCase())
|
||||
|| author.toLowerCase().includes(search.toLowerCase())
|
||||
|| yearParent.toLowerCase().includes(search.toLowerCase())
|
||||
|| category.toLowerCase().includes(search.toLowerCase())
|
||||
"
|
||||
>
|
||||
<a href="<?= $article->url() ?>" class="texts__title no-line">
|
||||
<h3><?= $article->title() ?></h3>
|
||||
</a>
|
||||
<div class="text__infos">
|
||||
<p>
|
||||
<span class="light">par</span>
|
||||
<a class="author" href="/auteurs/<?= Str::slug($article->author()->toUser()->name()) ?>"><?= $article->author()->toUser()->name() ?></a><br>
|
||||
<span class="light">publié le </span><?= $article->published()->toDate('d/m/Y') ?><br>
|
||||
<span class="light">dans</span> <a href="<?= $article->parent()->url() ?>"><?= $article->parent()->title() ?></a> / <a href="/categories/<?= $article->category() ?>"><?= $article->category() ?></a>
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
<?php endforeach ?>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue