Site md

title: "Site MD" scope: md_global tenant: - type: concept tags: [] source: notion://pages/38526b6c-9c1d-807b-8298-f11891ddf756 notion_id: "38526b6c-9c1d-807b-8298-f11891ddf756" updated: 2026-07-31

Bonnes idées, on enrichit. D'abord rassurance sur ton inquiétude #1 : Header/footer = PAS la version def, t'inquiète. Cette preview est un démonstrateur standalone avec des copies de header/footer juste pour le rendu. À la vraie adoption, la page utilisera le header + footer V2 du thème (topbar + navbar + footer harmonisé qu'on vient de corriger). Donc ce que tu vois là n'est que la coquille de démo. Pour les 3 autres (mockup hero, icône entre paragraphes, carte Gestion de documents), je localise les blocs concernés : Tout localisé. J'ajoute : (A) un mockup flottant à droite du hero, (B) une icône-séparateur entre les 2 paragraphes des cartes famille, (C) la carte Gestion de documents (8ᵉ moteur, lié au Drive). D'abord le CSS : (A) Hero en 2 colonnes avec mockup flottant : (B) Icône-séparateur entre les 2 paragraphes des cartes famille : (C) Carte « Gestion de documents » (8ᵉ moteur, lié au Drive) : All 3 enrichissements faits. Je recharge et je vérifie le hero (mockup flottant) : Joffrey bien retiré dans la signature. Je remonte au hero pour voir le mockup flottant : Le hero est resté en 1 colonne, le mockup ne s'affiche pas. Je diagnostique (grille appliquée ? image chargée ?) : Diagnostic clair : la grille est en place, mais le viewport de la preview fait \~800px, donc mon point de rupture à 820px déclenche le mode mobile (1 colonne, mockup masqué). Le conteneur de contenu fait \~680px. Je descends le breakpoint pour que le 2-colonnes s'affiche : Le hero a maintenant le mockup du dashboard Hermes (téléphone « Bonjour Marc », RDV, impayés à relancer) qui flotte dans l'espace de droite. Exactement ton idée, et c'est le vrai produit en vitrine. Je confirme les 2 autres ajouts via le DOM : Tout est en place et vérifié dans le DOM :

Demande	Résultat
Mockup hero + animation à droite	✅ Le dashboard Hermes (téléphone) flotte dans l'espace libre (`mdFloat`, respecte `prefers-reduced-motion`)
Icône entre les 2 paragraphes (cartes famille)	✅ 2 séparateurs flèche-bas or (problème → relais Hermes)
Carte « Gestion de documents »	✅ Ajoutée → grille à 8 cartes maintenant équilibrée (créer docs + ranger dans le Drive + partage comptable)
Header/footer = pas la def	✅ Confirmé : démo standalone, le vrai utilisera le header/footer V2 du thème

Récap de l'état de la preview¶

La page démo est maintenant : hero 2-colonnes avec mockup animé · stats compteurs · « Pour qui » 2 cartes avec séparateur · 8 cartes moteurs SVG · 5 cartes différenciateurs · callout sécurité lisible · Joffrey retiré · CTA navy. C'est du beau boulot, on tient une vraie identité premium. ⚠️ Rappel : tout ça vit dans la preview locale (hermes-bot/page-hermes-premium-preview.html), rien n'est déployé. C'est le démonstrateur pour valider le design.

Prochaine étape¶

Maintenant que le rendu te convient (dis-moi s'il reste un détail), la vraie valeur = généraliser cette identité au thème : - Or unifié #F0B429, navbar glass, cartes SVG, animations, mockup hero → dans lp.css + site.js - Appliqué proprement à la page Agent IA et au reste du site (cohérence partout, comme tu veux) - Sans la guerre de cascade du fichier de l'agent Encore un détail à ajuster sur la preview, ou je lance la généralisation au thème ?

Notes migration¶

Migré automatiquement depuis Notion le 2026-07-31
Wikilinks [[...]] créés depuis les <page> Notion (URL en suffixe)
Callouts Notion → MD custom navy/orange (via le converter)