picture - bg color before loading = event color or season color

This commit is contained in:
isUnknown 2024-09-17 15:49:48 +02:00
parent c49aca969e
commit cb65669ccc
6 changed files with 7 additions and 5 deletions

View file

@ -12,7 +12,7 @@ section:not(:last-child, .collapsable, .collapsable-sections) {
} }
picture { picture {
background-color: var(--color-season); background-color: var(--color);
display: flex !important; display: flex !important;
justify-content: center !important; justify-content: center !important;
align-items: center !important; align-items: center !important;

View file

@ -13,6 +13,8 @@ document.addEventListener("DOMContentLoaded", () => {
images: document.querySelectorAll("img"), images: document.querySelectorAll("img"),
}; };
console.log(nodes.images);
// Listeners // Listeners
nodes.burgerBtn.addEventListener("click", () => expandNav(nodes)); nodes.burgerBtn.addEventListener("click", () => expandNav(nodes));
nodes.closeNavBtn.addEventListener("click", () => closeNav(nodes)); nodes.closeNavBtn.addEventListener("click", () => closeNav(nodes));

View file

@ -1,6 +1,6 @@
<div class="event-card grid__item" style="--span: <?= $span ?>"> <div class="event-card grid__item" style="--span: <?= $span ?>">
<a class="event-card__link" href="<?= $event->url() ?>"></a> <a class="event-card__link" href="<?= $event->url() ?>"></a>
<div class="image-wrapper"> <div class="image-wrapper" style="--color: <?= $event->color()->isNotEmpty() ? $event->color() : 'var(--color-season)' ?>">
<?php if ($event->gallery()->toFiles()->count() > 1): ?> <?php if ($event->gallery()->toFiles()->count() > 1): ?>
<?php snippet('picture', [ <?php snippet('picture', [
'file' => $event->gallery()->toFiles()->first(), 'file' => $event->gallery()->toFiles()->first(),

View file

@ -14,7 +14,7 @@
$span = 3; $span = 3;
} }
} }
snippet('event-card', ["event" => $event, "span" => $span]) snippet('event-card', ["event" => $event, "span" => $span, "color" => $event->color()->isNotEmpty() == 'true' ? $event->color() : null])
?> ?>
<?php endforeach ?> <?php endforeach ?>
</div> </div>

View file

@ -9,7 +9,7 @@
</section> </section>
<section class="presentation"> <section class="presentation">
<div id="swiper" style="--span: 8;"> <div id="swiper" style="--span: 8; --color: <?= $page->color()->isNotEmpty() ? $page->color() : 'var(--color-season)' ?>">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<?php foreach($page->gallery()->toFiles() as $slide): ?> <?php foreach($page->gallery()->toFiles() as $slide): ?>
<div class="swiper-slide"> <div class="swiper-slide">

View file

@ -6,7 +6,7 @@
<a class="hero__link h3" href="<?= $site->heroLinkUrl()->toUrl() ?>"><?php e($site->heroLinkText()->isNotEmpty() == 'true', $site->heroLinkText(), $site->heroLinkUrl()->toUrl()) ?></a> <a class="hero__link h3" href="<?= $site->heroLinkUrl()->toUrl() ?>"><?php e($site->heroLinkText()->isNotEmpty() == 'true', $site->heroLinkText(), $site->heroLinkUrl()->toUrl()) ?></a>
<?php endif ?> <?php endif ?>
</div> </div>
<div class="hero__image"> <div class="hero__image" style="--color: var(--color-season)">
<?php if ($site->heroLinkUrl()->isNotEmpty() == 'true'): ?> <?php if ($site->heroLinkUrl()->isNotEmpty() == 'true'): ?>
<a href="<?= $site->heroLinkUrl()->toUrl() ?>" title="en savoir plus"> <a href="<?= $site->heroLinkUrl()->toUrl() ?>" title="en savoir plus">
<?php snippet('picture', ['file' => $site->heroImage()->toFile()]) ?> <?php snippet('picture', ['file' => $site->heroImage()->toFile()]) ?>