app: refonte JWE v2 - SvelteKit 2 + Svelte 5 + MapLibre, 4 modes de jeu, API anti-triche, ecran Cas B 'Pwen blinde', i18n FR/GCF, PWA

2026-07-16 21:05:22 -04:00
parent ee85a10e20
commit 923fa2869f
38 changed files with 8570 additions and 0 deletions
@@ -0,0 +1,82 @@
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import '$lib/styles/oki.css';
+	import LangSwitch from '$lib/components/LangSwitch.svelte';
+	import { initLang, t } from '$lib/i18n/store.svelte';
+
+	let { children } = $props();
+
+	onMount(() => {
+		initLang();
+	});
+</script>
+
+<div class="app">
+	<header class="entete">
+		<a href="/" class="logo" aria-label="JWE — accueil">
+			<svg viewBox="0 0 32 32" width="30" height="30" aria-hidden="true">
+				<circle cx="16" cy="16" r="14" fill="none" stroke="currentColor" stroke-width="2.5" />
+				<path d="M16 7 L21 22 L16 18.5 L11 22 Z" fill="currentColor" />
+			</svg>
+			<span>{t().app.titre}</span>
+		</a>
+		<nav class="nav-lang">
+			<a href="/explorer" class="lien-explorer">{t().modes.explorer}</a>
+			<LangSwitch />
+		</nav>
+	</header>
+	<main>
+		{@render children()}
+	</main>
+</div>
+
+<style>
+	.app {
+		min-height: 100dvh;
+		display: flex;
+		flex-direction: column;
+	}
+
+	.entete {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 0.6rem 1rem;
+		background: var(--oki-vert);
+		color: #fff;
+	}
+
+	.logo {
+		display: inline-flex;
+		align-items: center;
+		gap: 0.5rem;
+		color: #fff;
+		text-decoration: none;
+		font-size: 1.4rem;
+		font-weight: 800;
+		letter-spacing: 0.04em;
+	}
+
+	.nav-lang {
+		display: flex;
+		align-items: center;
+		gap: 0.8rem;
+	}
+
+	.lien-explorer {
+		color: var(--oki-vert-doux);
+		text-decoration: none;
+		font-weight: 600;
+		font-size: 0.95rem;
+	}
+
+	.lien-explorer:hover {
+		color: #fff;
+	}
+
+	main {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+	}
+</style>