2026-07-24 23:57:37 -04:00
< 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." },
2026-07-25 00:31:39 -04:00
{ 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).' }
2026-07-24 23:57:37 -04:00
];
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" />
2026-07-27 19:11:59 +04:00
< img class = "hero__flag" src = "/img/gong-drapeau.svg" alt = "Drapo Gwadlup (GONG)" width = "220" height = "147" />
2026-07-24 23:57:37 -04:00
< 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 >
2026-07-25 00:54:29 -04:00
<!-- 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 }
2026-07-24 23:57:37 -04:00
<!-- 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 : 132 px ;
height : 132 px ;
margin : 0 auto var ( -- space -2 );
}
2026-07-27 18:15:07 +04:00
. hero__flag {
width : 220 px ;
height : 147 px ;
margin : 0 auto var ( -- space -2 );
}
2026-07-24 23:57:37 -04:00
. hero__kicker {
display : inline-flex ;
flex-direction : column ;
align-items : center ;
gap : 0.5 rem ;
font-family : var ( -- font - display );
text-transform : uppercase ;
letter-spacing : 0.15 em ;
font-size : 0.85 rem ;
color : var ( -- muted );
}
. hero__title {
font-size : clamp ( 3.5 rem , 2 rem + 9 vw , 8 rem );
margin : 0.25 rem 0 0 ;
letter-spacing : 0.02 em ;
}
. hero__full {
font-family : var ( -- font - display );
font-weight : 700 ;
text-transform : uppercase ;
font-size : clamp ( 1 rem , 0.9 rem + 0.6 vw , 1.3 rem );
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.3 rem , 1 rem + 1.6 vw , 2 rem );
line-height : 1.15 ;
color : var ( -- accent );
margin-bottom : 0.6 rem ;
}
. 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 ( 200 px , 1 fr ));
gap : var ( -- space -2 );
}
. stat {
background : var ( -- card - bg );
border : 1 px solid var ( -- line );
border-top : 3 px solid var ( -- accent );
border-radius : var ( -- radius - md );
padding : var ( -- space -3 );
display : flex ;
flex-direction : column ;
gap : 0.3 rem ;
}
. stat__num {
font-family : var ( -- font - display );
font-weight : 900 ;
font-size : 1.7 rem ;
color : var ( -- creme );
line-height : 1 ;
}
. stat__lab {
font-size : 0.88 rem ;
color : var ( -- muted );
}
. grid-cards {
display : grid ;
grid-template-columns : repeat ( auto - fit , minmax ( 280 px , 1 fr ));
gap : var ( -- space -3 );
}
. grid-cards--2 {
grid-template-columns : repeat ( auto - fit , minmax ( 320 px , 1 fr ));
}
. card h3 {
margin : 0.6 rem 0 0.4 rem ;
}
. card p {
color : var ( -- muted );
margin : 0 ;
}
. card . muted {
color : var ( -- muted );
}
. card__more {
margin-top : 0.8 rem ;
display : inline-flex ;
align-items : center ;
gap : 0.35 rem ;
font-family : var ( -- font - display );
text-transform : uppercase ;
font-size : 0.78 rem ;
letter-spacing : 0.05 em ;
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.8 rem ;
color : var ( -- muted - fort );
text-transform : uppercase ;
letter-spacing : 0.04 em ;
}
. card__actions {
display : flex ;
gap : 0.6 rem ;
flex-wrap : wrap ;
margin-top : 0.8 rem ;
}
. center {
text-align : center ;
}
. center . btn {
margin-inline : auto ;
}
. cta-final {
background : var ( -- noir - profond );
border-block : 1 px solid var ( -- line );
}
2026-07-25 00:54:29 -04:00
. archives-home {
background : var ( -- noir - profond );
border-block : 1 px solid var ( -- line );
}
. archives-home__intro {
color : var ( -- muted );
max-width : var ( -- container - lecture );
margin-top : -0.5 rem ;
margin-bottom : var ( -- space -3 );
}
. archives-home__grid {
display : grid ;
grid-template-columns : repeat ( auto - fit , minmax ( 200 px , 1 fr ));
gap : var ( -- space -3 );
margin-bottom : var ( -- space -3 );
}
. issue {
display : block ;
position : relative ;
border : 1 px 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 ( -4 px );
border-color : var ( -- accent );
}
. issue img {
width : 100 % ;
aspect-ratio : 800 / 612 ;
object-fit : cover ;
object-position : top ;
}
. issue__label {
display : block ;
padding : 0.5 rem 0.75 rem ;
font-family : var ( -- font - display );
font-weight : 700 ;
text-transform : uppercase ;
font-size : 0.78 rem ;
letter-spacing : 0.03 em ;
color : var ( -- accent );
border-top : 1 px solid var ( -- line );
}
2026-07-24 23:57:37 -04:00
</ style >