feat(v11-e): centre BAS embed dynamique click-journal + suppression ScrollArticles

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Jules Neny
2026-05-11 15:19:24 +02:00
parent 4a29a9592a
commit 61e53a04d5
4 changed files with 195 additions and 78 deletions

View File

@@ -3,8 +3,7 @@
// BAS : iframe carte AEP + scroll articles Substack (PC4).
import CarteOWrapper from '../vue/CarteOWrapper.vue';
import ChatbotV2 from '../vue/ChatbotV2.vue';
import IframeCarteAEP from './IframeCarteAEP.astro';
import ScrollArticles from './ScrollArticles.astro';
import EmbedDynamique from '../vue/EmbedDynamique.vue';
---
<div id="col-centre-grid" class="h-full grid grid-rows-2 gap-2 p-2">
<!-- HAUT 50% : tabs Carte O / Chatbot -->
@@ -66,12 +65,11 @@ import ScrollArticles from './ScrollArticles.astro';
<span class="block w-8 h-0.5 bg-neutral-400 rounded-full"></span>
</button>
<!-- BAS 50% : iframe carte AEP + scroll articles Substack (PC4) -->
<section class="border border-neutral-200 rounded overflow-y-auto bg-white">
<!-- BAS 50% : embed dynamique (carte AEP default, article journal au click) -->
<section class="border border-neutral-200 rounded overflow-hidden bg-white">
<div class="h-full min-h-[60vh] md:min-h-[400px]">
<IframeCarteAEP />
<EmbedDynamique client:visible />
</div>
<ScrollArticles />
</section>
</div>

View File

@@ -1,72 +0,0 @@
---
// PC4 - Liste articles Substack en scroll sous l'iframe carte.
// V1 placeholder data en dur ; PC6 (journal n8n) remplacera par fetch journal.json filtre tag #politique.
const articles = [
{
date: '2026-04-28',
titre: 'Cap sur l\'autonomie : retour sur 6 mois de chantier',
url: 'https://transformations.substack.com/p/cap-autonomie',
},
{
date: '2026-04-15',
titre: 'Le commun comme infrastructure',
url: 'https://transformations.substack.com/p/commun-infrastructure',
},
{
date: '2026-03-30',
titre: 'Architecte ou operateur de bifurcation ?',
url: 'https://transformations.substack.com/p/architecte-bifurcation',
},
{
date: '2026-03-12',
titre: 'Reseaux AEP : pourquoi la coordination est politique',
url: 'https://transformations.substack.com/p/aep-coordination',
},
{
date: '2026-02-26',
titre: 'Sortir du sauveur, entrer dans le compagnon',
url: 'https://transformations.substack.com/p/sauveur-compagnon',
},
{
date: '2026-02-08',
titre: 'Petit manifeste contre l\'expert isole',
url: 'https://transformations.substack.com/p/contre-expert-isole',
},
{
date: '2026-01-22',
titre: 'Ce que la commande publique fait a la pensee',
url: 'https://transformations.substack.com/p/commande-publique',
},
// TODO PC6 : remplacer par fetch journal.json filtre tag #politique.
];
---
<section class="border-t border-neutral-200 py-6 px-4 bg-white">
<h3 class="text-sm font-semibold uppercase tracking-wider text-neutral-500 mb-4">
Derniers articles ; Substack
</h3>
<ul class="space-y-3">
{articles.map(({ date, titre, url }) => (
<li>
<a
href={url}
target="_blank"
rel="noopener"
class="block group"
>
<time class="text-xs text-neutral-400">{date}</time>
<p class="text-sm text-neutral-800 group-hover:text-neutral-600 transition-colors leading-snug">
{titre}
</p>
</a>
</li>
))}
</ul>
<a
href="https://transformations.substack.com"
target="_blank"
rel="noopener"
class="inline-block mt-4 text-xs text-neutral-500 hover:text-neutral-900"
>
Voir tous les articles &rarr;
</a>
</section>