97 lines
3.4 KiB
PHP
97 lines
3.4 KiB
PHP
|
<nav
|
||
|
|
class="panel panel--left"
|
||
|
|
x-data="{search: ''}"
|
||
|
|
>
|
||
|
|
<div class="search">
|
||
|
|
<input
|
||
|
|
class="search__input"
|
||
|
|
type="text"
|
||
|
|
placeholder="titre / auteur / année / catégorie"
|
||
|
|
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>
|
||
|
|
<ul class="panel__items">
|
||
|
|
<?php foreach($kirby->collection('years') as $year): ?>
|
||
|
|
<li
|
||
|
|
class="panel__item "
|
||
|
|
x-data='{ isOpen: false }'
|
||
|
|
>
|
||
|
|
<a class="no-line" href="#<?= $year->slug() ?>" id="<?= $year->slug() ?>">
|
||
|
|
<button
|
||
|
|
class="panel__toggle-btn"
|
||
|
|
:class="isOpen ? '' : 'short'"
|
||
|
|
@click="isOpen = !isOpen"
|
||
|
|
>
|
||
|
|
<h3><?= $year->title() ?></h3>
|
||
|
|
<div
|
||
|
|
class="panel__toggle-icon"
|
||
|
|
x-text="isOpen || search.length > 0 ? '-' : '+'"
|
||
|
|
></div>
|
||
|
|
</button>
|
||
|
|
</a>
|
||
|
|
<div
|
||
|
|
class="panel-item-content"
|
||
|
|
x-show="isOpen || 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'"
|
||
|
|
x-show="search.length === 0"
|
||
|
|
class="see-more toggle-btn toggle-btn--left"
|
||
|
|
@click="edito = !edito"
|
||
|
|
>Lire</button>
|
||
|
|
<ul class="panel-item-content__texts">
|
||
|
|
<?php foreach($year->children()->shuffle() as $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="text__title no-line">
|
||
|
|
<h4><?= $article->title() ?></h4>
|
||
|
|
</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>
|
||
|
|
</li>
|
||
|
|
<?php endforeach ?>
|
||
|
|
</ul>
|