site-mva-global-fret/index.html
Serge RAKOTO HARRY-NAIVO 43e576249c chore(site): cache-bust translations.js (?v=20260603)
translations.js a Cache-Control max-age=7j sans versioning -> les visiteurs
gardaient l'ancien menu en cache. Cache-buster pour rendre le renommage
Contact->Inscription visible immédiatement par tous.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-03 11:32:13 +02:00

95 lines
3.5 KiB
HTML

<!DOCTYPE html>
<!--
Crédits :
- Modèle 3D « Airplane » par Poly by Google, CC-BY 3.0 — https://poly.pizza/m/a3XrQkLNna9
- Modèle 3D « Parachute » par Poly by Google, CC-BY 3.0 — https://poly.pizza/m/3Z7vJ96JIEB
- Licence : https://creativecommons.org/licenses/by/3.0/
-->
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MVA Global Fret — Bienvenue</title>
<meta name="description" content="MVA Global Fret — Le pont aérien entre Paris et Antananarivo.">
<link rel="icon" type="image/png" href="PNG MVA GLOBAL FRET.png">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@600;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
<link rel="stylesheet" href="css/parallax.css">
<!-- Three.js (ESM via importmap) + addons (GLTFLoader) -->
<script type="importmap">
{
"imports": {
"three": "https://cdn.jsdelivr.net/npm/three@0.158.0/build/three.module.js",
"three/addons/": "https://cdn.jsdelivr.net/npm/three@0.158.0/examples/jsm/"
}
}
</script>
</head>
<body class="parallax-body">
<header class="parallax-header">
<div class="parallax-logo" aria-label="MVA Global Fret">
<img src="PNG MVA GLOBAL FRET.png" alt="MVA Global Fret">
<span>MVA Global Fret</span>
</div>
<div class="lang-switcher" role="group" aria-label="Choisir la langue">
<button data-lang="fr" class="active">FR</button>
<button data-lang="en">EN</button>
<button data-lang="mg">MG</button>
</div>
</header>
<main class="stage">
<!-- Photo aérienne d'Antananarivo en fond -->
<img class="layer layer-bg" src="assets/antananarivo-bg.jpg" alt="" aria-hidden="true">
<!-- Voile très léger pour la lisibilité du bouton -->
<div class="layer layer-tint"></div>
<!-- Canvas Three.js : avion piloté par la souris -->
<canvas id="three-canvas" class="layer layer-three"></canvas>
<!-- Bouton CTA centré -->
<a href="accueil.html" class="cta-btn">
<span class="cta-btn-shine"></span>
<span data-i18n="intro.ctaBtn">Accéder au site</span>
<i class="fa-solid fa-arrow-right"></i>
</a>
</main>
<script src="js/translations.js?v=20260603"></script>
<script>
/* i18n minimal ------------------------------------------------------- */
(function () {
const lang = localStorage.getItem('mva-lang') || 'fr';
applyLang(lang);
document.querySelectorAll('.lang-switcher button').forEach(btn => {
btn.addEventListener('click', () => applyLang(btn.dataset.lang));
});
function applyLang(l) {
document.documentElement.lang = l;
localStorage.setItem('mva-lang', l);
document.querySelectorAll('.lang-switcher button').forEach(b =>
b.classList.toggle('active', b.dataset.lang === l)
);
const t = window.translations?.[l];
if (!t) return;
document.querySelectorAll('[data-i18n]').forEach(el => {
const keys = el.dataset.i18n.split('.');
let v = t;
for (const k of keys) v = v?.[k];
if (v != null) el.textContent = v;
});
}
})();
</script>
<script type="module" src="js/intro-scene.js"></script>
</body>
</html>