fix card image height

assets/css/src/events-grid.css

@@ -15,6 +15,7 @@
 }
 
 .event-card picture {
+  height: calc(((100vw - 9 * var(--space-m)) / 12) * var(--span));
   margin-bottom: calc(var(--space-m) / 2);
 }
 
@@ -23,7 +24,7 @@
 }
 
 .event-card__infos .ticket {
-  z-index: 0;
+  z-index: 5;
   margin-top: 0.3rem;
 }
 
@@ -35,8 +36,8 @@
   margin-bottom: calc(var(--space-m) / 2);
 }
 
-.event-card__link::after {
-  content: "";
+.event-card__link {
   position: absolute;
   inset: 0;
+  z-index: 3;
 }

assets/css/src/nav.css

@@ -31,7 +31,7 @@
   position: sticky;
   top: 0;
   background-color: #fff;
-  z-index: 3;
+  z-index: 10;
 }
 /* Nav */
 
@@ -42,7 +42,7 @@
   width: 100%;
   box-sizing: border-box;
   top: -34rem;
-  z-index: 4;
+  z-index: 11;
   background-color: var(--color-brown-light);
   display: grid;
   grid-template-columns: 2fr 8fr 1fr;

site/snippets/event-card.php

@@ -1,10 +1,9 @@
 <div class="event-card grid__item" style="--span: <?= $span ?>">
+  <a class="event-card__link" href="<?= $event->url() ?>" title="Voir l'événément"></a>
   <?php snippet('picture', ["file" => $event->gallery()->toFiles()->first()]) ?>
   <div class="event-card__infos">
     <div>
-      <a class="event-card__link" href="<?= $event->url() ?>" title="Voir l'événément">
-        <h5><?= $event->title() ?></h5>
-      </a>
+      <h5><?= $event->title() ?></h5>
       <?php if ($event->isMapadoEvent() == 'true'): ?>
         <?php snippet('ticket', ['link' => option('ticketingUrl') . 'event/' . $event->mapadoSlug()]) ?>
       <?php endif ?>