Adrien/actuel-inactuel
1
0
Fork 0
Code Issues 13 Pull requests Projects Releases Packages Wiki Activity Actions

style desktop nav panel

Browse source
This commit is contained in:
isUnknown 2024-04-15 13:43:57 +02:00
parent 57e9ca74da
commit 81454b3e4e
16 changed files with 157 additions and 136 deletions
Download patch file Download diff file Expand all files Collapse all files

40
site/snippets/panels.php
View file

@ -1,3 +1,29 @@
<sidebar id="desktop-nav">
<ul>
<li class="left top" style="--left: <?= rand(0, 4) ?>; --top: <?= rand(0, 6) ?>">
<button class="toggle-btn toggle-btn--left" onclick="togglePanel('left', event)">
années
</button>
</li>
<li class="left top" style="--left: <?= rand(0, 4) ?>; --top: <?= rand(0, 6) ?>">
<button class="toggle-btn toggle-btn--left" onclick="togglePanel('right', event)">
catégories
</button>
</li>
<li class="empty
"></li>
<li class="left top" style="--left: <?= rand(0, 4) ?>; --top: <?= rand(0, 6) ?>">
<a href="#">
s'abonner
</a>
</li>
<li class="left top" style="--left: <?= rand(0, 4) ?>; --top: <?= rand(0, 6) ?>">
<a href="<?= $site->find('a-propos')->url() ?>">
à propos
</a>
</li>
</ul>
</sidebar>
<nav
class="panel panel--left"
@ -7,7 +33,7 @@
<input
class="search__input"
type="text"
placeholder="titre / auteur / année / catégorie"
placeholder="titre / auteur / année / catégor…"
x-model="search"
>
<img
@ -58,7 +84,7 @@
<button
:class="edito ? 'open' : 'close'"
x-show="search.length === 0"
class="see-more toggle left"
class="see-more toggle-btn toggle-btn--left"
@click="edito = !edito"
>Lire</button>
<ul class="panel-item-content__texts">
@ -111,7 +137,7 @@
<input
class="search__input"
type="text"
placeholder="titre / auteur / année / catégorie"
placeholder="titre / auteur / année / catégor…"
x-model="search"
>
<img
@ -131,8 +157,8 @@
<ul class="panel__items">
<?php
$categories = $kirby->collection('categories');
shuffle($categories);
foreach($categories as $category): ?>
shuffle($categories);
foreach($categories as $category): ?>
<li
class="panel__item "
x-data='{ isOpen: false }'
@ -156,8 +182,8 @@
>
<ul class="panel-item-content__texts">
<?php
shuffle($category['texts']);
foreach($category['texts'] as $article): ?>
shuffle($category['texts']);
foreach($category['texts'] as $article): ?>
<li
class="text"
x-data="{