From cf8cf5c8e23a1159ed464e376ea6356d84cd647d Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 6 Sep 2026 14:22:03 +0000
Subject: [PATCH] =?UTF-8?q?Promotions=20:=20le=20logo=20revient=20=C3=A0?=
 =?UTF-8?q?=20gauche=20du=20nom=20de=20l'adh=C3=A9rent?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

L'angle de la carte est rendu à la catégorie ; la pastille du commerce se
place devant son nom, en pied de carte, là où on lit déjà qui propose l'offre.
La période de validité passe sous le nom, dans le même bloc.

Appliqué à la carte d'accueil, à l'aperçu en direct de l'espace adhérent et à
la carte de modération. Retiré de la carte de la fiche adhérent : elle n'y
affiche pas de nom de commerce, et le logo figure déjà en tête de page.

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

diff --git a/src/app/adherents/[id]/page.tsx b/src/app/adherents/[id]/page.tsx
index 6d5875c..8cebdc5 100644
--- a/src/app/adherents/[id]/page.tsx
+++ b/src/app/adherents/[id]/page.tsx
@@ -6,7 +6,6 @@ import { SiteHeader } from "@/components/SiteHeader";
 import { SiteFooter } from "@/components/SiteFooter";
 import { VitrineImage } from "@/components/VitrineImage";
 import { PromoImage } from "@/components/PromoImage";
