2026-10-08 02:01:58 +02:00
<! DOCTYPE html >
< html lang = " fr " >
< head >
< meta charset = " utf-8 " >
< meta name = " viewport " content = " width=device-width, initial-scale=1 " >
< title > Mon espace élève · Syllabus </ title >
2026-10-09 21:07:25 +02:00
{{ Vite :: fonts () }}
2026-10-08 02:01:58 +02:00
< 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 ( 135 deg , 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 , 0 deg )); } 50 % { transform : translateY ( - 10 px ) rotate ( var ( -- r , 0 deg )); } }
. flotte { animation : flotte 6 s ease - in - out infinite ; }
@ keyframes clignote { 50 % { opacity : 0 ; } }
. curseur { animation : clignote 1 s steps ( 1 ) infinite ; }
@ media ( prefers - reduced - motion : reduce ) { . flotte , . curseur { animation : none ; } }
</ style >
2026-10-09 21:07:25 +02:00
< 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 >
2026-10-08 02:01:58 +02:00
< 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 " >
2026-10-09 21:07:25 +02:00
@ include ( 'partials.apercu' )
2026-10-08 02:01:58 +02:00
< 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
< 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 " >
< div class = " flex items-center gap-3 " >< span class = " grid h-11 w-11 place-items-center border border-[#dadce0] rounded-lg bg-[#fef7e0] font-mono text-sm font-semibold " > SN </ span >< div >< p class = " font-extrabold leading-tight " > Sarah N .</ p >< p class = " text-sm font-semibold " > BTS SIO 1 · Groupe A </ p ></ div ></ div >
< p class = " mt-6 font-mono text-[11px] font-semibold uppercase tracking-wider " > Mon espace </ p >
< ul class = " mt-2 grid gap-1 " >< li >< a href = " #vue " class = " flex items-center gap-3 border border-[#dadce0] rounded-lg bg-[#0b57d0] text-white px-3 py-2 text-sm font-bold " >< svg viewBox = " 0 0 24 24 " class = " h-4 w-4 shrink-0 " fill = " none " stroke = " currentColor " stroke - width = " 2.2 " stroke - linecap = " round " stroke - linejoin = " round " aria - hidden = " true " >< path d = " M3 3h7v7H3zM14 3h7v7h-7zM3 14h7v7H3zM14 14h7v7h-7z " /></ svg >< span class = " flex-1 " > Aujourd’ </ span ></ a ></ li >< li >< a href = " #calendrier " class = " flex items-center gap-3 border-2 border-transparent hover:border-black px-3 py-2 text-sm font-bold " >< svg viewBox = " 0 0 24 24 " class = " h-4 w-4 shrink-0 " fill = " none " stroke = " currentColor " stroke - width = " 2.2 " stroke - linecap = " round " stroke - linejoin = " round " aria - hidden = " true " >< rect x = " 3 " y = " 4 " width = " 18 " height = " 18 " />< path d = " M16 2v4M8 2v4M3 10h18 " /></ svg >< span class = " flex-1 " > Calendrier </ span ></ a ></ li >< li >< a href = " #devoirs " class = " flex items-center gap-3 border-2 border-transparent hover:border-black px-3 py-2 text-sm font-bold " >< svg viewBox = " 0 0 24 24 " class = " h-4 w-4 shrink-0 " fill = " none " stroke = " currentColor " stroke - width = " 2.2 " stroke - linecap = " round " stroke - linejoin = " round " aria - hidden = " true " >< path d = " M4 19.5A2.5 2.5 0 0 1 6.5 17H20V2H6.5A2.5 2.5 0 0 0 4 4.5v15z " />< path d = " M6.5 17H20v5H6.5A2.5 2.5 0 0 1 4 19.5 " /></ svg >< span class = " flex-1 " > Devoirs </ span ></ a ></ li >< li >< a href = " #examens " class = " flex items-center gap-3 border-2 border-transparent hover:border-black px-3 py-2 text-sm font-bold " >< svg viewBox = " 0 0 24 24 " class = " h-4 w-4 shrink-0 " fill = " none " stroke = " currentColor " stroke - width = " 2.2 " stroke - linecap = " round " stroke - linejoin = " round " aria - hidden = " true " >< path d = " M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z " /></ svg >< span class = " flex-1 " > Examens à venir </ span ></ a ></ li >< li >< a href = " #entrainement " class = " flex items-center gap-3 border-2 border-transparent hover:border-black px-3 py-2 text-sm font-bold " >< svg viewBox = " 0 0 24 24 " class = " h-4 w-4 shrink-0 " fill = " none " stroke = " currentColor " stroke - width = " 2.2 " stroke - linecap = " round " stroke - linejoin = " round " aria - hidden = " true " >< path d = " m16 18 6-6-6-6M8 6l-6 6 6 6 " /></ svg >< span class = " flex-1 " > S’ </ span ></ a ></ li >< li >< a href = " #progres " class = " flex items-center gap-3 border-2 border-transparent hover:border-black px-3 py-2 text-sm font-bold " >< svg viewBox = " 0 0 24 24 " class = " h-4 w-4 shrink-0 " fill = " none " stroke = " currentColor " stroke - width = " 2.2 " stroke - linecap = " round " stroke - linejoin = " round " aria - hidden = " true " >< path d = " M6 9H4a2 2 0 0 1 0-4h2M18 9h2a2 2 0 0 0 0-4h-2M4 22h16M10 14.7V17c0 .6-.5 1-1 1.2C7.8 18.8 7 20.2 7 22M14 14.7V17c0 .6.5 1 1 1.2 1.2.6 2 2 2 3.8M18 2H6v7a6 6 0 0 0 12 0V2z " /></ svg >< span class = " flex-1 " > Ma progression </ span ></ a ></ li ></ ul >
< button type = " button " id = " e-main " class = " mt-6 flex h-12 w-full items-center justify-center gap-2 border border-[#dadce0] rounded-lg bg-[#fce8e6] text-sm font-extrabold active:shadow-none " >< 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 = " M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v6M10 10.5V6a2 2 0 0 0-4 0v8 " />< path d = " M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.9-6-2.4l-3.6-3.6a2 2 0 0 1 2.8-2.8L7 15 " /></ svg >< span > Lever la main </ span ></ button >
< p id = " e-main-info " class = " mt-2 hidden text-center text-xs font-bold " aria - live = " polite " > Main levée · 2 < sup > e </ sup > dans la file </ p >
</ aside >
< div class = " min-w-0 p-5 lg:p-8 " >
< div id = " vue " class = " flex flex-wrap items-end justify-between gap-4 " >
< div >< p class = " font-mono text-xs font-semibold " > Mon espace élève </ p >< div class = " min-w-0 flex-1 " >< p data - public = " E " 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-[#0b5e3c] " > Pour les élèves </ p >
< h1 class = " mt-1 text-4xl font-extrabold tracking-tight " > Bonjour Sarah & nbsp ; !</ h1 ></ div >< p class = " mt-1 font-semibold " > Mardi 29 septembre · 2 devoirs cette semaine · 1 examen dans 9 jours </ p ></ div >
< a href = " { { route('labs.essai') }} " class = " inline-flex h-11 items-center gap-2 border border-[#dadce0] rounded-lg bg-black px-4 text-sm font-extrabold text-white hover:bg-[#13233A] " >< 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 > Reprendre le lab VLAN · étape 6 </ a >
</ div >
< ul class = " mt-6 grid grid-cols-2 gap-4 md:grid-cols-4 " aria - label = " Mes indicateurs " >
< li class = " flex flex-col border border-[#dadce0] rounded-lg bg-white p-4 " >< div class = " flex items-center justify-between gap-2 " >< p class = " text-sm font-bold " > Moyenne QCM </ p >< span class = " h-2.5 w-2.5 bg-[#fef7e0] " ></ span ></ div >< p class = " mt-2 font-mono text-3xl font-semibold leading-none " > 16 , 0 </ p >< p class = " mt-3 text-xs font-bold " >+ 1 , 2 sur 4 semaines </ p ></ li >< li class = " flex flex-col border border-[#dadce0] rounded-lg bg-white p-4 " >< div class = " flex items-center justify-between gap-2 " >< p class = " text-sm font-bold " > Labs réussis </ p >< span class = " h-2.5 w-2.5 bg-[#e6f4ea] " ></ span ></ div >< p class = " mt-2 font-mono text-3xl font-semibold leading-none " > 11 / 14 </ p >< p class = " mt-3 text-xs font-bold " > dont 3 sans indice </ p ></ li >< li class = " flex flex-col border border-[#dadce0] rounded-lg bg-white p-4 " >< div class = " flex items-center justify-between gap-2 " >< p class = " text-sm font-bold " > Devoirs à rendre </ p >< span class = " h-2.5 w-2.5 bg-[#eef0fd] " ></ span ></ div >< p class = " mt-2 font-mono text-3xl font-semibold leading-none " > 2 </ p >< p class = " mt-3 text-xs font-bold " > le prochain vendredi </ p ></ li >< li class = " flex flex-col border border-[#dadce0] rounded-lg bg-white p-4 " >< div class = " flex items-center justify-between gap-2 " >< p class = " text-sm font-bold " > Série </ p >< span class = " h-2.5 w-2.5 bg-[#fce8e6] " ></ span ></ div >< p class = " mt-2 font-mono text-3xl font-semibold leading-none " > 6 j </ p >< p class = " mt-3 text-xs font-bold " > d’ d’ </ p ></ li >
</ ul >
< div class = " mt-6 grid gap-6 xl:grid-cols-[minmax(0,1.4fr)_minmax(0,1fr)] " >
< section id = " calendrier " class = " border border-[#dadce0] rounded-lg bg-white " aria - labelledby = " t-cal " >
< div class = " flex items-center justify-between gap-3 border-b border-[#e3e5e8] p-4 " >< h2 id = " t-cal " 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 " >< rect x = " 3 " y = " 4 " width = " 18 " height = " 18 " />< path d = " M16 2v4M8 2v4M3 10h18 " /></ svg >< span id = " e-mois " > Septembre – octobre 2026 </ span ></ h2 >< div class = " flex gap-1 " >< button type = " button " id = " e-prev " class = " grid h-9 w-9 place-items-center border border-[#dadce0] rounded-lg font-extrabold hover:bg-[#f8f9fa] " aria - label = " Semaine précédente " > ← </ button >< button type = " button " id = " e-next " class = " grid h-9 w-9 place-items-center border border-[#dadce0] rounded-lg font-extrabold hover:bg-[#f8f9fa] " aria - label = " Semaine suivante " > → </ button ></ div ></ div >
< div class = " grid grid-cols-7 border-b border-[#e3e5e8] bg-[#f8f9fa] font-mono text-[11px] font-semibold uppercase " >< p class = " px-2 py-2 " > Lun </ p >< p class = " px-2 py-2 " > Mar </ p >< p class = " px-2 py-2 " > Mer </ p >< p class = " px-2 py-2 " > Jeu </ p >< p class = " px-2 py-2 " > Ven </ p >< p class = " px-2 py-2 " > Sam </ p >< p class = " px-2 py-2 " > Dim </ p ></ div >
< div id = " e-grille " class = " grid grid-cols-7 " ></ div >
< div class = " flex flex-wrap gap-4 border-t border-[#e3e5e8] p-3 text-xs font-bold " >< span class = " flex items-center gap-2 " >< span class = " h-3 w-3 border border-[#dadce0] rounded-lg " style = " background:#ec3013 " ></ span > Examen </ span >< span class = " flex items-center gap-2 " >< span class = " h-3 w-3 border border-[#dadce0] rounded-lg " style = " background:#C4B5FD " ></ span > Devoir </ span >< span class = " flex items-center gap-2 " >< span class = " h-3 w-3 border border-[#dadce0] rounded-lg " style = " background:#FFD23F " ></ span > Quiz </ span >< span class = " flex items-center gap-2 " >< span class = " h-3 w-3 border border-[#dadce0] rounded-lg " style = " background:#7CF2C0 " ></ span > Cours / TP </ span ></ div >
</ section >
< section class = " border border-[#dadce0] rounded-lg bg-white " aria - labelledby = " t-jour " >
< div class = " border-b border-[#e3e5e8] p-4 " >< h2 id = " t-jour " class = " text-lg font-extrabold " > Au programme </ h2 >< p id = " e-jour-titre " class = " font-mono text-xs font-semibold " > mardi 29 / 09 </ p ></ div >
< ol id = " e-jour " class = " divide-y divide-[#e3e5e8] " ></ ol >
</ section >
</ div >
< div class = " mt-6 grid gap-6 xl:grid-cols-2 " >
< section id = " devoirs " class = " border border-[#dadce0] rounded-lg bg-white " aria - labelledby = " t-dev " >
< div class = " flex items-center justify-between border-b border-[#e3e5e8] bg-[#eef0fd] p-4 " >< h2 id = " t-dev " 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 " />< path d = " M6.5 17H20v5H6.5A2.5 2.5 0 0 1 4 19.5 " /></ svg > Mes devoirs </ h2 >< span class = " font-mono text-xs font-semibold " > 2 à rendre </ span ></ div >
< ul class = " divide-y divide-[#e3e5e8] " >< li class = " grid grid-cols-[minmax(0,1fr)_auto] items-center gap-x-4 gap-y-2 p-4 " >< div >< p class = " font-bold " > DM 3 · Plan d’ </ p >< p class = " text-sm font-semibold " > Réseaux · M . Belkacemi · < span class = " font-mono " > ven . 03 / 10 · 23 h 59 </ span ></ p ></ div >< a href = " { { route('devoirs') }} " class = " border border-[#dadce0] rounded-lg px-3 py-1 text-xs font-extrabold bg-white hover:bg-[#0b57d0] hover:text-white " > À rendre </ a >< div class = " col-span-2 flex items-center gap-2 " >< div class = " h-2 flex-1 border border-[#dadce0] rounded-lg " >< div class = " h-full bg-black " style = " width:60% " ></ div ></ div >< span class = " font-mono text-xs font-semibold " > 60 %</ span ></ div ></ li >< li class = " grid grid-cols-[minmax(0,1fr)_auto] items-center gap-x-4 gap-y-2 p-4 " >< div >< p class = " font-bold " > TP maison · Scripts Bash </ p >< p class = " text-sm font-semibold " > Linux · Mme Roche · < span class = " font-mono " > lun . 06 / 10 · 18 h </ span ></ p ></ div >< a href = " { { route('ide') }} " class = " border border-[#dadce0] rounded-lg px-3 py-1 text-xs font-extrabold bg-white hover:bg-[#0b57d0] hover:text-white " > À rendre </ a >< div class = " col-span-2 flex items-center gap-2 " >< div class = " h-2 flex-1 border border-[#dadce0] rounded-lg " >< div class = " h-full bg-black " style = " width:20% " ></ div ></ div >< span class = " font-mono text-xs font-semibold " > 20 %</ span ></ div ></ li >< li class = " grid grid-cols-[minmax(0,1fr)_auto] items-center gap-x-4 gap-y-2 p-4 " >< div >< p class = " font-bold " > QCM · Lecture CM VLAN </ p >< p class = " text-sm font-semibold " > Réseaux · < span class = " font-mono " > hier </ span ></ p ></ div >< a href = " { { route('cours.cm') }} " class = " border border-[#dadce0] rounded-lg px-3 py-1 text-xs font-extrabold bg-[#e6f4ea] " > Rendu · 17 / 20 </ a >< div class = " col-span-2 flex items-center gap-2 " >< div class = " h-2 flex-1 border border-[#dadce0] rounded-lg " >< div class = " h-full bg-black " style = " width:100% " ></ div ></ div >< span class = " font-mono text-xs font-semibold " > 100 %</ span ></ div ></ li ></ ul >
</ section >
< section id = " examens " class = " border border-[#dadce0] rounded-lg bg-white " aria - labelledby = " t-exa " >
< div class = " flex items-center justify-between border-b border-[#e3e5e8] bg-[#ec3013] p-4 text-white " >< h2 id = " t-exa " 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 > Examens à venir </ h2 ></ div >
< ul class = " divide-y divide-[#e3e5e8] " >< li class = " flex items-center gap-4 p-4 " >< span class = " grid h-12 w-14 shrink-0 place-items-center border border-[#dadce0] rounded-lg bg-[#f8f9fa] font-mono text-sm font-semibold " > J - 9 </ span >< div class = " min-w-0 flex-1 " >< p class = " font-bold " > E6 blanc SISR </ p >< p class = " text-sm font-semibold " > Administration systèmes et réseaux · < span class = " font-mono " > jeu . 08 / 10 · 8 h </ span ></ p ></ div >< a href = " { { route('examen') }} " class = " shrink-0 border border-[#dadce0] rounded-lg px-3 py-1 text-xs font-extrabold hover:bg-[#0b57d0] hover:text-white " > Réviser </ a ></ li >< li class = " flex items-center gap-4 p-4 " >< span class = " grid h-12 w-14 shrink-0 place-items-center border border-[#dadce0] rounded-lg bg-[#f8f9fa] font-mono text-sm font-semibold " > J - 14 </ span >< div class = " min-w-0 flex-1 " >< p class = " font-bold " > Contrôle · Adressage IPv4 </ p >< p class = " text-sm font-semibold " > Réseaux · 1 h · < span class = " font-mono " > mar . 13 / 10 · 10 h </ span ></ p ></ div >< a href = " { { route('examen') }} " class = " shrink-0 border border-[#dadce0] rounded-lg px-3 py-1 text-xs font-extrabold hover:bg-[#0b57d0] hover:text-white " > Réviser </ a ></ li >< li class = " flex items-center gap-4 p-4 " >< span class = " grid h-12 w-14 shrink-0 place-items-center border border-[#dadce0] rounded-lg bg-[#f8f9fa] font-mono text-sm font-semibold " > — </ span >< div class = " min-w-0 flex-1 " >< p class = " font-bold " > QCM flash · Commandes Linux </ p >< p class = " text-sm font-semibold " > Début d’ · 5 min · < span class = " font-mono " > chaque lundi </ span ></ p ></ div >< a href = " { { route('quiz.eleve') }} " class = " shrink-0 border border-[#dadce0] rounded-lg px-3 py-1 text-xs font-extrabold hover:bg-[#0b57d0] hover:text-white " > Réviser </ a ></ li ></ ul >
< p class = " border-t border-[#e3e5e8] bg-[#f8f9fa] p-3 text-sm font-semibold " > Pendant un examen , reste sur la page : les changements d’ et de fenêtre sont signalés au prof .</ p >
</ section >
</ div >
< section id = " entrainement " class = " mt-6 border border-[#dadce0] rounded-lg bg-white " aria - labelledby = " t-ent " >
< div class = " flex flex-wrap items-center justify-between gap-3 border-b border-[#e3e5e8] p-4 " >< h2 id = " t-ent " 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 = " m16 18 6-6-6-6M8 6l-6 6 6 6 " /></ svg > S’ </ h2 >
< div id = " e-niv " class = " flex text-sm font-bold " >< button type = " button " data - n = " all " class = " h-10 border border-[#dadce0] rounded-lg px-3 bg-[#0b57d0] text-white " > Tout </ button >< button type = " button " data - n = " base " class = " h-10 border border-[#dadce0] rounded-lg px-3 -ml-0.5 bg-white " > Revoir les bases </ button >< button type = " button " data - n = " prog " class = " h-10 border border-[#dadce0] rounded-lg px-3 -ml-0.5 bg-white " > Dans le programme </ button >< button type = " button " data - n = " plus " class = " h-10 border border-[#dadce0] rounded-lg px-3 -ml-0.5 bg-white " > Pour aller plus loin </ button ></ div ></ div >
< ul id = " e-exos " class = " grid gap-px bg-black sm:grid-cols-2 xl:grid-cols-4 " ></ ul >
</ section >
< section id = " progres " class = " mt-6 border border-[#dadce0] rounded-lg bg-white p-5 " aria - labelledby = " t-prog " >
< div class = " flex flex-wrap items-baseline justify-between gap-2 " >< h2 id = " t-prog " 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 9H4a2 2 0 0 1 0-4h2M18 9h2a2 2 0 0 0 0-4h-2M4 22h16M10 14.7V17c0 .6-.5 1-1 1.2C7.8 18.8 7 20.2 7 22M14 14.7V17c0 .6.5 1 1 1.2 1.2.6 2 2 2 3.8M18 2H6v7a6 6 0 0 0 12 0V2z " /></ svg > Ma progression par compétence </ h2 >< p class = " font-mono text-xs font-semibold " > référentiel BTS SIO </ p ></ div >
< ul class = " mt-4 grid gap-3 md:grid-cols-2 " >< li >< div class = " flex justify-between text-sm font-bold " >< span > Installer et configurer un poste </ span >< span class = " font-mono " > 85 %</ span ></ div >< div class = " mt-1 h-3 border border-[#dadce0] rounded-lg " >< div class = " h-full " style = " width:85%;background:#7CF2C0 " ></ div ></ div ></ li >< li >< div class = " flex justify-between text-sm font-bold " >< span > Adressage IPv4 et sous - réseaux </ span >< span class = " font-mono " > 72 %</ span ></ div >< div class = " mt-1 h-3 border border-[#dadce0] rounded-lg " >< div class = " h-full " style = " width:72%;background:#7CF2C0 " ></ div ></ div ></ li >< li >< div class = " flex justify-between text-sm font-bold " >< span > VLAN et commutation </ span >< span class = " font-mono " > 64 %</ span ></ div >< div class = " mt-1 h-3 border border-[#dadce0] rounded-lg " >< div class = " h-full " style = " width:64%;background:#FFD23F " ></ div ></ div ></ li >< li >< div class = " flex justify-between text-sm font-bold " >< span > Scripts Bash </ span >< span class = " font-mono " > 48 %</ span ></ div >< div class = " mt-1 h-3 border border-[#dadce0] rounded-lg " >< div class = " h-full " style = " width:48%;background:#FF6FB5 " ></ div ></ div ></ li >< li >< div class = " flex justify-between text-sm font-bold " >< span > Sécurité des accès </ span >< span class = " font-mono " > 55 %</ span ></ div >< div class = " mt-1 h-3 border border-[#dadce0] rounded-lg " >< div class = " h-full " style = " width:55%;background:#FFD23F " ></ div ></ div ></ li >< li >< div class = " flex justify-between text-sm font-bold " >< span > Services réseau ( DHCP , DNS ) </ span >< span class = " font-mono " > 30 %</ span ></ div >< div class = " mt-1 h-3 border border-[#dadce0] rounded-lg " >< div class = " h-full " style = " width:30%;background:#FF6FB5 " ></ div ></ div ></ li ></ ul >
</ section >
</ div >
</ div >
</ div >
< script >
document . addEventListener ( 'DOMContentLoaded' , function () {
var C = { exam : '#ec3013' , dm : '#C4B5FD' , quiz : '#FFD23F' , cours : '#7CF2C0' };
var EV = {
'2026-09-28' : [[ 'quiz' , '8:00' , 'Quiz flash · Commandes Linux' ],[ 'cours' , '8:05' , 'CM · VLAN et commutation' ]],
'2026-09-29' : [[ 'cours' , '10:00' , 'TP · Lab VLAN et routage' ],[ 'dm' , '23:59' , 'QCM · Lecture CM VLAN (rendu)' ]],
'2026-09-30' : [[ 'cours' , '14:00' , 'TD · Découper un réseau IPv4' ]],
'2026-10-01' : [[ 'cours' , '9:00' , 'CM · Scripts Bash' ]],
'2026-10-02' : [[ 'cours' , '13:00' , 'TP · Services DHCP' ]],
'2026-10-03' : [[ 'dm' , '23:59' , 'DM 3 · Plan d’ ]],
'2026-10-05' : [[ 'quiz' , '8:00' , 'Quiz flash · Réseaux' ]],
'2026-10-06' : [[ 'dm' , '18:00' , 'TP maison · Scripts Bash' ]],
'2026-10-08' : [[ 'exam' , '8:00' , 'E6 blanc SISR · 1 h 30' ]],
'2026-10-13' : [[ 'exam' , '10:00' , 'Contrôle · Adressage IPv4' ]]
};
var debut = new Date ( 2026 , 8 , 28 ), sel = '2026-09-29' ;
var MOIS = [ 'janvier' , 'février' , 'mars' , 'avril' , 'mai' , 'juin' , 'juillet' , 'août' , 'septembre' , 'octobre' , 'novembre' , 'décembre' ];
function k ( d ) { return d . getFullYear () + '-' + String ( d . getMonth () + 1 ) . padStart ( 2 , '0' ) + '-' + String ( d . getDate ()) . padStart ( 2 , '0' ); }
function cal () {
var g = document . getElementById ( 'e-grille' ), h = '' ;
for ( var i = 0 ; i < 14 ; i ++ ) { var d = new Date ( debut ); d . setDate ( d . getDate () + i ); var key = k ( d ), ev = EV [ key ] || [], today = key === '2026-09-29' ;
h += '<button type="button" data-d="' + key + '" class="flex min-h-[92px] flex-col items-start gap-1 border-b-2 border-r border-[#e3e5e8] p-2 text-left [&:nth-child(7n)]:border-r-0 ' + ( key === sel ? 'bg-[#f8f9fa] outline outline-4 -outline-offset-4 outline-black' : 'hover:bg-[#f8f9fa]' ) + ( i > 6 ? ' [&]:border-b-0' : '' ) + '"><span class="font-mono text-sm font-semibold ' + ( today ? 'bg-black px-1 text-white' : '' ) + '">' + d . getDate () + '</span>' + ev . map ( function ( e ) { return '<span class="w-full truncate border border-[#dadce0] rounded-lg px-1 text-[11px] font-bold" style="background:' + C [ e [ 0 ]] + ';color:' + ( e [ 0 ] === 'exam' ? '#fff' : '#000' ) + '">' + e [ 2 ] + '</span>' ; }) . join ( '' ) + '</button>' ; }
g . innerHTML = h ;
var f = new Date ( debut ); f . setDate ( f . getDate () + 13 );
document . getElementById ( 'e-mois' ) . textContent = ( debut . getMonth () === f . getMonth () ? MOIS [ debut . getMonth ()] : MOIS [ debut . getMonth ()] + ' – + MOIS [ f . getMonth ()]) + ' ' + f . getFullYear ();
g . querySelectorAll ( 'button' ) . forEach ( function ( b ) { b . addEventListener ( 'click' , function () { sel = b . dataset . d ; cal (); jour (); }); });
}
function jour () { var ev = EV [ sel ] || [], p = sel . split ( '-' );
document . getElementById ( 'e-jour-titre' ) . textContent = new Date ( + p [ 0 ], + p [ 1 ] - 1 , + p [ 2 ]) . toLocaleDateString ( 'fr-FR' , { weekday : 'long' , day : '2-digit' , month : '2-digit' });
document . getElementById ( 'e-jour' ) . innerHTML = ev . length ? ev . map ( function ( e ) { return '<li class="flex items-center gap-3 p-4"><span class="w-14 shrink-0 font-mono text-sm font-semibold">' + e [ 1 ] + '</span><span class="h-8 w-1.5 shrink-0 border border-[#dadce0] rounded-lg" style="background:' + C [ e [ 0 ]] + '"></span><span class="font-bold">' + e [ 2 ] + '</span></li>' ; }) . join ( '' ) : '<li class="p-6 text-center font-bold">Rien de prévu. Un petit exercice ?</li>' ; }
document . getElementById ( 'e-prev' ) . addEventListener ( 'click' , function () { debut . setDate ( debut . getDate () - 7 ); cal (); });
document . getElementById ( 'e-next' ) . addEventListener ( 'click' , function () { debut . setDate ( debut . getDate () + 7 ); cal (); });
cal (); jour ();
var X = [
[ 'base' , 'Réseaux' , 'Convertir binaire ↔ décimal' , 'Générateur · 10 questions' , '5 min' , 'apercu-generateur.html' ],
[ 'base' , 'Linux' , 'Les 10 commandes du shell' , 'Quiz d’ , '5 min' , 'apercu-quiz-eleve.html' ],
[ 'prog' , 'Réseaux' , 'Découper un réseau IPv4' , 'TD à imprimer ou en ligne' , '30 min' , 'apercu-td-imprimable.html' ],
[ 'prog' , 'Linux' , 'Mon premier serveur Apache' , 'Lab web · terminal + navigateur' , '40 min' , 'apercu-lab-web.html' ],
[ 'prog' , 'Programmation' , 'Scripts Bash : boucles' , 'IDE · tests automatiques' , '20 min' , 'apercu-ide.html' ],
[ 'prog' , 'Bases de données' , 'Requêtes SQL SELECT' , 'IDE · SQL' , '20 min' , 'apercu-ide.html' ],
[ 'plus' , 'Programmation' , 'Défis Python' , 'HackerRank · gratuit' , 'libre' , 'https://www.hackerrank.com/domains/python' ],
[ 'plus' , 'Data' , 'Introduction à Python pour la data' , 'DataCamp · 1er chapitre gratuit' , 'libre' , 'https://www.datacamp.com/courses/intro-to-python-for-data-science' ]];
var niv = { base : [ '#FFFBEA' , 'Revoir les bases' ], prog : [ '#7CF2C0' , 'Dans le programme' ], plus : [ '#C4B5FD' , 'Pour aller plus loin' ] };
function exos ( f ) { document . getElementById ( 'e-exos' ) . innerHTML = X . filter ( function ( x ) { return f === 'all' || x [ 0 ] === f ; }) . map ( function ( x ) { var ext = x [ 5 ] . indexOf ( 'http' ) === 0 ;
return '<li class="flex flex-col bg-white p-4"><span class="self-start border border-[#dadce0] rounded-lg px-1.5 font-mono text-[11px] font-semibold" style="background:' + niv [ x [ 0 ]][ 0 ] + '">' + niv [ x [ 0 ]][ 1 ] + '</span><p class="mt-3 font-mono text-xs font-semibold uppercase">' + x [ 1 ] + '</p><p class="mt-1 text-lg font-extrabold leading-tight">' + x [ 2 ] + '</p><p class="mt-1 flex-1 text-sm font-semibold">' + x [ 3 ] + ' · ' + x [ 4 ] + '</p><a href="' + x [ 5 ] + '"' + ( ext ? ' target="_blank" rel="noopener"' : '' ) + ' class="mt-4 self-start border border-[#dadce0] rounded-lg px-3 py-1 text-xs font-extrabold hover:bg-[#0b57d0] hover:text-white">' + ( ext ? 'Ouvrir ↗' : 'Commencer →' ) + '</a></li>' ; }) . join ( '' ); }
document . querySelectorAll ( '#e-niv button' ) . forEach ( function ( b ) { b . addEventListener ( 'click' , function () { document . querySelectorAll ( '#e-niv button' ) . forEach ( function ( x , i ) { x . className = 'h-10 border border-[#dadce0] rounded-lg px-3 ' + ( i ? '-ml-0.5 ' : '' ) + ( x === b ? 'bg-[#0b57d0] text-white' : 'bg-white' ); }); exos ( b . dataset . n ); }); });
exos ( 'all' );
var mb = document . getElementById ( 'e-main' );
mb . addEventListener ( 'click' , function () { var on = mb . getAttribute ( 'aria-pressed' ) === 'true' ; mb . setAttribute ( 'aria-pressed' , on ? 'false' : 'true' ); mb . querySelector ( 'span' ) . textContent = on ? 'Lever la main' : 'Baisser la main' ; mb . style . background = on ? '#FF6FB5' : '#000' ; mb . style . color = on ? '#000' : '#fff' ; document . getElementById ( 'e-main-info' ) . classList . toggle ( 'hidden' , on ); });
});
</ script >
</ 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 >
2026-10-09 21:07:25 +02:00
< 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 >
2026-10-08 02:01:58 +02:00
</ div >
< div style = " border-top:1px solid #e3e5e8 " >
2026-10-09 21:07:25 +02:00
< 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 >
2026-10-08 02:01:58 +02:00
</ div >
</ footer >
</ body >
</ html >
