Paillasse/design/_backup-ludique/apercu-maison.html

147 lines
26 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ressources à la maison · Paillasse</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Archivo:wght@500;700;800;900&family=IBM+Plex+Mono:wght@400;600&display=swap" rel="stylesheet">
<script src="https://cdn.tailwindcss.com"></script>
<script>tailwind.config={theme:{extend:{fontFamily:{display:['Archivo','system-ui','sans-serif'],mono:['"IBM Plex Mono"','monospace']}}}}</script>
<style>
.etoile { clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }
.zigzag { background: linear-gradient(135deg, transparent 50%, #000 50% 62%, transparent 62%) 0 0 / 16px 16px, linear-gradient(45deg, transparent 50%, #000 50% 62%, transparent 62%) 0 0 / 16px 16px; }
@keyframes flotte { 0%,100% { transform: translateY(0) rotate(var(--r, 0deg)); } 50% { transform: translateY(-10px) rotate(var(--r, 0deg)); } }
.flotte { animation: flotte 6s ease-in-out infinite; }
@keyframes clignote { 50% { opacity: 0; } }
.curseur { animation: clignote 1s steps(1) infinite; }
@media (prefers-reduced-motion: reduce) { .flotte, .curseur { animation: none; } }
</style>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@xterm/xterm@5.5.0/css/xterm.css">
<script defer src="https://cdn.jsdelivr.net/npm/@xterm/xterm@5.5.0/lib/xterm.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/@xterm/addon-fit@0.10.0/lib/addon-fit.min.js"></script>
<script defer src="js/paillasse-terminal.js"></script>
</head>
<body class="bg-white font-display text-black antialiased">
<header class="border-b-4 border-black">
<nav class="relative mx-auto flex max-w-[1600px] flex-wrap items-center justify-between gap-x-6 gap-y-4 px-5 py-5 lg:px-8 2xl:flex-nowrap" aria-label="Navigation principale">
<a href="Apercu%20accueil%20Blade.html" class="flex items-center gap-3 text-2xl font-black tracking-tight">
<span class="relative inline-flex h-10 w-12 items-end" aria-hidden="true"><span class="absolute left-2 top-0 h-6 w-4 -rotate-6 border-2 border-black bg-[#7CF2C0]"></span><span class="absolute right-1 top-1 h-5 w-5 rounded-full border-2 border-black bg-[#FF6FB5]"></span><span class="relative h-3 w-full border-2 border-black bg-[#FFD23F] shadow-[3px_3px_0px_#000000]"></span></span>
Paillasse
</a>
<ul class="order-last flex w-full flex-wrap items-center gap-x-6 gap-y-2 whitespace-nowrap text-base font-bold md:flex-nowrap md:gap-x-8 2xl:order-none 2xl:w-auto 2xl:flex-1 2xl:justify-center">
<li><a href="apercu-fonctionnalites.html" class="border-2 border-transparent px-1 underline-offset-4 hover:underline aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F] aria-[current=page]:no-underline">Fonctionnalités</a></li>
<li>
<details class="group">
<summary class="flex cursor-pointer list-none items-center gap-1 border-2 border-transparent px-1 hover:underline group-open:border-black group-open:bg-[#FFD23F] [&::-webkit-details-marker]:hidden">Ressources <span aria-hidden="true" class="transition-transform group-open:rotate-180">▾</span></summary>
<div class="absolute inset-x-5 top-full z-50 mx-auto max-h-[80vh] max-w-[880px] overflow-y-auto border-4 border-black bg-white shadow-[8px_8px_0px_#000000] lg:inset-x-8">
<div class="grid gap-x-4 gap-y-6 p-5 sm:grid-cols-2 lg:grid-cols-4">
<div><p class="flex items-center gap-2 border-b-2 border-black pb-2 font-mono text-xs font-semibold uppercase tracking-wider"><span class="h-3 w-3 border-2 border-black" style="background:#FFD23F"></span>Espaces</p><ul class="mt-2 grid gap-0.5"><li><a href="apercu-cockpit.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Cockpit prof</a></li><li><a href="apercu-espace-eleve.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Espace élève</a></li><li><a href="apercu-vie-scolaire.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Vie scolaire</a></li><li><a href="apercu-academie.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Académie</a></li></ul></div>
<div><p class="flex items-center gap-2 border-b-2 border-black pb-2 font-mono text-xs font-semibold uppercase tracking-wider"><span class="h-3 w-3 border-2 border-black" style="background:#7CF2C0"></span>Apprendre</p><ul class="mt-2 grid gap-0.5"><li><a href="apercu-cours.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Cours gratuits</a></li><li><a href="apercu-labs.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Labs sur VM</a></li><li><a href="apercu-lab-web.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Lab web</a></li><li><a href="apercu-ide.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">IDE en ligne</a></li><li><a href="apercu-maison.html" aria-current="page" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Ressources à la maison</a></li></ul></div>
<div><p class="flex items-center gap-2 border-b-2 border-black pb-2 font-mono text-xs font-semibold uppercase tracking-wider"><span class="h-3 w-3 border-2 border-black" style="background:#C4B5FD"></span>Préparer</p><ul class="mt-2 grid gap-0.5"><li><a href="apercu-bibliotheque.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Bibliothèque du prof</a></li><li><a href="apercu-banque.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Banque de sujets</a></li><li><a href="apercu-generateur.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Générateur de TD</a></li><li><a href="apercu-td-imprimable.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">TD à imprimer</a></li><li><a href="apercu-quiz-projection.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Quiz flash</a></li></ul></div>
<div><p class="flex items-center gap-2 border-b-2 border-black pb-2 font-mono text-xs font-semibold uppercase tracking-wider"><span class="h-3 w-3 border-2 border-black" style="background:#FF6FB5"></span>Évaluer et suivre</p><ul class="mt-2 grid gap-0.5"><li><a href="apercu-sujet.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Créer un sujet</a></li><li><a href="apercu-devoirs.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Devoirs maison</a></li><li><a href="apercu-correction.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Correction assistée</a></li><li><a href="apercu-fiche-eleve.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Fiche élève</a></li><li><a href="apercu-messagerie.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Messagerie</a></li><li><a href="apercu-export.html" class="block border-2 border-transparent px-2 py-1.5 text-[15px] font-bold hover:border-black aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F]">Export Pronote / ENT</a></li></ul></div>
</div>
<div class="flex flex-wrap items-center justify-between gap-3 border-t-4 border-black bg-[#FFFBEA] px-5 py-3"><p class="text-sm font-semibold">Vous débutez ? Tout est expliqué en vidéo.</p><a href="apercu-aide.html" class="border-2 border-black bg-white px-3 py-1 text-sm font-extrabold hover:bg-black hover:text-white">Aide et tutoriels →</a></div>
</div>
</details>
</li>
<li><a href="apercu-etablissements.html" class="border-2 border-transparent px-1 underline-offset-4 hover:underline aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F] aria-[current=page]:no-underline">Établissements</a></li>
<li><a href="apercu-tarifs.html" class="border-2 border-transparent px-1 underline-offset-4 hover:underline aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F] aria-[current=page]:no-underline">Tarifs</a></li>
<li><a href="apercu-pourquoi.html" class="border-2 border-transparent px-1 underline-offset-4 hover:underline aria-[current=page]:border-black aria-[current=page]:bg-[#FFD23F] aria-[current=page]:no-underline">Pourquoi ce projet ?</a></li>
</ul>
<div class="mr-4 flex shrink-0 items-center gap-8">
<a href="apercu-connexion.html" class="inline-flex h-12 min-w-[12rem] items-center border-2 border-black bg-white px-6 font-bold shadow-[4px_4px_0px_#000000] transition-transform hover:-translate-x-0.5 hover:-translate-y-0.5 hover:bg-[#FFD23F] hover:shadow-[6px_6px_0px_#000000] active:translate-x-1 active:translate-y-1 active:shadow-none">Se connecter</a>
<a href="apercu-inscription.html" class="relative inline-flex h-12 min-w-[12rem] items-center border-2 border-black bg-[#ec3013] px-6 font-bold text-white shadow-[4px_4px_0px_#000000] transition-transform hover:-translate-x-0.5 hover:-translate-y-0.5 hover:shadow-[6px_6px_0px_#000000] active:translate-x-1 active:translate-y-1 active:shadow-none"><span>Créer une classe</span><span class="pointer-events-none absolute -left-6 -top-4 -rotate-12" aria-hidden="true"><svg viewBox="0 0 44 30" class="h-7 w-10"><rect x="2" y="2" width="40" height="26" fill="#C4B5FD" stroke="#000" stroke-width="3"/><rect x="2" y="8" width="40" height="5" fill="#000"/><rect x="7" y="17" width="9" height="6" fill="#FFD23F" stroke="#000" stroke-width="2"/><path d="M4 28 L40 2" stroke="#ec3013" stroke-width="7" stroke-linecap="round"/><path d="M4 28 L40 2" stroke="#000" stroke-width="2" stroke-linecap="round"/></svg></span><span class="pointer-events-none absolute -bottom-4 -right-5 grid h-9 w-9 rotate-12 place-items-center rounded-full border-2 border-black bg-[#FFD23F] font-mono text-[11px] font-semibold leading-none text-black shadow-[2px_2px_0px_#000000] outline outline-1 outline-offset-[-5px] outline-black" aria-hidden="true">0€</span></a>
</div>
</nav>
</header>
<main>
<section class="border-b-4 border-black bg-white">
<div class="mx-auto max-w-7xl px-5 pb-12 pt-12 lg:px-10">
<p class="inline-block -rotate-2 border-2 border-black bg-[#7CF2C0] px-3 py-1 text-sm font-extrabold uppercase tracking-wider shadow-[4px_4px_0px_#000000]">Pour les élèves</p>
<h1 class="mt-6 max-w-5xl text-6xl font-black leading-[0.9] tracking-tighter sm:text-7xl">Envie d’aller plus loin à la maison&nbsp;?</h1>
<p class="mt-6 max-w-3xl text-xl font-medium leading-relaxed">Sur Paillasse, tu retrouves tes cours, tes QCM, l’IDE et le générateur de TD depuis chez toi, sur ton PC ou ton téléphone. Et si tu en veux encore, voici des ressources gratuites, sérieuses et en grande partie en français.</p>
<div class="mt-8 flex flex-wrap gap-4"><a href="apercu-ide.html" class="inline-flex items-center gap-4 border-4 border-black bg-black px-6 py-4 text-lg font-extrabold text-white shadow-[6px_6px_0px_#ec3013] hover:bg-[#ec3013]">Coder dans l’IDE →</a><a href="apercu-generateur.html" class="inline-flex items-center border-4 border-black bg-[#FF6FB5] px-6 py-4 text-lg font-extrabold shadow-[6px_6px_0px_#000000]">S’entraîner au générateur de TD</a><a href="apercu-cours.html" class="inline-flex items-center border-4 border-black bg-white px-6 py-4 text-lg font-extrabold shadow-[6px_6px_0px_#000000] hover:bg-[#FFD23F]">Relire les cours</a></div>
</div>
</section>
<section class="mx-auto max-w-7xl px-5 py-16 lg:px-10" aria-labelledby="t-ext">
<h2 id="t-ext" class="text-4xl font-black tracking-tighter">Ressources externes gratuites</h2>
<p class="mt-3 max-w-2xl text-lg font-semibold">Elles ne font pas partie de Paillasse. Certaines demandent de créer un compte : demande l’accord de tes parents si tu es mineur.</p>
<ul id="ext" class="mt-10 grid gap-8 sm:grid-cols-2 lg:grid-cols-3"></ul>
</section>
<script src="js/referentiel.js"></script>
<script>
(function () {
var C = ["bg-[#FFD23F]","bg-[#7CF2C0]","bg-[#C4B5FD]","bg-[#FF6FB5]","bg-white"];
document.getElementById('ext').innerHTML = window.REFERENTIEL.plusLoin.map(function (r, i) {
return '<li class="flex flex-col border-4 border-black ' + C[i % C.length] + ' p-6 shadow-[6px_6px_0px_#000000] ' + (i % 3 === 1 ? 'lg:translate-y-4' : '') + '"><p class="font-mono text-xs font-semibold uppercase">' + r[0] + '</p><p class="mt-2 text-2xl font-black">' + r[1] + '</p><p class="mt-2 flex-1 font-semibold">' + r[3] + '</p><a href="' + r[2] + '" target="_blank" rel="noopener" class="mt-4 self-start border-2 border-black bg-white px-3 py-1 font-extrabold hover:bg-black hover:text-white">Ouvrir ↗</a></li>';
}).join('');
})();
</script>
<section class="border-t-4 border-black bg-white" aria-labelledby="t-pdf">
<div class="mx-auto grid max-w-7xl items-center gap-10 px-5 py-16 lg:grid-cols-12 lg:px-10">
<div class="border-4 border-black bg-white shadow-[10px_10px_0px_#000000] lg:col-span-6"><div class="aspect-[10/7]"><svg viewBox="0 0 600 420" class="h-full w-full" role="img" aria-label="Un smiley qui sourit à côté des cours à télécharger">
<defs><pattern id="pts" width="24" height="24" patternUnits="userSpaceOnUse"><circle cx="6" cy="6" r="3" fill="#000"/></pattern></defs>
<rect x="330" y="0" width="270" height="420" fill="url(#pts)"/>
<path d="M0 50 C150 20 270 80 320 170 L310 250 C230 215 120 240 0 285 Z" fill="#FF3E9A"/>
<path d="M190 262 C225 160 350 80 470 76 C575 72 606 170 566 262 C526 352 404 400 292 380 C210 364 172 318 190 262 Z" fill="#35E0E8"/>
<g transform="translate(486 104) rotate(14)"><path d="M-20 -26 H10 L22 -14 V28 H-20 Z" fill="#fff" stroke="#000" stroke-width="5" stroke-linejoin="round"/><path d="M10 -26 V-14 H22" fill="#FFD23F" stroke="#000" stroke-width="5" stroke-linejoin="round"/><rect x="-26" y="-2" width="38" height="16" fill="#ec3013" stroke="#000" stroke-width="5"/><text x="-7" y="11" text-anchor="middle" font-family="Archivo,sans-serif" font-weight="900" font-size="12" fill="#fff">PDF</text></g>
<path d="M540 190 l7 15 16 2 -12 11 3 16 -14 -8 -14 8 3 -16 -12 -11 16 -2 z" fill="#FFD23F" stroke="#000" stroke-width="4" stroke-linejoin="round"/>
<g transform="rotate(-10 200 170)">
<circle cx="208" cy="178" r="112" fill="#000"/>
<circle cx="200" cy="170" r="112" fill="#FFDD57" stroke="#000" stroke-width="8"/>
<ellipse cx="160" cy="140" rx="13" ry="20" fill="#000"/>
<ellipse cx="240" cy="140" rx="13" ry="20" fill="#000"/>
<path d="M128 192 C150 250 250 250 272 192 Z" fill="#000" stroke="#000" stroke-width="8" stroke-linejoin="round"/>
<path d="M142 198 H258 C254 212 248 218 244 222 H156 C150 216 146 210 142 198 Z" fill="#fff"/>
</g>
<g font-family="Archivo, sans-serif" font-weight="900" transform="rotate(-8 400 350)">
<text x="208" y="352" font-size="40" fill="#FF3E9A" letter-spacing="1">SERVEZ-VOUS&#160;!</text>
<text x="205" y="349" font-size="40" fill="#000" letter-spacing="1">SERVEZ-VOUS&#160;!</text>
<rect x="204" y="362" width="340" height="26" fill="#fff" stroke="#000" stroke-width="3"/><text x="214" y="381" font-size="15" fill="#000" letter-spacing="1">COURS · TD · CORRECTIONS EN PDF</text>
</g>
</svg></div></div>
<div class="lg:col-span-6">
<p class="inline-block -rotate-2 border-2 border-black bg-[#35E0E8] px-3 py-1 text-sm font-extrabold uppercase tracking-wider shadow-[4px_4px_0px_#000000]">Gratuit · à télécharger</p>
<h2 id="t-pdf" class="mt-6 text-5xl font-black leading-[0.95] tracking-tighter sm:text-6xl">Tous les cours se téléchargent en PDF.</h2>
<p class="mt-5 text-xl font-medium leading-relaxed">CM complet, TD prêt à imprimer avec ses cases à remplir, correction à part, QCM papier. Pour la classe, pour réviser chez soi ou pour un jour sans réseau.</p>
<ul class="mt-8 grid gap-3 sm:grid-cols-2">
<li><a href="apercu-cours-ipv4-cm.html" class="flex items-center gap-4 border-4 border-black bg-[#FFD23F] p-3 font-extrabold shadow-[4px_4px_0px_#000000] hover:-translate-y-0.5"><svg viewBox="0 0 40 48" class="h-12 w-10 shrink-0" role="img" aria-label="PDF"><path d="M3 3 H27 L37 13 V45 H3 Z" fill="#fff" stroke="#000" stroke-width="3" stroke-linejoin="round"/><path d="M27 3 V13 H37" fill="#FFD23F" stroke="#000" stroke-width="3" stroke-linejoin="round"/><rect x="0" y="22" width="32" height="14" fill="#ec3013" stroke="#000" stroke-width="3"/><text x="16" y="33" text-anchor="middle" font-family="Archivo,sans-serif" font-weight="900" font-size="11" fill="#fff">PDF</text></svg><span>CM complet<span class="block font-mono text-xs font-semibold">Adressage IPv4 · 12 pages</span></span></a></li>
<li><a href="apercu-td-imprimable.html" class="flex items-center gap-4 border-4 border-black bg-[#7CF2C0] p-3 font-extrabold shadow-[4px_4px_0px_#000000] hover:-translate-y-0.5"><svg viewBox="0 0 40 48" class="h-12 w-10 shrink-0" role="img" aria-label="PDF"><path d="M3 3 H27 L37 13 V45 H3 Z" fill="#fff" stroke="#000" stroke-width="3" stroke-linejoin="round"/><path d="M27 3 V13 H37" fill="#FFD23F" stroke="#000" stroke-width="3" stroke-linejoin="round"/><rect x="0" y="22" width="32" height="14" fill="#ec3013" stroke="#000" stroke-width="3"/><text x="16" y="33" text-anchor="middle" font-family="Archivo,sans-serif" font-weight="900" font-size="11" fill="#fff">PDF</text></svg><span>TD à imprimer<span class="block font-mono text-xs font-semibold">Étapes + cases à remplir</span></span></a></li>
<li><a href="apercu-td-imprimable.html#correction" class="flex items-center gap-4 border-4 border-black bg-[#FF6FB5] p-3 font-extrabold shadow-[4px_4px_0px_#000000] hover:-translate-y-0.5"><svg viewBox="0 0 40 48" class="h-12 w-10 shrink-0" role="img" aria-label="PDF"><path d="M3 3 H27 L37 13 V45 H3 Z" fill="#fff" stroke="#000" stroke-width="3" stroke-linejoin="round"/><path d="M27 3 V13 H37" fill="#FFD23F" stroke="#000" stroke-width="3" stroke-linejoin="round"/><rect x="0" y="22" width="32" height="14" fill="#ec3013" stroke="#000" stroke-width="3"/><text x="16" y="33" text-anchor="middle" font-family="Archivo,sans-serif" font-weight="900" font-size="11" fill="#fff">PDF</text></svg><span>Correction<span class="block font-mono text-xs font-semibold">Réservée au prof</span></span></a></li>
<li><a href="apercu-cours.html" class="flex items-center gap-4 border-4 border-black bg-[#C4B5FD] p-3 font-extrabold shadow-[4px_4px_0px_#000000] hover:-translate-y-0.5"><svg viewBox="0 0 40 48" class="h-12 w-10 shrink-0" role="img" aria-label="PDF"><path d="M3 3 H27 L37 13 V45 H3 Z" fill="#fff" stroke="#000" stroke-width="3" stroke-linejoin="round"/><path d="M27 3 V13 H37" fill="#FFD23F" stroke="#000" stroke-width="3" stroke-linejoin="round"/><rect x="0" y="22" width="32" height="14" fill="#ec3013" stroke="#000" stroke-width="3"/><text x="16" y="33" text-anchor="middle" font-family="Archivo,sans-serif" font-weight="900" font-size="11" fill="#fff">PDF</text></svg><span>Tous les cours<span class="block font-mono text-xs font-semibold">Par cursus, du SNT au master</span></span></a></li>
</ul>
</div>
</div>
</section>
</main>
<footer class="border-t-4 border-black bg-white">
<div class="mx-auto grid max-w-7xl gap-10 px-5 py-14 sm:grid-cols-2 lg:grid-cols-4 lg:px-10">
<div>
<p class="text-2xl font-black tracking-tight">Paillasse</p>
<p class="mt-3 font-medium">Cours, labs, IDE et examens en ligne, du lycée au master.</p>
</div>
<nav aria-label="Produit"><p class="font-mono text-sm font-semibold uppercase">Produit</p><ul class="mt-4 space-y-2 font-bold"><li><a href="apercu-cockpit.html" class="hover:underline">Cockpit prof</a></li><li><a href="apercu-espace-eleve.html" class="hover:underline">Espace élève</a></li><li><a href="apercu-aide.html" class="hover:underline">Aide et tutoriels</a></li><li><a href="apercu-labs.html" class="hover:underline">Labs</a></li><li><a href="apercu-fonctionnalites.html" class="hover:underline">Fonctionnalités</a></li><li><a href="apercu-cours.html" class="hover:underline">Cours gratuits</a></li><li><a href="apercu-bibliotheque.html" class="hover:underline">Bibliothèque</a></li><li><a href="apercu-ide.html" class="hover:underline">IDE en ligne</a></li><li><a href="apercu-generateur.html" class="hover:underline">Générateur de TD</a></li><li><a href="apercu-lab-web.html" class="hover:underline">Lab web</a></li><li><a href="apercu-tarifs.html" class="hover:underline">Tarifs</a></li><li><a href="apercu-pourquoi.html" class="hover:underline">Pourquoi ce projet ?</a></li></ul></nav>
<nav aria-label="Établissements"><p class="font-mono text-sm font-semibold uppercase">Établissements</p><ul class="mt-4 space-y-2 font-bold"><li><a href="apercu-etablissements.html" class="hover:underline">Équiper une classe</a></li><li><a href="apercu-connexion.html" class="hover:underline">Se connecter</a></li></ul></nav>
<div class="self-start justify-self-start border-2 border-black bg-[#7CF2C0] px-4 py-3 font-mono text-sm font-semibold shadow-[4px_4px_0px_#000000]">● Tous les services fonctionnent</div>
</div>
<div class="border-t-4 border-black bg-white">
<ul class="mx-auto flex max-w-7xl flex-wrap items-center justify-center gap-8 px-5 py-8 lg:px-10" aria-label="Engagements">
<li class="grid h-40 w-40 shrink-0 -rotate-3 place-items-center rounded-full border-4 border-black bg-white text-center shadow-[4px_4px_0px_#000000] outline outline-2 outline-offset-[-10px] outline-black"><span class="flex max-w-[6.5rem] flex-col items-center gap-1.5"><span class="text-[10px] font-extrabold uppercase tracking-wide leading-none">Hébergé en</span><span class="flex h-7 w-11 border-2 border-black" aria-hidden="true"><span class="flex-1 bg-[#0055A4]"></span><span class="flex-1 bg-white"></span><span class="flex-1 bg-[#EF4135]"></span></span><span class="text-[10px] font-bold leading-tight">France</span></span></li>
<li class="grid h-40 w-40 shrink-0 rotate-3 place-items-center rounded-full border-4 border-black bg-[#FFD23F] text-center shadow-[4px_4px_0px_#000000] outline outline-2 outline-offset-[-10px] outline-black"><span class="flex max-w-[6.5rem] flex-col items-center gap-1.5"><span class="text-[10px] font-extrabold uppercase tracking-wide leading-none">Données</span><span class="font-mono text-3xl font-semibold leading-none">RGPD</span><span class="text-[10px] font-bold leading-tight">minimisées</span></span></li>
<li class="grid h-40 w-40 shrink-0 -rotate-6 place-items-center rounded-full border-4 border-black bg-[#7CF2C0] text-center shadow-[4px_4px_0px_#000000] outline outline-2 outline-offset-[-10px] outline-black"><span class="flex max-w-[6.5rem] flex-col items-center gap-1.5"><span class="text-[10px] font-extrabold uppercase tracking-wide leading-none">Référentiels</span><span class="font-mono text-3xl font-semibold leading-none">20</span><span class="text-[10px] font-bold leading-tight">cursus couverts</span></span></li>
<li class="grid h-40 w-40 shrink-0 rotate-6 place-items-center rounded-full border-4 border-black bg-[#FF6FB5] text-center shadow-[4px_4px_0px_#000000] outline outline-2 outline-offset-[-10px] outline-black"><span class="flex max-w-[6.5rem] flex-col items-center gap-1.5"><span class="text-[10px] font-extrabold uppercase tracking-wide leading-none">Essai</span><span class="font-mono text-3xl font-semibold leading-none">0 €</span><span class="text-[10px] font-bold leading-tight">sans CB</span></span></li>
</ul>
</div>
<div class="border-t-4 border-black bg-[#FFD23F]">
<div class="mx-auto flex max-w-7xl flex-wrap items-center gap-x-6 gap-y-2 px-5 py-4 lg:px-10"><p class="flex-1 font-extrabold">Fait avec <span class="text-[#ec3013]" aria-label="amour">♥</span> par Adam Belkacemi</p><nav aria-label="Informations légales"><ul class="flex flex-wrap gap-x-4 gap-y-1 text-sm font-bold"><li><a href="apercu-legal.html#mentions" class="underline underline-offset-4">Mentions légales</a></li><li><a href="apercu-legal.html#cgu" class="underline underline-offset-4">CGU</a></li><li><a href="apercu-legal.html#confidentialite" class="underline underline-offset-4">Confidentialité et RGPD</a></li><li><a href="apercu-legal.html#cookies" class="underline underline-offset-4">Cookies</a></li><li><a href="apercu-legal.html#sous-traitance" class="underline underline-offset-4">Sous-traitance</a></li></ul></nav></div>
</div>
</footer>
</body>
</html>