Paillasse/portail/resources/views/sujet-creer.blade.php
Adam Belkacemi e4a6aaebb1 ajoute les pages légales, la purge RGPD et sert polices et scripts depuis le portail
Pages /legal et /confidentialite réécrites d'après le système réel, purge
des classes archivées depuis 90 jours (prouvée par Pest), archivage côté
prof. Polices, xterm.js et CodeMirror ne sont plus chargés depuis Google
ni jsDelivr. Pages d'aperçu signalées, sans vrais établissements ni faux
chiffres. Journaux Laravel gardés 14 jours.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-09 21:07:25 +02:00

66 lines
37 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>Créer un sujet d’examen · Syllabus</title>
{{ Vite::fonts() }}
<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="{{ asset('vendor/xterm/xterm.css') }}">
<script defer src="{{ asset('vendor/xterm/xterm.js') }}"></script>
<script defer src="{{ asset('vendor/xterm/addon-fit.js') }}"></script>
<script defer src="{{ asset('js/paillasse-terminal.js') }}"></script>
<link rel="stylesheet" href="{{ asset('css/syllabus-theme.css') }}">
</head>
<body class="bg-white font-display text-black antialiased">
@include('partials.apercu')
<header style="position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid #e3e5e8">
<nav aria-label="Navigation principale" style="position:relative;max-width:1200px;margin:0 auto;padding:0 20px;min-height:64px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 40px">
<a href="{{ route('accueil') }}" aria-label="Syllabus, accueil" style="display:flex;align-items:center;gap:0;text-decoration:none"><img src="{{ asset('images/logo-syllabus-icone.png') }}" alt="" style="height:32px;width:auto;display:block"><span style="font-family:Mulish,system-ui,sans-serif;font-weight:800;font-size:19px;color:#111827;letter-spacing:-0.01em;margin-left:-14px;position:relative">Syllabus</span></a>
<ul style="margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;flex:1;line-height:1.5"><li><details class="group"><summary @if(request()->routeIs('fonctionnalites') || request()->routeIs('ressource')) aria-current="page" @endif style="cursor:pointer;list-style:none;display:flex;align-items:center;gap:6px;height:36px;margin:-6px -12px;padding:0 12px;border-radius:999px;line-height:1.5;font-size:15px;font-weight:600;color:#0b1220" class="hover:bg-[#f1f3f4] group-open:bg-[#e8f0fe] group-open:text-[#0b57d0] aria-[current=page]:text-[#0b57d0] [&::-webkit-details-marker]:hidden">Fonctionnalités<svg aria-hidden="true" viewBox="0 0 16 16" width="16" height="16" class="transition-transform duration-200 group-open:rotate-180" style="flex:none;opacity:.7"><path d="M4 6l4 4 4-4" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/></svg></summary>
<div style="position:absolute;left:20px;right:20px;top:100%;margin-top:4px;z-index:50;max-width:1160px;margin-left:auto;margin-right:auto;box-sizing:border-box;max-height:calc(100vh - 90px);overflow:auto;border-radius:20px;background:#fff;border:1px solid #e3e5e8;box-shadow:0 24px 48px -16px rgba(15,23,42,.22)">
<div class="grid grid-cols-2 sm:grid-cols-3 min-[1100px]:grid-cols-5 [&>div:last-child]:col-span-2 min-[1100px]:[&>div:last-child]:col-span-1" style="gap:1px;background:#e3e5e8"><div style="padding:22px 20px 20px;min-width:0;background:#fff"><p style="margin:0;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800;color:#0b1220"><span aria-hidden="true" style="flex:none;width:10px;height:10px;border-radius:3px;background:#0b57d0"></span>Piloter la classe</p><p style="margin:4px 0 0 20px;min-height:32px;font-size:12px;line-height:16px;font-weight:500;color:#5f6368">En direct et au quotidien</p><ul style="margin:10px 0 0 20px;padding:12px 0 0;border-top:1px solid #f1f3f4;list-style:none;display:grid;gap:2px"><li><a href="{{ route('ressource') }}?outil=cockpit" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Tableau de bord prof</a></li><li><a href="{{ route('ressource') }}?outil=visio" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Visio de classe</a></li><li><a href="{{ route('ressource') }}?outil=espace-eleve" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Espace élève</a></li><li><a href="{{ route('ressource') }}?outil=fiche-eleve" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Fiche élève</a></li><li><a href="{{ route('ressource') }}?outil=messagerie" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Messagerie</a></li></ul></div><div style="padding:22px 20px 20px;min-width:0;background:#fff"><p style="margin:0;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800;color:#0b1220"><span aria-hidden="true" style="flex:none;width:10px;height:10px;border-radius:3px;background:#137333"></span>Apprendre</p><p style="margin:4px 0 0 20px;min-height:32px;font-size:12px;line-height:16px;font-weight:500;color:#5f6368">Cours, TP et code</p><ul style="margin:10px 0 0 20px;padding:12px 0 0;border-top:1px solid #f1f3f4;list-style:none;display:grid;gap:2px"><li><a href="{{ route('ressource') }}?outil=cours" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Cours gratuits</a></li><li><a href="{{ route('ressource') }}?outil=labs" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">TP sur machine Linux</a></li><li><a href="{{ route('ressource') }}?outil=lab-web" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Lab web</a></li><li><a href="{{ route('ressource') }}?outil=ide" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Éditeur de code en ligne</a></li><li><a href="{{ route('ressource') }}?outil=maison" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Ressources à la maison</a></li></ul></div><div style="padding:22px 20px 20px;min-width:0;background:#fff"><p style="margin:0;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800;color:#0b1220"><span aria-hidden="true" style="flex:none;width:10px;height:10px;border-radius:3px;background:#b06000"></span>Préparer</p><p style="margin:4px 0 0 20px;min-height:32px;font-size:12px;line-height:16px;font-weight:500;color:#5f6368">Prêt à projeter ou imprimer</p><ul style="margin:10px 0 0 20px;padding:12px 0 0;border-top:1px solid #f1f3f4;list-style:none;display:grid;gap:2px"><li><a href="{{ route('ressource') }}?outil=bibliotheque" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Bibliothèque du prof</a></li><li><a href="{{ route('ressource') }}?outil=banque" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Banque de sujets</a></li><li><a href="{{ route('ressource') }}?outil=generateur" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Générateur de TD</a></li><li><a href="{{ route('ressource') }}?outil=td-imprimable" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">TD à imprimer</a></li></ul></div><div style="padding:22px 20px 20px;min-width:0;background:#fff"><p style="margin:0;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800;color:#0b1220"><span aria-hidden="true" style="flex:none;width:10px;height:10px;border-radius:3px;background:#c5221f"></span>Évaluer</p><p style="margin:4px 0 0 20px;min-height:32px;font-size:12px;line-height:16px;font-weight:500;color:#5f6368">Quiz, examens, devoirs</p><ul style="margin:10px 0 0 20px;padding:12px 0 0;border-top:1px solid #f1f3f4;list-style:none;display:grid;gap:2px"><li><a href="{{ route('ressource') }}?outil=quiz" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Quiz flash</a></li><li><a href="{{ route('ressource') }}?outil=sujet" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Créer un sujet</a></li><li><a href="{{ route('ressource') }}?outil=devoirs" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Devoirs maison</a></li><li><a href="{{ route('ressource') }}?outil=correction" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Corriger les copies</a></li><li><a href="{{ route('ressource') }}?outil=export" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Export Pronote / ENT</a></li></ul></div><div style="padding:22px 20px 20px;min-width:0;background:#fff"><p style="margin:0;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800;color:#0b1220"><span aria-hidden="true" style="flex:none;width:10px;height:10px;border-radius:3px;background:#8430ce"></span>Établissement</p><p style="margin:4px 0 0 20px;min-height:32px;font-size:12px;line-height:16px;font-weight:500;color:#5f6368">Vie scolaire, direction, DSI</p><ul style="margin:10px 0 0 20px;padding:12px 0 0;border-top:1px solid #f1f3f4;list-style:none;display:grid;gap:2px"><li><a href="{{ route('ressource') }}?outil=vie-scolaire" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Vie scolaire</a></li><li><a href="{{ route('ressource') }}?outil=cohortes" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Suivi des cohortes</a></li><li><a href="{{ route('ressource') }}?outil=espace-etablissement" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Espace établissement</a></li><li><a href="{{ route('ressource') }}?outil=academie" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Académie</a></li><li><a href="{{ route('ressource') }}?outil=integration" style="display:block;margin:0 -8px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;font-weight:600;color:#0b1220;text-decoration:none" class="hover:bg-[#f1f3f4] hover:text-[#0b57d0]">Intégration et sécurité</a></li></ul></div></div>
<div style="position:sticky;bottom:0;padding:14px 24px;border-top:1px solid #e3e5e8;background:#f8f9fa;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px"><span style="font-size:14px;font-weight:500;color:#5f6368">24 outils, chacun avec sa présentation et sa démo</span><a href="{{ route('fonctionnalites') }}" style="font-size:15px;font-weight:700;color:#0b57d0;text-decoration:none">Voir toutes les fonctionnalités →</a></div>
</div></details></li><li><a href="{{ route('cours.index') }}" @if(request()->routeIs('cours.index')) aria-current="page" @endif style="display:inline-flex;align-items:center;height:24px;line-height:1.5;font-size:15px;font-weight:600;color:#0b1220;text-decoration:none" class="hover:text-[#0b57d0] aria-[current=page]:text-[#0b57d0]">Cours</a></li><li><a href="{{ route('tarifs') }}" @if(request()->routeIs('tarifs')) aria-current="page" @endif style="display:inline-flex;align-items:center;height:24px;line-height:1.5;font-size:15px;font-weight:600;color:#0b1220;text-decoration:none" class="hover:text-[#0b57d0] aria-[current=page]:text-[#0b57d0]">Tarifs</a></li></ul>
<div style="display:flex;align-items:center;gap:20px">
<a href="{{ route('login') }}" style="font-size:15px;font-weight:600;color:#0b1220;text-decoration:none" class="hover:text-[#0b57d0]">Se connecter</a>
<a href="{{ route('register') }}" style="display:inline-flex;align-items:center;height:40px;padding:0 20px;border-radius:999px;background:#0b57d0;color:#fff;font-size:15px;font-weight:700;text-decoration:none">Créer une classe</a>
</div>
</nav>
</header>
<main>
<div class="border-b border-[#e3e5e8] bg-[#f8f9fa]"><div class="mx-auto grid max-w-[1600px] lg:grid-cols-[240px_minmax(0,1fr)]"><aside class="border-b border-[#e3e5e8] 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 border-[#dadce0] rounded-lg bg-[#f8f9fa] p-3 text-sm font-semibold"><p class="font-extrabold">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><div class="min-w-0 flex-1"><p data-public="P" class="mb-2 inline-flex items-center gap-2 rounded-full border border-[#b8c1cf] bg-white px-3 py-1 text-sm font-bold text-[#1d3fa8]">Pour les profs</p>
<h1 class="mt-1 text-4xl font-extrabold tracking-tight">Créer un sujet d’examen</h1></div><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 border-[#dadce0] rounded-lg px-4 text-sm font-extrabold bg-white hover:bg-[#f8f9fa]"><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 border-[#dadce0] rounded-lg bg-black px-4 text-sm font-extrabold text-white">Étape suivante →</button></div></div><div data-step="0" class="mt-6"><section id="cadre" class="border border-[#dadce0] rounded-lg bg-white" aria-labelledby="t-cadre"><div class="flex flex-wrap items-center justify-between gap-3 border-b border-[#e3e5e8] p-4"><h2 id="t-cadre" class="flex items-center gap-2 text-lg font-extrabold"><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 border-[#dadce0] rounded-lg bg-white px-3 font-semibold"></label><label class="grid gap-1 text-sm font-bold">Classe<select class="h-11 border border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg bg-white px-3 font-semibold"></label><label class="grid gap-1 text-sm font-bold">Durée<select class="h-11 border border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg bg-white" aria-labelledby="t-banque"><div class="flex flex-wrap items-center justify-between gap-3 border-b border-[#e3e5e8] p-4"><h2 id="t-banque" class="flex items-center gap-2 text-lg font-extrabold"><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 border-[#e3e5e8] p-3"><input class="h-10 min-w-0 flex-1 border border-[#dadce0] rounded-lg px-2 text-sm" placeholder="Rechercher : VLAN, masque, Bash…"><select class="h-10 border border-[#dadce0] rounded-lg 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 divide-[#e3e5e8]"><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border border-[#dadce0] rounded-lg bg-[#f8f9fa] 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 border-[#dadce0] rounded-lg px-3 text-xs font-extrabold hover:bg-[#0b57d0] hover:text-white">Ajouter</button></li><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border border-[#dadce0] rounded-lg bg-[#f8f9fa] 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 border-[#dadce0] rounded-lg px-3 text-xs font-extrabold hover:bg-[#0b57d0] hover:text-white">Ajouter</button></li><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border border-[#dadce0] rounded-lg bg-[#f8f9fa] 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 border-[#dadce0] rounded-lg px-3 text-xs font-extrabold hover:bg-[#0b57d0] hover:text-white">Ajouter</button></li><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border border-[#dadce0] rounded-lg bg-[#f8f9fa] 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 border-[#dadce0] rounded-lg px-3 text-xs font-extrabold hover:bg-[#0b57d0] hover:text-white">Ajouter</button></li><li class="flex items-center gap-3 p-3"><span class="w-16 shrink-0 border border-[#dadce0] rounded-lg bg-[#f8f9fa] 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 border-[#dadce0] rounded-lg px-3 text-xs font-extrabold hover:bg-[#0b57d0] hover:text-white">Ajouter</button></li></ul></section><section id="sujet" class="border border-[#dadce0] rounded-lg bg-white" aria-labelledby="t-sujet"><div class="flex flex-wrap items-center justify-between gap-3 border-b border-[#e3e5e8] p-4"><h2 id="t-sujet" class="flex items-center gap-2 text-lg font-extrabold"><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 border-[#dadce0] rounded-lg px-4 text-sm font-extrabold bg-white text-xs h-9">+ Question perso</button></div><ol id="s-sujet" class="divide-y divide-[#e3e5e8]"></ol><div class="flex justify-between border-t border-[#e3e5e8] 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 border-[#dadce0] rounded-lg bg-white" aria-labelledby="t-bareme"><div class="flex flex-wrap items-center justify-between gap-3 border-b border-[#e3e5e8] p-4"><h2 id="t-bareme" class="flex items-center gap-2 text-lg font-extrabold"><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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg bg-white px-2 font-semibold"><option>Pré-correction automatique + validation</option><option>Manuelle</option></select></label></div><p class="border-t border-[#e3e5e8] bg-[#f8f9fa] 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 border-[#dadce0] rounded-lg bg-white" aria-labelledby="t-surv"><div class="flex flex-wrap items-center justify-between gap-3 border-b border-[#e3e5e8] p-4"><h2 id="t-surv" class="flex items-center gap-2 text-lg font-extrabold"><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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg bg-white" aria-labelledby="t-pub"><div class="flex flex-wrap items-center justify-between gap-3 border-b border-[#e3e5e8] p-4"><h2 id="t-pub" class="flex items-center gap-2 text-lg font-extrabold"><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 border-[#dadce0] rounded-lg bg-[#f8f9fa] p-4 text-sm font-semibold"><p class="text-lg font-extrabold">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 border-[#dadce0] rounded-lg 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 border-[#dadce0] rounded-lg bg-[#ec3013] font-extrabold text-white">Programmer l’examen</button><button type="button" class="h-11 border border-[#dadce0] rounded-lg 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-[#0b57d0] text-white':k<i?'border-black bg-[#e6f4ea]':'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 border-[#dadce0] rounded-lg px-2 text-xs font-extrabold hover:bg-[#fce8e6]">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 style="background:#f8f9fa;border-top:1px solid #e3e5e8;font-family:Mulish,system-ui,sans-serif">
<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 style="margin:0;font-size:18px;font-weight:800;color:#0b1220">Syllabus</p>
<p style="margin:10px 0 0;font-size:14px;line-height:1.6;font-weight:500;color:#5f6368">Cours, labs, IDE et examens en ligne, du lycée au master.</p>
</div>
<nav aria-label="Produit"><p style="margin:0;font-size:13px;font-weight:800;color:#0b1220">Produit</p><ul style="margin:14px 0 0;padding:0;list-style:none;display:grid;gap:10px"><li><a href="{{ route('fonctionnalites') }}" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Fonctionnalités</a></li><li><a href="{{ route('cours.index') }}" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Cours gratuits</a></li><li><a href="{{ route('labs.essai') }}" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Essayer un lab</a></li><li><a href="{{ route('tarifs') }}" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Tarifs</a></li></ul></nav><nav aria-label="Outils"><p style="margin:0;font-size:13px;font-weight:800;color:#0b1220">Outils</p><ul style="margin:14px 0 0;padding:0;list-style:none;display:grid;gap:10px"><li><a href="{{ route('ressource') }}?outil=cockpit" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Tableau de bord prof</a></li><li><a href="{{ route('ressource') }}?outil=labs" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">TP sur machine Linux</a></li><li><a href="{{ route('ressource') }}?outil=ide" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Éditeur de code</a></li><li><a href="{{ route('ressource') }}?outil=quiz" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Quiz flash</a></li><li><a href="{{ route('ressource') }}?outil=sujet" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Examens</a></li><li><a href="{{ route('ressource') }}?outil=bibliotheque" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Bibliothèque du prof</a></li></ul></nav><nav aria-label="Établissements"><p style="margin:0;font-size:13px;font-weight:800;color:#0b1220">Établissements</p><ul style="margin:14px 0 0;padding:0;list-style:none;display:grid;gap:10px"><li><a href="{{ route('etablissements') }}" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Équiper une classe</a></li><li><a href="{{ route('ressource') }}?outil=vie-scolaire" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Vie scolaire</a></li><li><a href="{{ route('ressource') }}?outil=espace-etablissement" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Licences et factures</a></li><li><a href="{{ route('ressource') }}?outil=integration" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Intégration et sécurité</a></li></ul></nav><nav aria-label="Syllabus"><p style="margin:0;font-size:13px;font-weight:800;color:#0b1220">Syllabus</p><ul style="margin:14px 0 0;padding:0;list-style:none;display:grid;gap:10px"><li><a href="{{ route('aide') }}" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Aide et tutoriels</a></li><li><a href="{{ route('legal') }}" style="font-size:14px;font-weight:500;color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Mentions légales et RGPD</a></li></ul></nav>
<p style="margin:0;align-self:start;font-size:14px;font-weight:600;color:#5f6368"><span style="color:#137333">●</span> Tous les services fonctionnent</p>
</div>
<div style="border-top:1px solid #e3e5e8"><ul aria-label="Engagements" style="max-width:1200px;margin:0 auto;padding:24px 20px;list-style:none;display:flex;flex-wrap:wrap;gap:12px 40px"><li style="font-size:14px;font-weight:700;color:#0b1220">Hébergé en France</li><li style="font-size:14px;font-weight:700;color:#0b1220"><a href="{{ route('confidentialite') }}" style="color:#0b1220">Conforme au RGPD</a> <span style="font-weight:500;color:#5f6368">· données minimisées</span></li><li style="font-size:14px;font-weight:700;color:#0b1220">6 cursus <span style="font-weight:500;color:#5f6368">· du lycée au BUT</span></li><li style="font-size:14px;font-weight:700;color:#0b1220">0 € <span style="font-weight:500;color:#5f6368">· sans carte bancaire</span></li></ul>
</div>
<div style="border-top:1px solid #e3e5e8">
<div class="mx-auto flex max-w-7xl flex-wrap items-center justify-center gap-x-6 gap-y-2 px-5 py-4 lg:px-10"><nav aria-label="Informations légales"><ul class="flex flex-wrap justify-center gap-x-5 gap-y-1" style="margin:0;padding:0;list-style:none;font-size:14px;font-weight:500"><li><a href="{{ route('legal') }}#mentions" style="color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Mentions légales</a></li><li><a href="{{ route('legal') }}#cgu" style="color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">CGU</a></li><li><a href="{{ route('confidentialite') }}#confidentialite" style="color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Confidentialité et RGPD</a></li><li><a href="{{ route('confidentialite') }}#cookies" style="color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Cookies</a></li><li><a href="{{ route('confidentialite') }}#sous-traitance" style="color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Sous-traitance</a></li><li><a href="{{ route('statut') }}" style="color:#5f6368;text-decoration:none" class="hover:text-[#0b57d0]">Statut du service</a></li></ul></nav></div>
</div>
</footer>
</body>
</html>