feat: migre le site vers SvelteKit (Svelte 5, statique, zéro tiers)

- Rebuild complet SvelteKit 2 + Svelte 5 runes + TypeScript, adapter-static - Images self-hébergées optimisées au build (vite-imagetools), fonts Archivo/Inter en woff2 local — BunnyCDN et Google Fonts supprimés (corrige les 403 d'images) - Tokens charte OKI, thème sombre par défaut / clair opt-in, zéro emoji (set SVG) - Motion : KineticText (stagger syncopé gwoka), ScrollProgressBar, View Transitions - Village SVG isométrique pour les services hébergés + fallback accessible - PWA (manifest + SW hors-ligne), 404 en KA, CSP nettoyée (.htaccess + _headers) - Lighthouse mobile : 91/100/100/100 — JS initial 67 Ko gzip
2026-07-21 08:00:16 -04:00
parent d0fc7207f2
commit d0d80a105e
175 changed files with 15603 additions and 5911 deletions
@@ -1,186 +1,70 @@
-# o-k-i.net V2
+# o-k-i.net

-Site web officiel de **ORGANISATION KA INTERNATIONALE (OKI)** - Version 2 construite avec 11ty (Eleventy).
+Site web officiel de **ORGANISATION KA INTERNATIONALE (OKI)** — « Le numérique au service de vos luttes ».
+
+Version 3, reconstruite avec **SvelteKit + Svelte 5 (runes) + TypeScript**, entièrement pré-rendue en statique (`adapter-static`). L'ancienne version Eleventy est conservée sur la branche `main`.

 ## À propos

-**Et si on prenait le contrôle ensemble ?**
-
-ORGANISATION KA INTERNATIONALE (OKI) construit un internet différent : un espace où nos langues ont leur place, où nos données nous appartiennent vraiment, et où nos communautés se connectent sur des plateformes qu'on contrôle collectivement.
-
-Pas aux GAFAM qui en font leur business. Pas d'algorithmes aveugles, pas de censure arbitraire. O-K-I propose un accompagnement pour les créateurs de contenu, les associations et collectifs qui veulent passer aux alternatives libres et éthiques.
+ORGANISATION KA INTERNATIONALE (OKI) construit un internet différent : un espace où nos langues ont leur place, où nos données nous appartiennent vraiment, et où nos communautés se connectent sur des plateformes qu'on contrôle collectivement. Applis web sur mesure à tarifs solidaires pour associations, collectifs et organisations militantes.

 ## Technologies

- **11ty (Eleventy)** - Générateur de site statique
- **Nunjucks** - Moteur de templates
- **CSS personnalisé** - Sans framework
- **JavaScript Vanilla** - Interactions et animations
- **Apache `.htaccess`** - Headers de sécurité et redirection HTTPS
-
-## Structure du projet
-
-```
-o-k-i.net-V2/
-├── src/
-│   ├── _data/              # Données JSON (services, projets, valeurs, etc.)
-│   │   └── i18n/           # Fichiers de traduction FR/EN
-│   ├── _includes/
-│   │   ├── layouts/        # Layouts de base
-│   │   └── partials/       # Composants réutilisables
-│   ├── assets/
-│   │   ├── css/            # Feuilles de style
-│   │   ├── js/             # Scripts JavaScript
-│   │   └── images/         # Images (logos, clients, etc.)
-│   ├── .htaccess           # Headers de sécurité et rewrite rules
-│   ├── index.njk           # Page d'accueil
-│   └── mentions-legales.njk
-├── _site/                  # Site généré (git ignoré)
-├── eleventy.config.js      # Configuration 11ty
-└── package.json
-```
-
-## Installation
-
-```bash
-# Cloner le dépôt
-git clone https://labola.o-k-i.net/ORGANISATION-KA-INTERNATIONALE/o-k-i.net.git
-cd o-k-i.net
-
-# Installer les dépendances
-npm install
-```
+- **SvelteKit 2 / Svelte 5** — composants en runes, TypeScript strict
+- **adapter-static** — pré-rendu intégral, aucun serveur Node requis
+- **vite-imagetools** — images AVIF/WebP responsives générées au build
+- **vite-plugin-pwa** — service worker + shell hors-ligne
+- **CSS vanilla** — tokens de la charte OKI (`src/lib/styles/oki-tokens.css`), aucun framework
+- **Polices self-hébergées** — Archivo (600-900) et Inter (400-800) en woff2 (`static/fonts/`)
+- **Zéro service tiers** — aucune requête vers un CDN, Google Fonts ou autre domaine externe

 ## Développement

 ```bash
-# Lancer le serveur de développement avec hot reload
-npm start
-
-# Le site sera disponible sur http://localhost:8080
+npm install
+npm run dev        # serveur de développement
+npm run build      # build de production → build/
+npm run preview    # prévisualisation du build
+npm run check      # svelte-check (types + a11y)
 ```

-## Build de production
+## Structure

-```bash
-# Générer le site statique
-npm run build
-
-# Les fichiers seront dans le dossier _site/
+```
+src/
+  app.html                 # coquille HTML (thème anti-FOUC, fonts, manifest)
+  hooks.server.ts          # attribut lang fr/en selon la route
+  lib/
+    styles/                # oki-tokens.css (charte), base.css (primitives)
+    i18n/                  # bundles FR/EN (contenu éditorial, repris de la V2)
+    assets/images/         # sources images (optimisées au build)
+    components/            # Seo, Nav, Footer, sections/, motion/, icons/
+    motion/tokens.ts       # gate reduced-motion, stagger syncopé gwoka
+  routes/
+    +layout.svelte         # skip-link, ScrollProgressBar, Nav, Footer, View Transitions
+    +page.svelte           # accueil FR        en/+page.svelte    # accueil EN
+    dons/                  # dons FR           en/donate/         # dons EN
+    presse/                # presse FR         en/press/          # presse EN
+    mentions-legales/      # légal FR          en/legal-notice/   # légal EN
+    offline/               # page hors-ligne (cible navigateFallback du SW)
+    +error.svelte          # 404/erreurs designée (microcopy KA)
+static/
+  fonts/ icons.svg images/ assets/press/ theme.js lang-redirect.js
+  manifest.webmanifest 404.html robots.txt sitemap.xml _headers .htaccess
 ```

-## Personnalisation
+## Internationalisation

-### Modifier les données
+FR par défaut, EN sous `/en/`. Les bundles JSON de `src/lib/i18n/{fr,en}/` alimentent les composants via `getBundle(locale)`. Les correspondances d'URLs FR↔EN (hreflang, bascule de langue) sont dans `alternatePath()` (`src/lib/i18n/index.ts`).

-Les données du site sont organisées dans `src/_data/i18n/fr/` et `src/_data/i18n/en/` :
+## Sécurité & déploiement

- `site.json` - Informations générales du site
- `services.json` - Services hébergés (BOKANTE, GADE, NIYAJ, KUTE)
- `projects.json` - Projets web (PAWOL.NU, GONG.GP, FEDIVERSE.OKI)
- `partners.json` - Partenaires (Joukawouvè, cyber-mawonaj, Aktivist Vybz #AKV)
- `clients.json` - Clients / organisations ayant fait confiance à OKI
- `values.json` - Valeurs de l'organisation
- `contact.json` - Informations de contact (groupées par section)
- `navigation.json` - Liens de navigation
+Headers de sécurité (CSP stricte `default-src 'self'`, HSTS, `X-Frame-Options: DENY`, `nosniff`, `Referrer-Policy`, `Permissions-Policy`) livrés en deux formats : `static/.htaccess` (Apache/o2switch) et `static/_headers` (Cloudflare Pages). Voir **DEPLOY.md**.

-### Images et CDN
+## Charte

-Les images locales placées dans `src/assets/images/` sont automatiquement copiées dans `_site/assets/images/`. Le filtre `| cdn` appliqué dans les templates préfixe les chemins commençant par `/` avec l'URL du pull zone BunnyCDN définie dans `src/_data/cdn.json`.
-
-### Modifier les styles
-
-Les styles sont dans `src/assets/css/styles.css`. La charte graphique est basée sur les couleurs du logo officiel d'OKI :
-
-```css
-:root {
-    /* Couleurs du logo OKI */
-    --or-oki: #E8A625;           /* Orange/Or du logo */
-    --noir-oki: #000000;          /* Noir du logo */
-    --vert-oki: #00A854;          /* Vert émeraude du logo */
-    --rouge-oki: #ED1C4C;         /* Rouge/Rose du logo */
-    --blanc-creme: #F7F7F2;       /* Blanc crème */
-
-    /* Couleurs dérivées pour le design */
-    --noir-profond: #1A1A1A;
-    --gris-sombre: #2A2A2A;
-    --or-clair: #F5BD4F;
-    --vert-clair: #00C569;
-    --rouge-clair: #FF2D5F;
-}
-```
-
-## Fonctionnalités
-
- ✅ Design responsive et moderne
- ✅ Bilingue FR/EN
- ✅ Animations fluides
- ✅ Navigation mobile
- ✅ Scroll smooth
- ✅ Effets hover interactifs
- ✅ Easter egg Konami Code
- ✅ Performance optimisée
- ✅ Logo et favicon intégrés
- ✅ Charte graphique basée sur le logo officiel
- ✅ Headers de sécurité HTTP (CSP, HSTS, XFO, etc.)
- ✅ Redirection automatique HTTP → HTTPS
- ✅ Année du footer générée automatiquement
-
-### SEO & Référencement
- ✅ Meta tags Open Graph (Facebook, LinkedIn)
- ✅ Twitter / X Cards
- ✅ JSON-LD Structured Data (Schema.org)
- ✅ Sitemap.xml
- ✅ Robots.txt
- ✅ Balises canonical
- ✅ Hreflang FR/EN
- ✅ Meta description personnalisées
- ✅ Mots-clés pertinents
-
-## Sections du site
-
-1. **Hero** - Présentation de l'organisation avec accroche percutante
-2. **Solutions** - Segmentation par public (associations, entreprises, citoyens)
-3. **Services hébergés** - Alternatives libres (BOKANTE, GADE, NIYAJ, KUTE)
-4. **Projets Web** - Nos projets (PAWOL.NU, GONG.GP, FEDIVERSE.OKI)
-5. **Mission** - Valeurs et objectifs avec message anti-GAFAM
-6. **Hébergement** - Services d'hébergement et infrastructure
-7. **Support** - Options de dons (Stripe, Liberapay, Ko-fi)
-8. **Partenaires** - Joukawouvè, cyber-mawonaj, Aktivist Vybz #AKV
-9. **Ils nous ont fait confiance** - KA Ubuntu, KBM
-10. **FAQ** - Questions fréquentes avec storytelling sur le nom "Ka"
-11. **Engagement** - Appels à l'action
-12. **Contact** - Email, WhatsApp, Discord, chaînes PAWOL.NU, Labola
-
-## Contribution
-
-Les contributions sont les bienvenues ! N'hésitez pas à ouvrir une issue ou une pull request sur [Labola](https://labola.o-k-i.net/ORGANISATION-KA-INTERNATIONALE/o-k-i.net).
+Couleurs, typographie, motion (cadences gwoka), iconographie SVG (zéro emoji en interface) : voir `charte-oki-design-system.md`. Thème sombre par défaut, thème clair en opt-in persisté (`localStorage['oki-theme']`).

 ## Licence

-Ce projet est sous licence **GNU Affero General Public License v3.0 (AGPL-V3)**.
-
-La licence AGPL-V3 est une licence de logiciel libre qui garantit :
- La liberté d'utiliser le logiciel à toute fin
- La liberté d'étudier et de modifier le code source
- La liberté de redistribuer des copies
- L'obligation de partager les modifications sous la même licence
- L'obligation de fournir le code source aux utilisateurs du service en ligne
-
-Voir le fichier [LICENSE](LICENSE) pour plus de détails ou consultez : https://www.gnu.org/licenses/agpl-3.0.html
-
-© 2026 ORGANISATION KA INTERNATIONALE
-
-## Liens
-
- 🌐 [Site web](https://o-k-i.net)
- 📺 [GADE (PeerTube)](https://gade.o-k-i.net/)
- 🐘 [BOKANTE (Mastodon)](https://bokante.o-k-i.net/)
- ☁️ [NIYAJ (Nextcloud)](https://niyaj.o-k-i.net/)
- 🎙️ [KUTE (Castopod)](https://kute.o-k-i.net/)
- 💬 [Discord](https://discord.gg/DPvUCA8dD)
- 📱 [WhatsApp](https://wa.me/262692229740)
- 📢 [Chaîne WhatsApp PAWOL.NU](https://whatsapp.com/channel/0029VbCv7N9AjPXTxygrRu1w)
- ✈️ [Chaîne Telegram PAWOL.NU](https://t.me/OrganisationKA)
- 💻 [Labola (Gitea)](https://labola.o-k-i.net/ORGANISATION-KA-INTERNATIONALE)
- 📧 kontak@o-k-i.net
+AGPL-3.0 — voir `LICENSE`.