Paillasse/design/_backup-ludique/resources/views/aide.blade.php
2026-10-06 23:28:18 +02:00

92 lines
36 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Aide et tutoriels · 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="{{ asset('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="{{ route('accueil') }}" 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="{{ route('fonctionnalites') }}" 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="{{ route('cockpit') }}" @if(request()->routeIs('cockpit')) aria-current="page" @endif 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="{{ route('espace.eleve') }}" @if(request()->routeIs('espace.eleve')) aria-current="page" @endif 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="{{ route('vie.scolaire') }}" @if(request()->routeIs('vie.scolaire')) aria-current="page" @endif 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="{{ route('academie') }}" @if(request()->routeIs('academie')) aria-current="page" @endif 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="{{ route('cours.index') }}" @if(request()->routeIs('cours.index')) aria-current="page" @endif 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="{{ route('labs.index') }}" @if(request()->routeIs('labs.index')) aria-current="page" @endif 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="{{ route('labs.web') }}" @if(request()->routeIs('labs.web')) aria-current="page" @endif 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="{{ route('ide') }}" @if(request()->routeIs('ide')) aria-current="page" @endif 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="{{ route('maison') }}" @if(request()->routeIs('maison')) aria-current="page" @endif 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="{{ route('bibliotheque') }}" @if(request()->routeIs('bibliotheque')) aria-current="page" @endif 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="{{ route('banque') }}" @if(request()->routeIs('banque')) aria-current="page" @endif 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="{{ route('generateur') }}" @if(request()->routeIs('generateur')) aria-current="page" @endif 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="{{ route('td.imprimable') }}" @if(request()->routeIs('td.imprimable')) aria-current="page" @endif 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="{{ route('quiz.projection') }}" @if(request()->routeIs('quiz.projection')) aria-current="page" @endif 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="{{ route('sujet.creer') }}" @if(request()->routeIs('sujet.creer')) aria-current="page" @endif 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="{{ route('devoirs') }}" @if(request()->routeIs('devoirs')) aria-current="page" @endif 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="{{ route('correction') }}" @if(request()->routeIs('correction')) aria-current="page" @endif 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="{{ route('fiche.eleve') }}" @if(request()->routeIs('fiche.eleve')) aria-current="page" @endif 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="{{ route('messagerie') }}" @if(request()->routeIs('messagerie')) aria-current="page" @endif 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="{{ route('export.ent') }}" @if(request()->routeIs('export.ent')) aria-current="page" @endif 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="{{ route('aide') }}" 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="{{ route('etablissements') }}" 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="{{ route('tarifs') }}" 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="{{ route('pourquoi') }}" 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="{{ route('login') }}" 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="{{ route('register') }}" 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>
<div class="border-b-2 border-black bg-[#F6F5F1]"><div class="mx-auto grid max-w-[1600px] lg:grid-cols-[240px_minmax(0,1fr)]"><aside class="border-b-2 border-black bg-white p-5 lg:border-b-0 lg:border-r-2"><label class="flex h-11 items-center gap-2 border-2 border-black px-2"><svg viewBox="0 0 24 24" class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg><input id="a-q" class="min-w-0 flex-1 bg-transparent text-sm font-semibold outline-none" placeholder="Rechercher dans l’aide"></label><p class="mt-6 font-mono text-[11px] font-semibold uppercase tracking-wider">Rubriques</p><ul class="mt-2 grid gap-1"><li><a href="#videos" class="flex items-center gap-3 border-2 border-black bg-black text-white px-3 py-2 text-sm font-bold"><svg viewBox="0 0 24 24" class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 3 14 9-14 9V3z"/></svg><span class="flex-1">Tutoriels vidéo</span></a></li><li><a href="#guides" class="flex items-center gap-3 border-2 border-transparent hover:border-black px-3 py-2 text-sm font-bold"><svg viewBox="0 0 24 24" class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20V2H6.5A2.5 2.5 0 0 0 4 4.5v15z"/></svg><span class="flex-1">Guides pas à pas</span></a></li><li><a href="#contact" class="flex items-center gap-3 border-2 border-transparent hover:border-black px-3 py-2 text-sm font-bold"><svg viewBox="0 0 24 24" class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg><span class="flex-1">Nous écrire</span></a></li></ul><div class="mt-6 border-2 border-black bg-[#7CF2C0] p-3 text-sm font-semibold"><p class="font-black">Réponse sous 24 h</p><p class="mt-1">Les jours d’école, par l’auteur de Paillasse lui-même.</p></div></aside><div class="min-w-0 p-5 lg:p-8"><div class="flex flex-wrap items-end justify-between gap-4"><div><p class="font-mono text-xs font-semibold">Centre d’aide</p><h1 class="mt-1 text-4xl font-black tracking-tight">Aide et tutoriels</h1><p class="mt-1 font-semibold">Des vidéos courtes et des guides pour prendre Paillasse en main.</p></div><div class="flex flex-wrap gap-3"><a href="mailto:adam@belkacemi.me" class="inline-flex h-11 items-center gap-2 border-2 border-black bg-[#FFD23F] px-4 text-sm font-extrabold shadow-[3px_3px_0px_#000000]"><svg viewBox="0 0 24 24" class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>Poser une question</a></div></div><section id="videos" class="mt-6" aria-labelledby="t-v"><h2 id="t-v" class="text-2xl font-black">Tutoriels vidéo</h2><ul class="mt-4 grid gap-5 sm:grid-cols-2 xl:grid-cols-4"><li data-a="créer ma première classe"><a href="#" class="group block border-2 border-black bg-white hover:shadow-[4px_4px_0px_#000000]"><span class="relative grid aspect-video place-items-center border-b-2 border-black" style="background:#FFD23F"><span class="grid h-14 w-14 place-items-center rounded-full border-2 border-black bg-white group-hover:bg-black group-hover:text-white"><svg viewBox="0 0 24 24" class="h-6 w-6 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 3 14 9-14 9V3z"/></svg></span><span class="absolute bottom-2 right-2 border-2 border-black bg-white px-1.5 font-mono text-[11px] font-semibold">3 min</span></span><span class="block p-3"><span class="font-mono text-[11px] font-semibold uppercase">Démarrer</span><span class="mt-1 block font-black leading-tight">Créer ma première classe</span></span></a></li><li data-a="lancer un lab et suivre la classe"><a href="#" class="group block border-2 border-black bg-white hover:shadow-[4px_4px_0px_#000000]"><span class="relative grid aspect-video place-items-center border-b-2 border-black" style="background:#7CF2C0"><span class="grid h-14 w-14 place-items-center rounded-full border-2 border-black bg-white group-hover:bg-black group-hover:text-white"><svg viewBox="0 0 24 24" class="h-6 w-6 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 3 14 9-14 9V3z"/></svg></span><span class="absolute bottom-2 right-2 border-2 border-black bg-white px-1.5 font-mono text-[11px] font-semibold">4 min</span></span><span class="block p-3"><span class="font-mono text-[11px] font-semibold uppercase">Labs</span><span class="mt-1 block font-black leading-tight">Lancer un lab et suivre la classe</span></span></a></li><li data-a="le cockpit prof en 5 minutes"><a href="#" class="group block border-2 border-black bg-white hover:shadow-[4px_4px_0px_#000000]"><span class="relative grid aspect-video place-items-center border-b-2 border-black" style="background:#C4B5FD"><span class="grid h-14 w-14 place-items-center rounded-full border-2 border-black bg-white group-hover:bg-black group-hover:text-white"><svg viewBox="0 0 24 24" class="h-6 w-6 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 3 14 9-14 9V3z"/></svg></span><span class="absolute bottom-2 right-2 border-2 border-black bg-white px-1.5 font-mono text-[11px] font-semibold">5 min</span></span><span class="block p-3"><span class="font-mono text-[11px] font-semibold uppercase">Cockpit</span><span class="mt-1 block font-black leading-tight">Le cockpit prof en 5 minutes</span></span></a></li><li data-a="composer un sujet d’examen"><a href="#" class="group block border-2 border-black bg-white hover:shadow-[4px_4px_0px_#000000]"><span class="relative grid aspect-video place-items-center border-b-2 border-black" style="background:#ec3013"><span class="grid h-14 w-14 place-items-center rounded-full border-2 border-black bg-white group-hover:bg-black group-hover:text-white"><svg viewBox="0 0 24 24" class="h-6 w-6 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 3 14 9-14 9V3z"/></svg></span><span class="absolute bottom-2 right-2 border-2 border-black bg-white px-1.5 font-mono text-[11px] font-semibold">6 min</span></span><span class="block p-3"><span class="font-mono text-[11px] font-semibold uppercase">Examens</span><span class="mt-1 block font-black leading-tight">Composer un sujet d’examen</span></span></a></li><li data-a="corriger un dm avec la pré-correction"><a href="#" class="group block border-2 border-black bg-white hover:shadow-[4px_4px_0px_#000000]"><span class="relative grid aspect-video place-items-center border-b-2 border-black" style="background:#FF6FB5"><span class="grid h-14 w-14 place-items-center rounded-full border-2 border-black bg-white group-hover:bg-black group-hover:text-white"><svg viewBox="0 0 24 24" class="h-6 w-6 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 3 14 9-14 9V3z"/></svg></span><span class="absolute bottom-2 right-2 border-2 border-black bg-white px-1.5 font-mono text-[11px] font-semibold">4 min</span></span><span class="block p-3"><span class="font-mono text-[11px] font-semibold uppercase">Correction</span><span class="mt-1 block font-black leading-tight">Corriger un DM avec la pré-correction</span></span></a></li><li data-a="exporter les notes vers pronote"><a href="#" class="group block border-2 border-black bg-white hover:shadow-[4px_4px_0px_#000000]"><span class="relative grid aspect-video place-items-center border-b-2 border-black" style="background:#FFD23F"><span class="grid h-14 w-14 place-items-center rounded-full border-2 border-black bg-white group-hover:bg-black group-hover:text-white"><svg viewBox="0 0 24 24" class="h-6 w-6 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 3 14 9-14 9V3z"/></svg></span><span class="absolute bottom-2 right-2 border-2 border-black bg-white px-1.5 font-mono text-[11px] font-semibold">3 min</span></span><span class="block p-3"><span class="font-mono text-[11px] font-semibold uppercase">Exports</span><span class="mt-1 block font-black leading-tight">Exporter les notes vers Pronote</span></span></a></li><li data-a="projeter un quiz flash"><a href="#" class="group block border-2 border-black bg-white hover:shadow-[4px_4px_0px_#000000]"><span class="relative grid aspect-video place-items-center border-b-2 border-black" style="background:#7CF2C0"><span class="grid h-14 w-14 place-items-center rounded-full border-2 border-black bg-white group-hover:bg-black group-hover:text-white"><svg viewBox="0 0 24 24" class="h-6 w-6 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 3 14 9-14 9V3z"/></svg></span><span class="absolute bottom-2 right-2 border-2 border-black bg-white px-1.5 font-mono text-[11px] font-semibold">2 min</span></span><span class="block p-3"><span class="font-mono text-[11px] font-semibold uppercase">Quiz</span><span class="mt-1 block font-black leading-tight">Projeter un quiz flash</span></span></a></li><li data-a="côté élève : se connecter et lever la main"><a href="#" class="group block border-2 border-black bg-white hover:shadow-[4px_4px_0px_#000000]"><span class="relative grid aspect-video place-items-center border-b-2 border-black" style="background:#C4B5FD"><span class="grid h-14 w-14 place-items-center rounded-full border-2 border-black bg-white group-hover:bg-black group-hover:text-white"><svg viewBox="0 0 24 24" class="h-6 w-6 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 3 14 9-14 9V3z"/></svg></span><span class="absolute bottom-2 right-2 border-2 border-black bg-white px-1.5 font-mono text-[11px] font-semibold">2 min</span></span><span class="block p-3"><span class="font-mono text-[11px] font-semibold uppercase">Élèves</span><span class="mt-1 block font-black leading-tight">Côté élève : se connecter et lever la main</span></span></a></li></ul><p class="mt-3 text-xs font-semibold">Vidéos en cours de tournage : les vignettes sont des emplacements.</p></section>
<section id="guides" class="mt-10" aria-labelledby="t-g"><h2 id="t-g" class="text-2xl font-black">Guides pas à pas</h2><div class="mt-4 grid gap-5 md:grid-cols-2 xl:grid-cols-4"><section id="g-dmarrer" class="border-2 border-black bg-white" aria-labelledby="t-g-dmarrer"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-g-dmarrer" class="flex items-center gap-2 text-lg font-black"><svg viewBox="0 0 24 24" class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20V2H6.5A2.5 2.5 0 0 0 4 4.5v15z"/></svg>Démarrer</h2></div><ul class="divide-y-2 divide-black"><li data-a="créer un compte enseignant sans cb"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Créer un compte enseignant sans CB<span aria-hidden="true">→</span></a></li><li data-a="ajouter mes élèves (liste, code classe, csv)"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Ajouter mes élèves (liste, code classe, CSV)<span aria-hidden="true">→</span></a></li><li data-a="choisir mon établissement"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Choisir mon établissement<span aria-hidden="true">→</span></a></li></ul></section><section id="g-enclasse" class="border-2 border-black bg-white" aria-labelledby="t-g-enclasse"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-g-enclasse" class="flex items-center gap-2 text-lg font-black"><svg viewBox="0 0 24 24" class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20V2H6.5A2.5 2.5 0 0 0 4 4.5v15z"/></svg>En classe</h2></div><ul class="divide-y-2 divide-black"><li data-a="lancer un lab sur vm"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Lancer un lab sur VM<span aria-hidden="true">→</span></a></li><li data-a="utiliser le lab web"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Utiliser le lab web<span aria-hidden="true">→</span></a></li><li data-a="gérer les mains levées"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Gérer les mains levées<span aria-hidden="true">→</span></a></li><li data-a="débloquer les indices plus tôt"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Débloquer les indices plus tôt<span aria-hidden="true">→</span></a></li></ul></section><section id="g-valuer" class="border-2 border-black bg-white" aria-labelledby="t-g-valuer"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-g-valuer" class="flex items-center gap-2 text-lg font-black"><svg viewBox="0 0 24 24" class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20V2H6.5A2.5 2.5 0 0 0 4 4.5v15z"/></svg>Évaluer</h2></div><ul class="divide-y-2 divide-black"><li data-a="programmer un devoir maison"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Programmer un devoir maison<span aria-hidden="true">→</span></a></li><li data-a="surveiller un examen"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Surveiller un examen<span aria-hidden="true">→</span></a></li><li data-a="valider une pré-correction"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Valider une pré-correction<span aria-hidden="true">→</span></a></li><li data-a="imprimer un td en pdf"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Imprimer un TD en PDF<span aria-hidden="true">→</span></a></li></ul></section><section id="g-tablissement" class="border-2 border-black bg-white" aria-labelledby="t-g-tablissement"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-g-tablissement" class="flex items-center gap-2 text-lg font-black"><svg viewBox="0 0 24 24" class="h-4 w-4 shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20V2H6.5A2.5 2.5 0 0 0 4 4.5v15z"/></svg>Établissement</h2></div><ul class="divide-y-2 divide-black"><li data-a="commander avec un bon de commande"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Commander avec un bon de commande<span aria-hidden="true">→</span></a></li><li data-a="déposer une facture sur chorus pro"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Déposer une facture sur Chorus Pro<span aria-hidden="true">→</span></a></li><li data-a="donner l’accès à la cpe"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">Donner l’accès à la CPE<span aria-hidden="true">→</span></a></li><li data-a="rgpd : le registre des traitements"><a href="#" class="flex items-center justify-between gap-2 p-3 text-sm font-bold hover:bg-[#FFFBEA]">RGPD : le registre des traitements<span aria-hidden="true">→</span></a></li></ul></section></div></section>
<section id="contact" class="mt-10 border-2 border-black bg-black p-6 text-white"><h2 class="text-2xl font-black">Vous ne trouvez pas&nbsp;?</h2><p class="mt-2 font-semibold">Écrivez à <a href="mailto:adam@belkacemi.me" class="underline underline-offset-4">adam@belkacemi.me</a>. Chaque question aide à améliorer l’outil.</p></section>
<script>document.addEventListener('DOMContentLoaded',function(){document.getElementById('a-q').addEventListener('input',function(e){var q=e.target.value.toLowerCase();document.querySelectorAll('[data-a]').forEach(function(li){li.style.display=li.dataset.a.indexOf(q)>-1?'':'none';});});});</script></div></div></div>
</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="{{ route('cockpit') }}" class="hover:underline">Cockpit prof</a></li><li><a href="{{ route('espace.eleve') }}" class="hover:underline">Espace élève</a></li><li><a href="{{ route('aide') }}" class="hover:underline">Aide et tutoriels</a></li><li><a href="{{ route('labs.index') }}" class="hover:underline">Labs</a></li><li><a href="{{ route('fonctionnalites') }}" class="hover:underline">Fonctionnalités</a></li><li><a href="{{ route('cours.index') }}" class="hover:underline">Cours gratuits</a></li><li><a href="{{ route('bibliotheque') }}" class="hover:underline">Bibliothèque</a></li><li><a href="{{ route('ide') }}" class="hover:underline">IDE en ligne</a></li><li><a href="{{ route('generateur') }}" class="hover:underline">Générateur de TD</a></li><li><a href="{{ route('labs.web') }}" class="hover:underline">Lab web</a></li><li><a href="{{ route('tarifs') }}" class="hover:underline">Tarifs</a></li><li><a href="{{ route('pourquoi') }}" 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="{{ route('etablissements') }}" class="hover:underline">Équiper une classe</a></li><li><a href="{{ route('login') }}" 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="{{ route('legal') }}#mentions" class="underline underline-offset-4">Mentions légales</a></li><li><a href="{{ route('legal') }}#cgu" class="underline underline-offset-4">CGU</a></li><li><a href="{{ route('legal') }}#confidentialite" class="underline underline-offset-4">Confidentialité et RGPD</a></li><li><a href="{{ route('legal') }}#cookies" class="underline underline-offset-4">Cookies</a></li><li><a href="{{ route('legal') }}#sous-traitance" class="underline underline-offset-4">Sous-traitance</a></li></ul></nav></div>
</div>
</footer>
</body>
</html>