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

89 lines
34 KiB
PHP
Raw Permalink 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>Créer un sujet d’examen · 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"><p class="font-mono text-[11px] font-semibold uppercase tracking-wider">Étapes</p><ol id="s-steps" class="mt-2 grid gap-1"><li><button type="button" data-s="0" class="flex w-full items-center gap-3 border-2 px-3 py-2 text-left text-sm font-bold"><span class="grid h-6 w-6 place-items-center border-2 border-current font-mono text-xs">1</span>Cadre</button></li><li><button type="button" data-s="1" class="flex w-full items-center gap-3 border-2 px-3 py-2 text-left text-sm font-bold"><span class="grid h-6 w-6 place-items-center border-2 border-current font-mono text-xs">2</span>Questions</button></li><li><button type="button" data-s="2" class="flex w-full items-center gap-3 border-2 px-3 py-2 text-left text-sm font-bold"><span class="grid h-6 w-6 place-items-center border-2 border-current font-mono text-xs">3</span>Barème</button></li><li><button type="button" data-s="3" class="flex w-full items-center gap-3 border-2 px-3 py-2 text-left text-sm font-bold"><span class="grid h-6 w-6 place-items-center border-2 border-current font-mono text-xs">4</span>Surveillance</button></li><li><button type="button" data-s="4" class="flex w-full items-center gap-3 border-2 px-3 py-2 text-left text-sm font-bold"><span class="grid h-6 w-6 place-items-center border-2 border-current font-mono text-xs">5</span>Publication</button></li></ol><div class="mt-6 border-2 border-black bg-[#FFFBEA] p-3 text-sm font-semibold"><p class="font-black">Brouillon enregistré</p><p class="mt-1 font-mono text-xs">il y a 12 s</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">Sujet · étape par étape</p><h1 class="mt-1 text-4xl font-black tracking-tight">Créer un sujet d’examen</h1><p class="mt-1 font-semibold">Composez un sujet en 5 étapes, à partir de la banque ou de vos questions.</p></div><div class="flex flex-wrap gap-3"><button type="button" class="inline-flex h-11 items-center gap-2 border-2 border-black px-4 text-sm font-extrabold bg-white hover:bg-[#FFFBEA]"><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>Aperçu élève</button><button type="button" id="s-next" class="inline-flex h-11 items-center gap-2 border-2 border-black bg-black px-4 text-sm font-extrabold text-white shadow-[3px_3px_0px_#ec3013]">Étape suivante →</button></div></div><div data-step="0" class="mt-6 "><section id="cadre" class="border-2 border-black bg-white" aria-labelledby="t-cadre"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-cadre" 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>1 · Cadre de l’épreuve</h2></div><div class="grid gap-4 p-4 md:grid-cols-2"><label class="grid gap-1 text-sm font-bold">Titre<input type="text" value="E6 blanc SISR · Adressage et VLAN" class="h-11 border-2 border-black bg-white px-3 font-semibold"></label><label class="grid gap-1 text-sm font-bold">Classe<select class="h-11 border-2 border-black bg-white px-2 font-semibold"><option>BTS SIO 1 · Groupe A</option><option>BTS SIO 1 · Groupe B</option></select></label><label class="grid gap-1 text-sm font-bold">Date<input type="date" value="2026-10-08" class="h-11 border-2 border-black bg-white px-3 font-semibold"></label><label class="grid gap-1 text-sm font-bold">Durée<select class="h-11 border-2 border-black bg-white px-2 font-semibold"><option>1 h</option><option selected>1 h 30</option><option>2 h</option><option>4 h</option></select></label><label class="grid gap-1 text-sm font-bold">Référentiel<select class="h-11 border-2 border-black bg-white px-2 font-semibold"><option>BTS SIO · E6 SISR</option><option>BTS SIO · E5</option><option>BTS CIEL · E4</option></select></label><label class="grid gap-1 text-sm font-bold">Aménagements<span class="flex h-11 items-center gap-3 border-2 border-black bg-white px-3 font-semibold"><input type="checkbox" checked class="h-5 w-5 accent-black"> Tiers-temps appliqué automatiquement (2 élèves)</span></label></div></section></div><div data-step="1" class="mt-6 hidden"><div class="grid gap-6 xl:grid-cols-[minmax(0,1fr)_minmax(0,1fr)]"><section id="banque" class="border-2 border-black bg-white" aria-labelledby="t-banque"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-banque" 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"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg>Banque de questions</h2></div><div class="flex gap-2 border-b-2 border-black p-3"><input class="h-10 min-w-0 flex-1 border-2 border-black px-2 text-sm" placeholder="Rechercher : VLAN, masque, Bash…"><select class="h-10 border-2 border-black px-2 text-sm font-bold"><option>Tous types</option><option>QCM</option><option>Lab VM</option><option>Code</option></select></div><ul class="divide-y-2 divide-black"><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border-2 border-black bg-[#FFFBEA] px-1 text-center font-mono text-[11px] font-semibold">QCM</span><div class="min-w-0 flex-1"><p class="text-sm font-bold">Quel masque donne 62 hôtes ?</p><p class="text-xs font-semibold">Réseaux · facile · 2 pts</p></div><button type="button" data-add="0" class="h-9 border-2 border-black px-3 text-xs font-extrabold hover:bg-black hover:text-white">Ajouter</button></li><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border-2 border-black bg-[#FFFBEA] px-1 text-center font-mono text-[11px] font-semibold">Calcul</span><div class="min-w-0 flex-1"><p class="text-sm font-bold">Adresse de broadcast de 192.168.10.128/26</p><p class="text-xs font-semibold">Réseaux · moyen · 3 pts</p></div><button type="button" data-add="1" class="h-9 border-2 border-black px-3 text-xs font-extrabold hover:bg-black hover:text-white">Ajouter</button></li><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border-2 border-black bg-[#FFFBEA] px-1 text-center font-mono text-[11px] font-semibold">Lab VM</span><div class="min-w-0 flex-1"><p class="text-sm font-bold">Configurer eth0 en 192.168.10.65/26</p><p class="text-xs font-semibold">Lab · moyen · 5 pts</p></div><button type="button" data-add="2" class="h-9 border-2 border-black px-3 text-xs font-extrabold hover:bg-black hover:text-white">Ajouter</button></li><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border-2 border-black bg-[#FFFBEA] px-1 text-center font-mono text-[11px] font-semibold">Code</span><div class="min-w-0 flex-1"><p class="text-sm font-bold">Script Bash qui teste 4 IP avec ping</p><p class="text-xs font-semibold">Bash · difficile · 6 pts</p></div><button type="button" data-add="3" class="h-9 border-2 border-black px-3 text-xs font-extrabold hover:bg-black hover:text-white">Ajouter</button></li><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border-2 border-black bg-[#FFFBEA] px-1 text-center font-mono text-[11px] font-semibold">Rédaction</span><div class="min-w-0 flex-1"><p class="text-sm font-bold">Expliquer l’intérêt des VLAN</p><p class="text-xs font-semibold">Rédaction · moyen · 4 pts</p></div><button type="button" data-add="4" class="h-9 border-2 border-black px-3 text-xs font-extrabold hover:bg-black hover:text-white">Ajouter</button></li></ul></section><section id="sujet" class="border-2 border-black bg-white" aria-labelledby="t-sujet"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-sujet" 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="M12 20h9M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z"/></svg>Votre sujet</h2><button type="button" class="inline-flex h-11 items-center gap-2 border-2 border-black px-4 text-sm font-extrabold bg-white text-xs h-9">+ Question perso</button></div><ol id="s-sujet" class="divide-y-2 divide-black"></ol><div class="flex justify-between border-t-2 border-black p-4 font-bold"><span id="s-nb">0 question</span><span class="font-mono"><span id="s-pts">0</span> pts</span></div></section></div></div><div data-step="2" class="mt-6 hidden"><section id="bareme" class="border-2 border-black bg-white" aria-labelledby="t-bareme"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-bareme" 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="M20 6 9 17l-5-5"/></svg>3 · Barème</h2></div><div class="grid gap-4 p-4 md:grid-cols-3"><label class="grid gap-1 text-sm font-bold">Note sur<input type="number" value="20" class="h-11 border-2 border-black bg-white px-3 font-semibold"></label><label class="grid gap-1 text-sm font-bold">Points négatifs au QCM<select class="h-11 border-2 border-black bg-white px-2 font-semibold"><option>Non</option><option>−0,5 par erreur</option></select></label><label class="grid gap-1 text-sm font-bold">Correction<select class="h-11 border-2 border-black bg-white px-2 font-semibold"><option>Pré-correction automatique + validation</option><option>Manuelle</option></select></label></div><p class="border-t-2 border-black bg-[#FFFBEA] p-3 text-sm font-semibold">Les points sont ramenés automatiquement sur 20. Les questions de rédaction restent corrigées par vous.</p></section></div><div data-step="3" class="mt-6 hidden"><section id="surv" class="border-2 border-black bg-white" aria-labelledby="t-surv"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-surv" 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="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg>4 · Surveillance</h2></div><ul class="grid gap-3 p-4 sm:grid-cols-2"><li><label class="flex items-center gap-3 border-2 border-black bg-white p-3 text-sm font-bold"><input type="checkbox" checked class="h-5 w-5 accent-black">Plein écran obligatoire</label></li><li><label class="flex items-center gap-3 border-2 border-black bg-white p-3 text-sm font-bold"><input type="checkbox" checked class="h-5 w-5 accent-black">Signaler les changements d’onglet</label></li><li><label class="flex items-center gap-3 border-2 border-black bg-white p-3 text-sm font-bold"><input type="checkbox" checked class="h-5 w-5 accent-black">Signaler la souris hors de la fenêtre</label></li><li><label class="flex items-center gap-3 border-2 border-black bg-white p-3 text-sm font-bold"><input type="checkbox" checked class="h-5 w-5 accent-black">Bloquer le copier-coller</label></li><li><label class="flex items-center gap-3 border-2 border-black bg-white p-3 text-sm font-bold"><input type="checkbox" checked class="h-5 w-5 accent-black">Mélanger l’ordre des questions</label></li><li><label class="flex items-center gap-3 border-2 border-black bg-white p-3 text-sm font-bold"><input type="checkbox" class="h-5 w-5 accent-black">Autoriser la documentation (man, cours)</label></li></ul></section></div><div data-step="4" class="mt-6 hidden"><section id="pub" class="border-2 border-black bg-white" aria-labelledby="t-pub"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 "><h2 id="t-pub" 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="m6 3 14 9-14 9V3z"/></svg>5 · Publication</h2></div><div class="grid gap-4 p-4 md:grid-cols-2"><div class="border-2 border-black bg-[#FFFBEA] p-4 text-sm font-semibold"><p class="text-lg font-black">E6 blanc SISR · Adressage et VLAN</p><p class="mt-1">BTS SIO 1 · Groupe A · jeu. 08/10 · 8 h · 1 h 30</p><p class="mt-1"><span id="s-recap">0</span> questions · note sur 20 · surveillance active</p></div><div class="grid content-start gap-3"><label class="grid gap-1 text-sm font-bold">Visible par les élèves<select class="h-11 border-2 border-black bg-white px-2 font-semibold"><option>Au début de l’épreuve</option><option>Dès maintenant (date seule)</option></select></label><button type="button" class="h-12 border-2 border-black bg-[#ec3013] font-extrabold text-white shadow-[3px_3px_0px_#000000]">Programmer l’examen</button><button type="button" class="h-11 border-2 border-black bg-white text-sm font-extrabold">Enregistrer dans ma banque de sujets</button></div></div></section></div><script>document.addEventListener('DOMContentLoaded',function(){var cur=0,n=5;function go(i){cur=i;document.querySelectorAll('[data-step]').forEach(function(s){s.classList.toggle('hidden',+s.dataset.step!==i);});document.querySelectorAll('#s-steps button').forEach(function(b){var k=+b.dataset.s;b.className='flex w-full items-center gap-3 border-2 px-3 py-2 text-left text-sm font-bold '+(k===i?'border-black bg-black text-white':k<i?'border-black bg-[#7CF2C0]':'border-transparent hover:border-black');});document.getElementById('s-next').textContent=i===n-1?'Terminer':'Étape suivante →';}document.querySelectorAll('#s-steps button').forEach(function(b){b.addEventListener('click',function(){go(+b.dataset.s);});});document.getElementById('s-next').addEventListener('click',function(){go(Math.min(cur+1,n-1));});var Q=[["QCM","Quel masque donne 62 hôtes ?","Réseaux · facile",2],["Calcul","Adresse de broadcast de 192.168.10.128/26","Réseaux · moyen",3],["Lab VM","Configurer eth0 en 192.168.10.65/26","Lab · moyen",5],["Code","Script Bash qui teste 4 IP avec ping","Bash · difficile",6],["Rédaction","Expliquer l’intérêt des VLAN","Rédaction · moyen",4]],S=[0,2];function r(){document.getElementById('s-sujet').innerHTML=S.length?S.map(function(i,k){var q=Q[i];return '<li class="flex items-center gap-3 p-3"><span class="font-mono text-sm font-semibold">'+(k+1)+'</span><div class="min-w-0 flex-1"><p class="text-sm font-bold">'+q[1]+'</p><p class="text-xs font-semibold">'+q[0]+' · '+q[3]+' pts</p></div><button type="button" data-rm="'+k+'" class="h-8 border-2 border-black px-2 text-xs font-extrabold hover:bg-[#FF6FB5]">Retirer</button></li>';}).join(''):'<li class="p-6 text-center text-sm font-bold">Ajoutez des questions depuis la banque.</li>';var p=S.reduce(function(a,i){return a+Q[i][3];},0);document.getElementById('s-pts').textContent=p;document.getElementById('s-nb').textContent=S.length+' question'+(S.length>1?'s':'');document.getElementById('s-recap').textContent=S.length;document.querySelectorAll('[data-rm]').forEach(function(b){b.addEventListener('click',function(){S.splice(+b.dataset.rm,1);r();});});document.querySelectorAll('[data-add]').forEach(function(b){var on=S.indexOf(+b.dataset.add)>-1;b.textContent=on?'Ajoutée ✓':'Ajouter';b.disabled=on;b.style.background=on?'#7CF2C0':'';});}document.querySelectorAll('[data-add]').forEach(function(b){b.addEventListener('click',function(){S.push(+b.dataset.add);r();});});r();go(0);});</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>