407 lines
12 KiB
Svelte
407 lines
12 KiB
Svelte
<script lang="ts">
|
||
import Seo from '$lib/components/Seo.svelte';
|
||
import Resume from '$lib/components/Resume.svelte';
|
||
import SectionTitle from '$lib/components/SectionTitle.svelte';
|
||
import Icon from '$lib/components/Icon.svelte';
|
||
import { reveal } from '$lib/motion/reveal';
|
||
import { SITE, presentation } from '$lib/data/gong';
|
||
|
||
let { data } = $props();
|
||
|
||
const parcours = [
|
||
{ href: '/histoire/', icon: 'clock', titre: 'Histoire', desc: 'De la fondation en 1963 à la dissolution en 1968 : la chronologie complète.' },
|
||
{ href: '/me-67/', icon: 'flag', titre: 'Mé 67', desc: "Les tueries de mai 1967 à Pointe-à-Pitre, longtemps occultées." },
|
||
{ href: '/proces-1968/', icon: 'scale', titre: 'Procès de 1968', desc: '18 Guadeloupéens jugés à Paris ; Sartre et Césaire témoignent.' },
|
||
{ href: '/militants/', icon: 'users', titre: 'Militants', desc: 'Sainton, Nestor, Manville, Bangou, Glaude… les femmes et les hommes du GONG.' },
|
||
{ href: '/ideologie/', icon: 'glo', titre: 'Idéologie', desc: "Marxisme-léninisme, tiers-mondisme et lutte de libération nationale." },
|
||
{ href: '/heritage/', icon: 'memory', titre: 'Héritage', desc: 'UPLG, UGTG, mémoire de Mé 67 : ce que le GONG a laissé.' },
|
||
{ href: '/archives/', icon: 'book', titre: 'Archives', desc: 'Les numéros numérisés du journal Gong-Information (1966-1967).' }
|
||
];
|
||
|
||
const webPage = [
|
||
{
|
||
'@type': 'WebPage',
|
||
'@id': `${SITE.url}/#webpage`,
|
||
url: `${SITE.url}/`,
|
||
name: `${SITE.nomComplet} — GONG`,
|
||
description: SITE.description,
|
||
isPartOf: { '@id': `${SITE.url}/#website` },
|
||
about: { '@id': `${SITE.url}/#organization` },
|
||
inLanguage: 'fr-FR'
|
||
}
|
||
];
|
||
</script>
|
||
|
||
<Seo
|
||
title="GONG — Groupe d'Organisation Nationale de la Guadeloupe"
|
||
description="Le GONG, organisation indépendantiste guadeloupéenne (1963-1968) : histoire, Mé 67, procès de 1968, militants et héritage. Un dossier documentaire sourcé."
|
||
path="/"
|
||
graph={webPage}
|
||
/>
|
||
|
||
<main id="contenu">
|
||
<!-- HERO -->
|
||
<section class="hero">
|
||
<div class="container hero__inner">
|
||
<img class="hero__logo" src="/img/gong.png" alt="Logo du GONG" width="132" height="132" />
|
||
<img class="hero__flag" src="/img/gong-drapeau.png" alt="Drapo Gwadlup (GONG)" width="220" height="147" />
|
||
<h1 class="hero__title">GONG</h1>
|
||
<p class="hero__full">{presentation.nomComplet}</p>
|
||
<p class="hero__slogan">« Briser les urnes colonialistes.<br />Conquérir l'indépendance nationale. »</p>
|
||
<p class="hero__creole" lang="gcf">Listwa a on pèp ki goumé pou libèté a-y.</p>
|
||
<div class="hero__cta">
|
||
<a class="btn btn--fill" href="/histoire/">Découvrir l'histoire</a>
|
||
<a class="btn" href="/me-67/">Comprendre Mé 67</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- RÉSUMÉ (zone A AI-Overview) -->
|
||
<section class="section--tight">
|
||
<div class="container lecture">
|
||
<Resume
|
||
titre="Qu'est-ce que le GONG ?"
|
||
lead="Le GONG (Groupe d'Organisation Nationale de la Guadeloupe) était une organisation politique indépendantiste et anticolonialiste guadeloupéenne, fondée le 23 juin 1963 à Paris et dissoute de facto en 1968 après la répression des émeutes de mai 1967 et le procès de ses militants."
|
||
points={[
|
||
'Fondé le 23 juin 1963 par d’anciens étudiants de l’AGEG (dont Pierre Sainton).',
|
||
'Objectif : l’indépendance nationale de la Guadeloupe et une révolution socialiste.',
|
||
'Impliqué dans les événements de « Mé 67 » (26-28 mai 1967).',
|
||
'18 de ses membres jugés à Paris en 1968 : 13 acquittés, 6 condamnés avec sursis.'
|
||
]}
|
||
/>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- CHIFFRES CLÉS -->
|
||
<section class="section--tight">
|
||
<div class="container">
|
||
<div class="stats">
|
||
<div class="stat" use:reveal={0}>
|
||
<span class="stat__num">1963</span><span class="stat__lab">Fondation, à Paris</span>
|
||
</div>
|
||
<div class="stat" use:reveal={1}>
|
||
<span class="stat__num">26 mai 1967</span><span class="stat__lab">Première victime : Jacques Nestor</span>
|
||
</div>
|
||
<div class="stat" use:reveal={2}>
|
||
<span class="stat__num">80–200</span><span class="stat__lab">Victimes estimées de Mé 67</span>
|
||
</div>
|
||
<div class="stat" use:reveal={3}>
|
||
<span class="stat__num">18</span><span class="stat__lab">Accusés au procès de 1968</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- PARCOURS -->
|
||
<section class="section">
|
||
<div class="container">
|
||
<SectionTitle title="Parcourir le dossier" />
|
||
<div class="grid-cards">
|
||
{#each parcours as p, i (p.href)}
|
||
<a class="card card--link" href={p.href} use:reveal={i}>
|
||
<Icon name={p.icon} size="1.8rem" />
|
||
<h3>{p.titre}</h3>
|
||
<p>{p.desc}</p>
|
||
<span class="card__more">Lire <Icon name="arrow-right" size="1em" /></span>
|
||
</a>
|
||
{/each}
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- DOCUMENTS FONDATEURS -->
|
||
<section class="section">
|
||
<div class="container">
|
||
<SectionTitle title="Les textes fondateurs" />
|
||
<div class="grid-cards grid-cards--2">
|
||
<article class="card card--vert" use:reveal={0}>
|
||
<Icon name="document" size="1.6rem" />
|
||
<h3>La Charte du GONG</h3>
|
||
<p class="muted">Juin 1963 — le texte adopté en assemblée générale qui pose le droit du peuple guadeloupéen à disposer de lui-même.</p>
|
||
<div class="card__actions">
|
||
<a class="btn btn--ghost" href="/charte/">Lire la charte</a>
|
||
<a class="btn btn--ghost" href="/assets/charte-du-gong-1963.pdf" rel="external noopener noreferrer" target="_blank">
|
||
PDF <Icon name="download" size="1em" />
|
||
</a>
|
||
</div>
|
||
</article>
|
||
<article class="card card--vert" use:reveal={1}>
|
||
<Icon name="document" size="1.6rem" />
|
||
<h3>Orientation & stratégie</h3>
|
||
<p class="muted">Le rapport sur la lutte révolutionnaire du peuple guadeloupéen : lutte de masse, suffrage universel, voie révolutionnaire.</p>
|
||
<div class="card__actions">
|
||
<a class="btn btn--ghost" href="/orientation/">Lire le document</a>
|
||
<a class="btn btn--ghost" href="/assets/orientation-et-strategie-de-la-lutte-revolutionnaire-du-peuple-guadeloupeen-1963.pdf" rel="external noopener noreferrer" target="_blank">
|
||
PDF <Icon name="download" size="1em" />
|
||
</a>
|
||
</div>
|
||
</article>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ARCHIVES — GONG-INFORMATION -->
|
||
{#if data.archives.length}
|
||
<section class="section archives-home">
|
||
<div class="container">
|
||
<SectionTitle title="Les documents originaux" />
|
||
<p class="archives-home__intro">
|
||
Les numéros numérisés de <strong>Gong-Information</strong>, le journal du GONG (1966-1967) :
|
||
transcription intégrale et scan à l'appui.
|
||
</p>
|
||
<div class="archives-home__grid">
|
||
{#each data.archives as a, i (a.slug)}
|
||
<a class="issue" href="/archives/{a.slug}/" use:reveal={i}>
|
||
<img src={a.couverture} alt="Couverture de {a.titre}" width="800" height="612" loading="lazy" decoding="async" />
|
||
<span class="issue__label">{a.numero} · {a.date}</span>
|
||
</a>
|
||
{/each}
|
||
</div>
|
||
<p class="center"><a class="btn btn--ghost" href="/archives/">Toutes les archives</a></p>
|
||
</div>
|
||
</section>
|
||
{/if}
|
||
|
||
<!-- ACTUALITÉS -->
|
||
{#if data.actualites.length}
|
||
<section class="section">
|
||
<div class="container">
|
||
<SectionTitle title="Actualités & mémoire" />
|
||
<div class="grid-cards">
|
||
{#each data.actualites as a, i (a.slug)}
|
||
<a class="card card--link" href="/actualites/{a.slug}/" use:reveal={i}>
|
||
{#if a.couverture}
|
||
<img class="card__cover" src={a.couverture} alt={a.couvertureAlt} loading="lazy" decoding="async" />
|
||
{/if}
|
||
<time datetime={a.iso} class="card__date">{a.date}</time>
|
||
<h3>{a.titre}</h3>
|
||
<p class="muted">{a.chapeau}</p>
|
||
</a>
|
||
{/each}
|
||
</div>
|
||
<p class="center"><a class="btn btn--ghost" href="/actualites/">Toutes les actualités</a></p>
|
||
</div>
|
||
</section>
|
||
{/if}
|
||
|
||
<!-- CTA FINAL -->
|
||
<section class="section cta-final">
|
||
<div class="container lecture center">
|
||
<SectionTitle title="Se souvenir, transmettre" />
|
||
<p>
|
||
Le GONG a été effacé des mémoires officielles pendant des décennies. Ce site rassemble des
|
||
sources académiques, journalistiques et archivistiques pour rendre son histoire accessible à
|
||
tous.
|
||
</p>
|
||
<div class="hero__cta center-cta">
|
||
<a class="btn btn--fill" href="/faq/">Questions fréquentes</a>
|
||
<a class="btn" href="/sources/">Voir les sources</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<style>
|
||
.hero {
|
||
text-align: center;
|
||
padding-top: var(--space-5);
|
||
background: radial-gradient(ellipse at 50% -10%, color-mix(in srgb, var(--rouge-gong) 12%, transparent), transparent 60%);
|
||
}
|
||
.hero__inner {
|
||
padding-bottom: var(--space-5);
|
||
}
|
||
.hero__logo {
|
||
width: 132px;
|
||
height: 132px;
|
||
margin: 0 auto var(--space-2);
|
||
}
|
||
.hero__flag {
|
||
width: 220px;
|
||
height: 147px;
|
||
margin: 0 auto var(--space-2);
|
||
}
|
||
.hero__kicker {
|
||
display: inline-flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
font-family: var(--font-display);
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.15em;
|
||
font-size: 0.85rem;
|
||
color: var(--muted);
|
||
}
|
||
.hero__title {
|
||
font-size: clamp(3.5rem, 2rem + 9vw, 8rem);
|
||
margin: 0.25rem 0 0;
|
||
letter-spacing: 0.02em;
|
||
}
|
||
.hero__full {
|
||
font-family: var(--font-display);
|
||
font-weight: 700;
|
||
text-transform: uppercase;
|
||
font-size: clamp(1rem, 0.9rem + 0.6vw, 1.3rem);
|
||
color: var(--creme);
|
||
margin-bottom: var(--space-3);
|
||
}
|
||
.hero__slogan {
|
||
font-family: var(--font-display);
|
||
font-weight: 800;
|
||
text-transform: uppercase;
|
||
font-size: clamp(1.3rem, 1rem + 1.6vw, 2rem);
|
||
line-height: 1.15;
|
||
color: var(--accent);
|
||
margin-bottom: 0.6rem;
|
||
}
|
||
.hero__creole {
|
||
color: var(--muted);
|
||
font-style: italic;
|
||
margin-bottom: var(--space-4);
|
||
}
|
||
.hero__cta {
|
||
display: flex;
|
||
gap: var(--space-2);
|
||
justify-content: center;
|
||
flex-wrap: wrap;
|
||
}
|
||
.center-cta {
|
||
margin-top: var(--space-3);
|
||
}
|
||
|
||
.stats {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||
gap: var(--space-2);
|
||
}
|
||
.stat {
|
||
background: var(--card-bg);
|
||
border: 1px solid var(--line);
|
||
border-top: 3px solid var(--accent);
|
||
border-radius: var(--radius-md);
|
||
padding: var(--space-3);
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.3rem;
|
||
}
|
||
.stat__num {
|
||
font-family: var(--font-display);
|
||
font-weight: 900;
|
||
font-size: 1.7rem;
|
||
color: var(--creme);
|
||
line-height: 1;
|
||
}
|
||
.stat__lab {
|
||
font-size: 0.88rem;
|
||
color: var(--muted);
|
||
}
|
||
|
||
.grid-cards {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||
gap: var(--space-3);
|
||
}
|
||
.grid-cards--2 {
|
||
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
|
||
}
|
||
.card h3 {
|
||
margin: 0.6rem 0 0.4rem;
|
||
}
|
||
.card p {
|
||
color: var(--muted);
|
||
margin: 0;
|
||
}
|
||
.card .muted {
|
||
color: var(--muted);
|
||
}
|
||
.card__more {
|
||
margin-top: 0.8rem;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.35rem;
|
||
font-family: var(--font-display);
|
||
text-transform: uppercase;
|
||
font-size: 0.78rem;
|
||
letter-spacing: 0.05em;
|
||
color: var(--accent);
|
||
}
|
||
.card__cover {
|
||
width: calc(100% + 2 * var(--space-3));
|
||
margin: calc(-1 * var(--space-3)) calc(-1 * var(--space-3)) var(--space-2);
|
||
border-radius: var(--radius-md) var(--radius-md) 0 0;
|
||
aspect-ratio: 3 / 2;
|
||
object-fit: cover;
|
||
}
|
||
.card__date {
|
||
font-size: 0.8rem;
|
||
color: var(--muted-fort);
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.04em;
|
||
}
|
||
.card__actions {
|
||
display: flex;
|
||
gap: 0.6rem;
|
||
flex-wrap: wrap;
|
||
margin-top: 0.8rem;
|
||
}
|
||
|
||
.center {
|
||
text-align: center;
|
||
}
|
||
.center .btn {
|
||
margin-inline: auto;
|
||
}
|
||
.cta-final {
|
||
background: var(--noir-profond);
|
||
border-block: 1px solid var(--line);
|
||
}
|
||
|
||
.archives-home {
|
||
background: var(--noir-profond);
|
||
border-block: 1px solid var(--line);
|
||
}
|
||
.archives-home__intro {
|
||
color: var(--muted);
|
||
max-width: var(--container-lecture);
|
||
margin-top: -0.5rem;
|
||
margin-bottom: var(--space-3);
|
||
}
|
||
.archives-home__grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||
gap: var(--space-3);
|
||
margin-bottom: var(--space-3);
|
||
}
|
||
.issue {
|
||
display: block;
|
||
position: relative;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius-md);
|
||
overflow: hidden;
|
||
background: var(--noir);
|
||
transition:
|
||
transform var(--dur-mesure) var(--ease-ka),
|
||
border-color var(--dur-mesure) var(--ease-ka);
|
||
}
|
||
.issue:hover {
|
||
transform: translateY(-4px);
|
||
border-color: var(--accent);
|
||
}
|
||
.issue img {
|
||
width: 100%;
|
||
aspect-ratio: 800 / 612;
|
||
object-fit: cover;
|
||
object-position: top;
|
||
}
|
||
.issue__label {
|
||
display: block;
|
||
padding: 0.5rem 0.75rem;
|
||
font-family: var(--font-display);
|
||
font-weight: 700;
|
||
text-transform: uppercase;
|
||
font-size: 0.78rem;
|
||
letter-spacing: 0.03em;
|
||
color: var(--accent);
|
||
border-top: 1px solid var(--line);
|
||
}
|
||
</style>
|