-import { MemberAvatar } from "@/components/MemberAvatar";
 import { JsonLd } from "@/components/JsonLd";
 import { getMemberLivePromotions, getPublicMember } from "@/lib/queries";
 import {
@@ -432,11 +431,6 @@ export default async function FicheAdherentPage({
                     <div style={{ position: "relative", aspectRatio: "1 / 1", 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>)}
-                      {/* Même repère que sur l'accueil : le logo du commerce
-                          dans l'angle haut-gauche de la carte. */}
-                      <span style={{ position: "absolute", top: 10, left: 10 }}>
-                        <MemberAvatar name={member.name} logoUrl={member.logoUrl} size={32} accent={accent} />
-                      </span>
                       {p.badge && (
                         <span className="font-display" style={{ position: "absolute", top: 0, right: 0, background: badgeColor(p.badge), color: "#fff", fontWeight: 800, fontSize: 16, padding: "6px 13px", borderRadius: "0 0 0 14px" }}>{p.badge}</span>
                       )}
diff --git a/src/app/backend/espace/MemberSpaceForm.tsx b/src/app/backend/espace/MemberSpaceForm.tsx
index 01862f3..b19315f 100644
--- a/src/app/backend/espace/MemberSpaceForm.tsx
+++ b/src/app/backend/espace/MemberSpaceForm.tsx
@@ -357,13 +357,9 @@ export function MemberSpaceForm({
                 {badge}
               </span>
             )}
-            {/* Même composition que sur le site : logo puis catégorie. */}
-            <div style={{ position: "absolute", top: 12, left: 12, display: "flex", alignItems: "center", gap: 8 }}>
-              <MemberAvatar name={memberName} logoUrl={memberLogoUrl} size={34} />
-              <span style={{ background: "#9a6638", color: "#fff", borderRadius: 999, padding: "5px 12px", fontSize: 11, fontWeight: 700 }}>
-                {cat}
-              </span>
-            </div>
+            <span style={{ position: "absolute", top: 12, left: 12, background: "#9a6638", color: "#fff", borderRadius: 999, padding: "5px 12px", fontSize: 11, fontWeight: 700 }}>
+              {cat}
+            </span>
           </div>
           <div style={{ padding: "17px 18px 18px" }}>
             <h3 className="font-display" style={{ fontWeight: 700, fontSize: 18, margin: "0 0 5px", color: "#26201a" }}>
@@ -377,7 +373,10 @@ export function MemberSpaceForm({
               <div style={{ fontSize: 12, color: "#a99c82", marginBottom: 12 }}>{validity}</div>
             )}
             <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", borderTop: "1px solid #f0e8d6", paddingTop: 12 }}>
-              <div style={{ fontSize: 13, fontWeight: 700, color: "#3c3322" }}>{memberName}</div>
+              <div style={{ display: "flex", alignItems: "center", gap: 9, minWidth: 0 }}>
+                <MemberAvatar name={memberName} logoUrl={memberLogoUrl} size={28} />
+                <span style={{ fontSize: 13, fontWeight: 700, color: "#3c3322" }}>{memberName}</span>
+              </div>
               <span style={{ color: "#2C6FB3", fontWeight: 700, fontSize: 13 }}>Voir l&apos;offre →</span>
             </div>
           </div>
diff --git a/src/app/backend/promotions/page.tsx b/src/app/backend/promotions/page.tsx
index d6425d4..ad0ad4e 100644
--- a/src/app/backend/promotions/page.tsx
+++ b/src/app/backend/promotions/page.tsx
@@ -159,15 +159,11 @@ export default async function PromotionsPage() {
                 }}
               >
                 {p.imageUrl && <PromoImage src={p.imageUrl} alt={p.title ?? ""} />}
-                {/* Comme sur le site : logo de l'adhérent puis catégorie. */}
-                <div style={{ position: "absolute", top: 10, left: 10, display: "flex", alignItems: "center", gap: 7 }}>
-                  <MemberAvatar name={p.memberName ?? ""} logoUrl={p.memberLogoUrl} size={30} />
-                  {p.category && (
-                    <span style={{ background: "#9a6638", color: "#fff", borderRadius: 999, padding: "4px 11px", fontSize: 11, fontWeight: 700 }}>
-                      {p.category}
-                    </span>
-                  )}
-                </div>
+                {p.category && (
+                  <span style={{ position: "absolute", top: 10, left: 10, background: "#9a6638", color: "#fff", borderRadius: 999, padding: "4px 11px", fontSize: 11, fontWeight: 700 }}>
+                    {p.category}
+                  </span>
+                )}
                 <span
                   style={{
                     position: "absolute",
@@ -188,8 +184,9 @@ export default async function PromotionsPage() {
                 <h3 className="font-display" style={{ fontWeight: 700, fontSize: 15.5, margin: "0 0 4px", color: "#26201a" }}>
                   {p.title}
                 </h3>
-                <div style={{ fontSize: 12.5, color: "#9a6638", fontWeight: 600, marginBottom: 8 }}>
-                  {p.memberName}
+                <div style={{ display: "flex", alignItems: "center", gap: 8, marginBottom: 8 }}>
+                  <MemberAvatar name={p.memberName ?? ""} logoUrl={p.memberLogoUrl} size={24} />
+                  <span style={{ fontSize: 12.5, color: "#9a6638", fontWeight: 600 }}>{p.memberName}</span>
                 </div>
                 <p style={{ margin: "0 0 12px", fontSize: 12.5, color: "#8c8068", lineHeight: 1.45, flex: 1 }}>
                   {p.text}
diff --git a/src/app/page.tsx b/src/app/page.tsx
index c704592..9d07b76 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -285,25 +285,23 @@ export default async function AccueilPage() {
                       {p.badge}
                     </span>
                   )}
-                  {/* Angle haut-gauche : le logo de l'adhérent d'abord, la
-                      catégorie ensuite — on identifie le commerce avant l'offre. */}
-                  <div style={{ position: "absolute", top: 12, left: 12, display: "flex", alignItems: "center", gap: 8 }}>
-                    <MemberAvatar name={p.memberName ?? ""} logoUrl={p.memberLogoUrl} size={34} />
-                    {p.category && (
-                      <span
-                        style={{
-                          background: "#9a6638",
-                          color: "#fff",
-                          borderRadius: 999,
-                          padding: "5px 12px",
-                          fontSize: 11,
-                          fontWeight: 700,
-                        }}
-                      >
-                        {p.category}
-                      </span>
-                    )}
-                  </div>
+                  {p.category && (
+                    <span
+                      style={{
+                        position: "absolute",
+                        top: 12,
+                        left: 12,
+                        background: "#9a6638",
+                        color: "#fff",
+                        borderRadius: 999,
+                        padding: "5px 12px",
+                        fontSize: 11,
+                        fontWeight: 700,
+                      }}
+                    >
+                      {p.category}
+                    </span>
+                  )}
                 </div>
                 <div style={{ padding: "17px 18px 18px", display: "flex", flexDirection: "column", flex: 1 }}>
                   <h3 className="font-display" style={{ fontWeight: 700, fontSize: 18, margin: "0 0 5px", color: "#26201a" }}>
@@ -318,10 +316,16 @@ export default async function AccueilPage() {
                       paddingTop: 12,
                     }}
                   >
-                    <div style={{ fontSize: 13, fontWeight: 700, color: "#3c3322" }}>{p.memberName}</div>
-                    {formatValidity(p) && (
-                      <div style={{ fontSize: 11.5, color: "#a99c82" }}>{formatValidity(p)}</div>
-                    )}
+                    {/* Le logo du commerce juste à gauche de son nom. */}
+                    <div style={{ display: "flex", alignItems: "center", gap: 9 }}>
+                      <MemberAvatar name={p.memberName ?? ""} logoUrl={p.memberLogoUrl} size={28} />
+                      <div style={{ minWidth: 0 }}>
+                        <div style={{ fontSize: 13, fontWeight: 700, color: "#3c3322" }}>{p.memberName}</div>
+                        {formatValidity(p) && (
+                          <div style={{ fontSize: 11.5, color: "#a99c82" }}>{formatValidity(p)}</div>
+                        )}
+                      </div>
+                    </div>
                   </div>
                 </div>
               </Link>