618cd7efbe
Certificat Let's Encrypt obtenu et renouvelé par certbot (authentificateur nginx), expiration surveillée par Prometheus. TLS selon Mozilla v6.0 intermediate, HSTS, CSP stricte avec nonce sur l'application et adaptée sur la vitrine, xterm.js servi par le portail. Page de statut prévue sur status.syllabuslab.fr, administration de Grafana et Kuma par tunnel seul. Corrige aussi une faille XSS dans la page de classe, la page /cours en erreur depuis l'étape 8, et NodeSource relancé à chaque déploiement. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
48 lines
5.1 KiB
PHP
48 lines
5.1 KiB
PHP
@extends('layouts.vitrine')
|
||
|
||
@section('titre', 'Cours gratuits')
|
||
|
||
@section('contenu')
|
||
<section style="padding:112px 20px 96px;background:#fff"><div style="max-width:900px;margin:0 auto"><p style="margin:0;font-size:15px;font-weight:700;color:#0b57d0;text-align:center">Gratuit, sans compte</p><h1 style="margin:20px 0 0;font-size:clamp(40px,6vw,72px);line-height:1.04;font-weight:800;letter-spacing:-0.03em;color:#0b1220;text-align:center;text-wrap:balance">99 cours gratuits, calés sur vos référentiels.</h1><p style="margin:24px auto 0;max-width:660px;font-size:20px;line-height:1.6;font-weight:500;color:#3c4043;text-align:center;text-wrap:pretty">Chaque cours suit le découpage de l’Éducation nationale : un CM pour comprendre, un TD pour s’exercer sur papier, un TP sur une vraie VM, un QCM corrigé et expliqué.</p><p style="margin:28px 0 0;text-align:center;font-size:15px;font-weight:700;color:#5f6368">99 cours · 45 TD · 59 TP sur VM · 98 QCM corrigés</p><div style="margin-top:44px;display:flex;flex-direction:column;align-items:center;gap:14px"><a href="#nsi" style="display:inline-flex;align-items:center;height:56px;padding:0 32px;border-radius:999px;background:#0b57d0;color:#fff;font-size:17px;font-weight:700;text-decoration:none">Choisir mon cursus</a></div><nav aria-label="Cursus" style="margin-top:28px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 24px"><a href="#nsi" style="font-size:15px;font-weight:700;color:#0b57d0;text-decoration:none">Lycée NSI</a><a href="#sio" style="font-size:15px;font-weight:700;color:#0b57d0;text-decoration:none">BTS SIO SISR</a><a href="#ciel" style="font-size:15px;font-weight:700;color:#0b57d0;text-decoration:none">BTS CIEL</a><a href="#but" style="font-size:15px;font-weight:700;color:#0b57d0;text-decoration:none">BUT R&T</a><a href="#tssr" style="font-size:15px;font-weight:700;color:#0b57d0;text-decoration:none">Titre pro TSSR</a><a href="#prog" style="font-size:15px;font-weight:700;color:#0b57d0;text-decoration:none">Programmation</a></nav></div></section>
|
||
{{-- Boucle et données absentes de la maquette design/ (perdues lors de sa
|
||
refonte) : rétablies d'après design/_backup-ludique, étape 12. --}}
|
||
@php
|
||
$cursus = config('cours');
|
||
$fond = ['CM' => 'bg-white', 'TD' => 'bg-[#eef0fd]', 'TP' => 'bg-[#e6f4ea]', 'QCM' => 'bg-[#fef7e0]', 'IDE' => 'bg-[#13233A] text-white'];
|
||
@endphp
|
||
@foreach ($cursus as $c)
|
||
<section id="{{ $c['id'] }}" class="scroll-mt-24" style="border-top:1px solid #e3e5e8" aria-labelledby="t-{{ $c['id'] }}">
|
||
<div class="mx-auto max-w-7xl px-5 py-16 lg:px-10">
|
||
<div class="flex flex-wrap items-end gap-x-8 gap-y-3">
|
||
<h2 id="t-{{ $c['id'] }}" class="inline-block {{ $loop->odd ? '' : '' }} border border-[#e3e5e8] rounded-2xl {{ $c['couleur'] }} px-4 py-1 text-5xl font-extrabold tracking-tight sm:text-6xl">{{ $c['nom'] }}</h2>
|
||
<p class="text-lg font-semibold">{{ $c['sous_titre'] }} · {{ collect($c['blocs'])->sum(fn ($b) => count($b['cours'])) }} cours</p>
|
||
</div>
|
||
<div class="mt-12 grid gap-10 lg:grid-cols-2">
|
||
@foreach ($c['blocs'] as $b)
|
||
<div data-bloc class="border border-[#e3e5e8] rounded-2xl bg-white {{ $loop->even ? '' : '' }}">
|
||
<h3 class="border-b border-[#e3e5e8] {{ $c['couleur'] }} px-5 py-3 text-lg font-extrabold">{{ $b['titre'] }}</h3>
|
||
<ul class="divide-y divide-[#e3e5e8]">
|
||
@foreach ($b['cours'] as $k)
|
||
<li data-types="{{ implode(' ', $k['types']) }}"><a href="{{ isset($k['exercice']) ? route('ide', ['ex' => $k['exercice']]) : route('cours.fiche', ['chapitre' => $k['titre'] ?? '']) }}" class="flex flex-wrap items-center gap-x-4 gap-y-2 px-5 py-3 hover:bg-[#f8f9fa]"><span class="min-w-0 flex-1 font-extrabold">{{ $k['titre'] }}</span><span class="flex gap-1">@foreach ($k['types'] as $t)<span class="border border-[#dadce0] rounded-lg {{ $fond[$t] }} px-1.5 font-mono text-xs font-semibold">{{ $t }}</span>@endforeach</span><span class="w-10 text-right font-mono text-sm font-semibold">{{ $k['heures'] }} h</span></a></li>
|
||
@endforeach
|
||
</ul>
|
||
</div>
|
||
@endforeach
|
||
</div>
|
||
</div>
|
||
</section>
|
||
@endforeach
|
||
<script>
|
||
document.querySelectorAll('[data-filtre]').forEach(function (b) {
|
||
b.addEventListener('click', function () {
|
||
var f = b.dataset.filtre;
|
||
document.querySelectorAll('[data-filtre]').forEach(function (x) { x.setAttribute('aria-pressed', x === b); });
|
||
document.querySelectorAll('[data-types]').forEach(function (li) {
|
||
li.hidden = f !== 'Tout' && li.dataset.types.split(' ').indexOf(f) === -1;
|
||
});
|
||
document.querySelectorAll('[data-bloc]').forEach(function (b) { b.hidden = !b.querySelector('[data-types]:not([hidden])'); });
|
||
document.querySelectorAll('section[id]').forEach(function (s) { if (s.querySelector('[data-bloc]')) s.hidden = !s.querySelector('[data-bloc]:not([hidden])'); });
|
||
});
|
||
});
|
||
</script>
|
||
@endsection
|