La zone de scroll avait une max-height fixe (420px) alors que la colonne
fait toute la hauteur de la page -> gros bandeau blanc entre le feed et
le footer. Passe en flex-col (header shrink-0, feed flex-1 scrollable,
Boutique shrink-0 collée en bas), le feed occupe maintenant tout
l'espace disponible.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Retire les 3 onglets (trop petits, moches). Header : "Jules Neny"
(compte actif, lien direct) + "AEP" (lien direct vers @aep.politique,
pas encore de feed dédié). Bande du bas : uniquement "Boutique"
(placeholder désactivé).
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Réduit le padding de la bande d'actions (py-3->py-1, gap serré) pour
coller au feed. Ajoute un 3e onglet "Compte Insta politique" en
placeholder désactivé, à côté de "Boutique", en prévision d'une
navigation à onglets entre les comptes @julesneny (artistique, actif)
et @aep.politique (à venir).
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Empile les 13 captures d'écran du feed réel (IMG_5439..5451, plus récent
en haut, plus ancien en bas) dans une colonne overflow-y:auto avec
scrollbar fine, pour permettre de naviguer dans le feed sans quitter le
site. Petit gap 2px entre chaque capture (façon séparation Instagram).
Dédoublonnage pixel des zones de chevauchement tenté (corrélation de
luminance par ligne) mais abandonné : signal pas assez discriminant sur
ce contenu (fonds crème uniformes). Chevauchement naturel accepté.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
ColInsta n'affichait que le fallback bio depuis PC5 (feed IDs Behold jamais
renseignés, login Facebook Business trop lourd). Retire le bloc @aep.politique
(jugé insatisfaisant) et remplace InstaFeed par une galerie 3x3 statique de
9 vignettes réelles (croppées depuis le dernier screenshot du feed), avec
boutons Compte Insta + Boutique (placeholder désactivé, en attente d'URL).
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
- C1 : cadre 1px #CBD5E1 + radius 6px autour section centre-haut (Carte O zone).
Force tuning CarteO.vue : forceX/Y strength 0.05 -> 0.08, collide radius +12 -> +14
pour mieux contenir les nodes dans le cadre visible.
- C2 : bouton toggle Carte O desktop (icone triangle dans le bandeau, a cote de la legende).
Replie a flex 0 0 36px (header reste visible, body masque avec opacity 0).
Persistance sessionStorage 'tf-carte-o-collapsed'.
- D : fix drag handle qui ne se decliquait pas au mouseup. Listeners poses sur window
(vs document) + ajout pointerup/mouseleave/blur/mouseenter-buttons-0 pour couvrir
tous les flux utilisateur (sortie iframe, perte focus, relache hors-page).
Suspension transitions CSS pendant le drag (pas de lag).
- E1 : PreviewArticle hydration client:load (vs client:visible) - le v-if rendait
l'IntersectionObserver aveugle, donc les listeners 'preview-open' n'etaient jamais
installes. Resultat : clic manifeste -> preview ne s'ouvrait pas.
- E2 : Transition Vue preview-fade (opacity + translateY 8px, 250ms ease) +
transitions CSS flex-basis 0.3s ease sur sections haut/bas pour smooth UX.
Le @load event ne fire pas (ou tardivement) sur l'iframe AEP enfermee
dans un wrapper avec transform scale(0.42) + viewport simulee 1440px.
Resultat : skeleton 'Chargement de la carte AEP...' reste affiche
indefiniment, masquant l'iframe meme si elle se charge.
Fix :
- setTimeout 2.5s dans onMounted qui force revealIframe() inconditionnellement
- onIframeLoad clear le timer si l'event fire dans les temps (cas nominal)
- retrait du z-10 sur le skeleton (defense en profondeur : si bug residuel,
l'iframe sera quand meme visible derriere)
- factorisation revealIframe() partagee entre @load et fallback
- cleanup du timer dans onUnmounted
Build SSR : 5 pages, 0 warning, ~4s.
Tests browser manuels a faire par Jules pour confirmer disparition skeleton.
- PreviewArticle.vue : nouveau composant qui ecoute journal-item-click et s'insere entre Carte O et iframe AEP
- EmbedDynamique.vue : retire le swap article (iframe AEP toujours visible en bas)
- ColCentre.astro : passe en flex-col, preview ouverte = Carte O 33vh + Preview auto + iframe 67vh, overflow-y-auto sur le container
- Bouton 'Retour a la carte' emet preview-close -> grid revient 1/3 + 2/3
- Scroll independant : Journal (gauche), Centre (preview), Insta (droite)
- Drag-resize desactive quand preview ouverte (anti-collision)
Champ optionnel domain dans YAML carte-o-source : propage vers JSON et
permet d'afficher un logo plateforme en bas-droite de chaque node (cercle
blanc 18px + image clippee circulaire 14px) quand le zoom depasse 1.5x.
V1.2-O par defaut : substack.com sur les 15 thematiques essais. Centre +
projet TMIP gardent leur fill brut (encre / ocre). Toggle visibilite via
callback zoom (opacity 0/1 sur .logo-overlay).
A flagger : CDN Brandfetch retourne 403 en curl server-side avec le client
ID fourni. A revalider en browser (origin trans-former.fr) — le CDN peut
exiger un Origin header autorise. Si bloque, fallback prevu en V1.3
(proxy local ou logos packages dans /public/logos/).
Files:
- public/data/carte-o-source.yaml : +15 champs domain
- scripts/build-carte-o.js : propagation domain -> JSON
- src/components/vue/CarteO.vue : CarteNode.domain + logoUrl helper
+ logo-overlay (circle + image clip-path) + toggle visibilite zoom
- public/data/carte-o.json : regenere (15/17 nodes ont domain)
- YAML: fusion 3 noeuds confus (centre + ncs-politique + medecine-corps-social) en 1 seul noeud central 'Contrat social + Medecine du corps social'
- Build script: toutes les thematiques rattachees directement au centre (suppression mapping NCS/MDCS), radius central 30px, projets 18px
- CarteO.vue palette V1.2: central #0F172A (encre), essais #FFFFFF stroke encre, projets #B45309 (ocre conserve)
- Labels: inscrit dans le cercle (blanc) pour central+projets, a droite (encre douce) pour essais
- Label central long split sur 2-3 lignes via splitCentralLabel()
- Background: #FAFAF7 (papier, raccord colonnes laterales)
- Liens: #94A3B8 opacity 0.4 1px
17 nodes / 19 edges. Build SSR 5 pages prerender + server, 0 warning.
