From 8efe296b55f2c6696e90dc281827df40a5849744 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Mon, 13 Jul 2026 19:19:23 +0000
Subject: [PATCH] =?UTF-8?q?Rend=20toute=20la=20carte=20rencontre=20pass?=
 =?UTF-8?q?=C3=A9e=20cliquable=20pour=20ouvrir=20le=20carrousel?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Seules les vignettes photo individuelles ouvraient le carrousel ; un clic
ailleurs sur la carte (titre, texte) ne faisait rien. Toute la carte est
maintenant cliquable dès qu'une rencontre a au moins une photo.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Fkg15RCxNgUys4ru73He2o
---
 web/src/components/PastEventCard.jsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/web/src/components/PastEventCard.jsx b/web/src/components/PastEventCard.jsx
index 2b27403..ca58cf6 100644
--- a/web/src/components/PastEventCard.jsx
+++ b/web/src/components/PastEventCard.jsx
@@ -15,7 +15,7 @@ export default function PastEventCard({ event }) {
       <div
         className={photo ? '' : 'placeholder-pattern'}
         style={{ borderRadius: 3, overflow: 'hidden', cursor: photo ? 'pointer' : 'default', ...extra }}
-        onClick={photo ? () => setCarouselAt(idx) : undefined}
+        onClick={photo ? (e) => { e.stopPropagation(); setCarouselAt(idx); } : undefined}
       >
         {photo && <img src={photo.path} alt="" style={{ width: '100%', height: '100%', objectFit: 'cover' }} />}
       </div>
@@ -24,7 +24,11 @@ export default function PastEventCard({ event }) {
 
   return (
     <>
-      <article className="card hero-grid" style={{ display: 'grid', gridTemplateColumns: '1.15fr .85fr', gap: 40, alignItems: 'center', padding: 36 }}>
+      <article
+        className="card hero-grid"
+        style={{ display: 'grid', gridTemplateColumns: '1.15fr .85fr', gap: 40, alignItems: 'center', padding: 36, cursor: hasPhotos ? 'pointer' : 'default' }}
+        onClick={hasPhotos ? () => setCarouselAt(0) : undefined}
+      >
         <div>
           <div style={{ fontSize: 12, letterSpacing: '.14em', textTransform: 'uppercase', color: 'var(--gray-light)', fontWeight: 600, marginBottom: 12 }}>
             {event.date_label} · {event.lieu}
@@ -35,7 +39,7 @@ export default function PastEventCard({ event }) {
             <span>👥 {event.participants} participants</span>
             <span>📷 {event.nb_photos} photo{event.nb_photos > 1 ? 's' : ''}</span>
             {hasPhotos && (
-              <button className="btn-link" style={{ fontSize: 13 }} onClick={() => setCarouselAt(0)}>
+              <button className="btn-link" style={{ fontSize: 13 }} onClick={(e) => { e.stopPropagation(); setCarouselAt(0); }}>
                 Voir les photos →
               </button>
             )}
@@ -47,7 +51,7 @@ export default function PastEventCard({ event }) {
           {photos.length > 3 ? (
             <div
               style={{ borderRadius: 3, overflow: 'hidden', cursor: 'pointer', position: 'relative' }}
-              onClick={() => setCarouselAt(2)}
+              onClick={(e) => { e.stopPropagation(); setCarouselAt(2); }}
             >
               <img src={photos[2].path} alt="" style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
               <div style={{ position: 'absolute', inset: 0, background: 'rgba(15,14,13,.55)', color: '#fff', display: 'flex', alignItems: 'center', justifyContent: 'center', fontFamily: "'Newsreader',serif", fontSize: 22, fontWeight: 600 }}>