adam/Paillasse
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
Paillasse/portail/resources/views/classes/suivi.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

158 lines
28 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.

@extends('layouts.vitrine')
@section('titre', 'Suivi de classe')
@section('contenu')
@include('partials.apercu')
<section class="border-b border-[#e3e5e8] bg-white">
<div class="mx-auto flex max-w-7xl flex-wrap items-end gap-6 px-5 pb-10 pt-10 lg:px-10">
<div class="flex-1">
<p class="font-mono text-sm font-semibold">Espace enseignant · Suivi</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-2 text-5xl font-extrabold leading-[0.95] tracking-tight sm:text-6xl">BTS SIO 1 · Groupe A</h1></div>
<p class="mt-3 text-lg font-semibold">Bloc 2 · Administration des systèmes et des réseaux · 24 élèves</p>
</div>
<div class="flex flex-wrap gap-3">
<a href="{{ route('banque') }}#flash" class="inline-flex items-center gap-3 border border-[#e3e5e8] rounded-2xl bg-[#fef7e0] px-5 py-3 font-extrabold">Quiz flash de début d’heure</a>
<a href="{{ route('devoirs') }}" class="inline-flex items-center gap-3 border border-[#e3e5e8] rounded-2xl bg-white px-5 py-3 font-extrabold hover:bg-[#fef7e0]">Devoirs maison</a>
<a href="{{ route('cours.show') }}" class="inline-flex items-center gap-3 border border-[#e3e5e8] rounded-2xl bg-white px-5 py-3 font-extrabold transition-transform hover:bg-[#fef7e0] active:shadow-none">Voir la séquence</a>
<button type="button" class="inline-flex items-center gap-3 border border-[#e3e5e8] rounded-2xl bg-white px-5 py-3 font-extrabold transition-transform hover:bg-[#fef7e0] active:shadow-none">Exporter les notes (CSV)</button>
</div>
</div>
</section>
<div class="mx-auto max-w-7xl px-5 py-10 lg:px-10">
<dl class="grid grid-cols-2 gap-5 lg:grid-cols-4">
<div class="border border-[#e3e5e8] rounded-2xl bg-[#fef7e0] p-5"><dt class="font-semibold">Progression moyenne</dt><dd class="mt-1 font-mono text-4xl font-semibold">52 %</dd></div>
<div class="border border-[#e3e5e8] rounded-2xl bg-[#eef0fd] p-5"><dt class="font-semibold">Moyenne aux QCM</dt><dd class="mt-1 font-mono text-4xl font-semibold">13,4</dd></div>
<div class="border border-[#e3e5e8] rounded-2xl bg-[#e6f4ea] p-5"><dt class="font-semibold">Actifs cette semaine</dt><dd class="mt-1 font-mono text-4xl font-semibold">21 / 24</dd></div>
<div class="border border-[#e3e5e8] rounded-2xl bg-[#ec3013] p-5 text-white"><dt class="font-semibold">À aider maintenant</dt><dd class="mt-1 font-mono text-4xl font-semibold">2</dd></div>
</dl>
<div class="mt-14 grid gap-10 lg:grid-cols-12">
<section class="lg:col-span-8" aria-labelledby="t-tab">
<h2 id="t-tab" class="text-3xl font-extrabold">Élèves</h2>
<div class="mt-5 overflow-x-auto border border-[#e3e5e8] rounded-2xl bg-white">
<table class="w-full min-w-[760px] text-left">
<thead class="bg-[#0b57d0] text-white"><tr><th class="px-4 py-3">Élève</th><th class="px-3 py-3 font-mono text-xs font-semibold">Adressage IPv4</th><th class="px-3 py-3 font-mono text-xs font-semibold">VLAN</th><th class="px-3 py-3 font-mono text-xs font-semibold">Inter-VLAN</th><th class="px-3 py-3 font-mono text-xs font-semibold">DHCP</th><th class="px-3 py-3 font-mono text-xs font-semibold">DNS BIND</th><th class="px-3 py-3">QCM</th><th class="px-3 py-3">Temps VM</th></tr></thead>
<tbody class="divide-y divide-[#e3e5e8]">
<tr class="">
<td class="px-4 py-3"><span class="flex items-center gap-3"><span class="grid h-8 w-8 place-items-center border border-[#dadce0] rounded-lg bg-[#e6f4ea] font-extrabold">L</span><span><span class="block font-extrabold">Léa M.</span><span class="block font-mono text-xs font-semibold">Terminé</span></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="3 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3 font-mono font-semibold">18/20</td>
<td class="px-3 py-3 font-mono text-sm">12 h 40</td>
</tr>
<tr class="">
<td class="px-4 py-3"><span class="flex items-center gap-3"><span class="grid h-8 w-8 place-items-center border border-[#dadce0] rounded-lg bg-white font-extrabold">Y</span><span><span class="block font-extrabold">Yanis B.</span></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="3 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="1 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3 font-mono font-semibold">14/20</td>
<td class="px-3 py-3 font-mono text-sm">9 h 10</td>
</tr>
<tr class="bg-[#FFD9E8]">
<td class="px-4 py-3"><span class="flex items-center gap-3"><span class="grid h-8 w-8 place-items-center border border-[#dadce0] rounded-lg bg-[#fce8e6] font-extrabold">N</span><span><span class="block font-extrabold">Nora Kaci</span><span class="block font-mono text-xs font-semibold">Main levée</span></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="2 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3 font-mono font-semibold">11/20</td>
<td class="px-3 py-3 font-mono text-sm">8 h 05</td>
</tr>
<tr class="">
<td class="px-4 py-3"><span class="flex items-center gap-3"><span class="grid h-8 w-8 place-items-center border border-[#dadce0] rounded-lg bg-white font-extrabold">T</span><span><span class="block font-extrabold">Tom R.</span></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="2 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3 font-mono font-semibold">16/20</td>
<td class="px-3 py-3 font-mono text-sm">10 h 30</td>
</tr>
<tr class="">
<td class="px-4 py-3"><span class="flex items-center gap-3"><span class="grid h-8 w-8 place-items-center border border-[#dadce0] rounded-lg bg-white font-extrabold">I</span><span><span class="block font-extrabold">Inès D.</span></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="2 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3 font-mono font-semibold">9/20</td>
<td class="px-3 py-3 font-mono text-sm">5 h 20</td>
</tr>
<tr class="bg-[#FFE4DF]">
<td class="px-4 py-3"><span class="flex items-center gap-3"><span class="grid h-8 w-8 place-items-center border border-[#dadce0] rounded-lg bg-[#ec3013] font-extrabold text-white">S</span><span><span class="block font-extrabold">Sami L.</span><span class="block font-mono text-xs font-semibold">Bloqué 9 min</span></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="3 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="1 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3 font-mono font-semibold">7/20</td>
<td class="px-3 py-3 font-mono text-sm">6 h 45</td>
</tr>
<tr class="">
<td class="px-4 py-3"><span class="flex items-center gap-3"><span class="grid h-8 w-8 place-items-center border border-[#dadce0] rounded-lg bg-[#e6f4ea] font-extrabold">C</span><span><span class="block font-extrabold">Chloé P.</span><span class="block font-mono text-xs font-semibold">En avance</span></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="1 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3 font-mono font-semibold">19/20</td>
<td class="px-3 py-3 font-mono text-sm">13 h 15</td>
</tr>
<tr class="">
<td class="px-4 py-3"><span class="flex items-center gap-3"><span class="grid h-8 w-8 place-items-center border border-[#dadce0] rounded-lg bg-white font-extrabold">A</span><span><span class="block font-extrabold">Adam F.</span></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="4 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="3 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-black"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3"><span class="grid grid-cols-4 gap-0.5" title="0 / 4 étapes"><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span><span class="h-4 w-3 border border-[#dadce0] rounded-lg bg-white"></span></span></td>
<td class="px-3 py-3 font-mono font-semibold">13/20</td>
<td class="px-3 py-3 font-mono text-sm">8 h 50</td>
</tr>
</tbody>
</table>
</div>
<p class="mt-4 font-semibold">8 élèves sur 24 affichés · triés par besoin d’aide</p>
</section>
<aside class="grid content-start gap-8 lg:col-span-4">
<section class="border border-[#e3e5e8] rounded-2xl bg-[#fce8e6] p-6" aria-labelledby="t-nora">
<p class="font-mono text-sm font-semibold">Fiche élève</p>
<h2 id="t-nora" class="mt-1 text-3xl font-extrabold">Nora Kaci</h2>
<ol class="mt-5 grid gap-3 border-l border-[#e3e5e8] pl-4 font-semibold">
<li><span class="font-mono text-xs">10:42</span><br>Main levée · Inter-VLAN, étape 3</li>
<li><span class="font-mono text-xs">10:31</span><br>Étape 2 validée après 3 essais</li>
<li><span class="font-mono text-xs">Mar.</span><br>QCM Adressage IPv4 : 11/20. Erreurs sur le calcul de l’adresse réseau (/22).</li>
</ol>
<div class="mt-6 flex flex-wrap gap-3">
<a href="{{ route('labs.essai') }}" class="border border-[#e3e5e8] rounded-2xl bg-white px-4 py-2 font-extrabold hover:bg-[#fef7e0]">Ouvrir sa console</a>
<a href="{{ route('cours.show') }}" class="border border-[#e3e5e8] rounded-2xl bg-black px-4 py-2 font-extrabold text-white hover:bg-[#13233A]">Lui assigner le TD</a>
</div>
</section>
<section class="border border-[#e3e5e8] rounded-2xl bg-white p-6" aria-labelledby="t-exam">
<h2 id="t-exam" class="text-3xl font-extrabold">Mode examen</h2>
<a href="{{ route('banque') }}" class="mt-3 inline-block font-extrabold underline underline-offset-4">Composer un sujet dans la banque →</a>
<form action="{{ route('examen') }}" method="get" class="mt-5 grid gap-4">
<label class="grid gap-2 font-extrabold">Épreuve<select class="w-full border border-[#e3e5e8] rounded-2xl bg-white px-4 py-3 text-lg font-semibold text-black placeholder:text-[#444141] focus:bg-[#f8f9fa] focus:outline-none"><option>Adressage et VLAN · E6 blanc SISR</option><option>QCM Bloc 2</option></select></label>
<label class="grid gap-2 font-extrabold">Durée<select class="w-full border border-[#e3e5e8] rounded-2xl bg-white px-4 py-3 text-lg font-semibold text-black placeholder:text-[#444141] focus:bg-[#f8f9fa] focus:outline-none"><option>1 h</option><option>2 h</option><option>4 h</option></select></label>
<fieldset class="grid gap-2 font-semibold">
<legend class="font-extrabold">Pendant l’épreuve</legend>
<label class="flex items-center gap-3"><input type="checkbox" checked class="h-5 w-5 accent-black"> Indices désactivés</label>
<label class="flex items-center gap-3"><input type="checkbox" checked class="h-5 w-5 accent-black"> Copier-coller bloqué</label>
<label class="flex items-center gap-3"><input type="checkbox" checked class="h-5 w-5 accent-black"> Sortie d’onglet signalée</label>
<label class="flex items-center gap-3"><input type="checkbox" class="h-5 w-5 accent-black"> Ordre des questions mélangé</label>
</fieldset>
<button type="submit" class="inline-flex items-center gap-4 border border-[#e3e5e8] rounded-2xl bg-black px-6 py-4 text-lg font-extrabold text-white transition-transform hover:bg-[#ec3013].5.5 active:shadow-none">Lancer l’examen</button>
</form>
</section>
</aside>
</div>
</div>
@endsection
Reference in a new issue View git blame Copy permalink