From 7037e8863b8f630ebbbfb39db48dd1692e292b97 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 27 Jun 2026 15:54:22 +0000
Subject: [PATCH] Cartes promo : zone image en aspect-ratio 1200/630 (nouvelle
 maquette)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Aligne les cartes promo sur la dernière refonte Claude Design : la zone image
passe d'une hauteur fixe à un ratio 1200/630, au-dessus du composant PromoImage
existant (remplissage flou + contain). Appliqué à l'accueil, la fiche adhérent,
l'aperçu de l'espace adhérent et la modération. Conseil d'upload : 1200×630.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XwfhYHzC9hQWPDnQ2p53GL
---
 src/app/adherents/[id]/page.tsx            | 2 +-
 src/app/backend/espace/MemberSpaceForm.tsx | 4 ++--
 src/app/backend/promotions/page.tsx        | 2 +-
 src/app/page.tsx                           | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/app/adherents/[id]/page.tsx b/src/app/adherents/[id]/page.tsx
index 6eac458..6dd82cc 100644
--- a/src/app/adherents/[id]/page.tsx
+++ b/src/app/adherents/[id]/page.tsx
@@ -267,7 +267,7 @@ export default async function FicheAdherentPage({
               ) : (
                 promos.map((p, idx) => (
                   <article key={p.id} className="lift" style={{ border: "1px solid #ece3d0", borderRadius: 16, overflow: "hidden", marginBottom: idx === promos.length - 1 ? 0 : 14 }}>
-                    <div style={{ position: "relative", height: 120, background: STRIPE_WARM, overflow: "hidden", display: "flex", alignItems: "center", justifyContent: "center" }}>
+                    <div style={{ position: "relative", aspectRatio: "1200 / 630", background: STRIPE_WARM, overflow: "hidden", display: "flex", alignItems: "center", justifyContent: "center" }}>
                       {p.imageUrl && <PromoImage src={p.imageUrl} alt={p.title} />}
                       {!p.imageUrl && (<span style={{ fontSize: 10, letterSpacing: "0.12em", color: "#a99c82", textTransform: "uppercase" }}>photo de l&apos;offre</span>)}
                       {p.badge && (
diff --git a/src/app/backend/espace/MemberSpaceForm.tsx b/src/app/backend/espace/MemberSpaceForm.tsx
index b7a7430..11dbeba 100644
--- a/src/app/backend/espace/MemberSpaceForm.tsx
+++ b/src/app/backend/espace/MemberSpaceForm.tsx
@@ -105,7 +105,7 @@ export function MemberSpaceForm({
                 <div style={{ fontSize: 13.5, fontWeight: 700, color: "#6c6150" }}>
                   Cliquez pour choisir une image
                 </div>
-                <div style={{ fontSize: 12, color: "#a99c82" }}>JPG ou PNG · 1200×800 conseillé</div>
+                <div style={{ fontSize: 12, color: "#a99c82" }}>JPG ou PNG · 1200×630 conseillé</div>
               </>
             )}
           </div>
@@ -188,7 +188,7 @@ export function MemberSpaceForm({
           <div
             style={{
               position: "relative",
-              height: 175,
+              aspectRatio: "1200 / 630",
               background: STRIPE_WARM,
               overflow: "hidden",
               display: "flex",
diff --git a/src/app/backend/promotions/page.tsx b/src/app/backend/promotions/page.tsx
index 5cf26a5..cf98351 100644
--- a/src/app/backend/promotions/page.tsx
+++ b/src/app/backend/promotions/page.tsx
@@ -75,7 +75,7 @@ export default async function PromotionsPage() {
               <div
                 style={{
                   position: "relative",
-                  height: 150,
+                  aspectRatio: "1200 / 630",
                   background: isPending ? STRIPE_COOL : STRIPE_WARM,
                   overflow: "hidden",
                   display: "flex",
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 09b75ce..2283f25 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -233,7 +233,7 @@ export default async function AccueilPage() {
                 <div
                   style={{
                     position: "relative",
-                    height: 168,
+                    aspectRatio: "1200 / 630",
                     background: STRIPE_WARM,
                     overflow: "hidden",
                     display: "flex",