electron-rare/formations-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: catalogue page

Browse Source
This commit is contained in:
electron-rare
2026-06-10 21:30:25 +02:00
parent 8395a4e55a
commit d97aeb84d5
1 changed files with 32 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/index.astro
+32 -3
View File
@@ -1,10 +1,39 @@
---
import Base from '../layouts/Base.astro';
import Nav from '../components/Nav.astro';
import { COURSES } from '../config/courses';
const published = COURSES.filter((c) => c.published);
const upcoming = COURSES.filter((c) => !c.published);
---
<Base title="Catalogue" description="Formations systèmes embarqués et IA — L'Electron Rare">
<Base title="Catalogue" description="Formations systèmes embarqués et IA — books en lecture libre, quiz et certificats. ESP32, KiCad, FreeRTOS.">
<Nav />
<main class="pt-24 px-6 max-w-content mx-auto">
<h1 class="text-4xl font-semibold text-white">Formations</h1>
<main class="pt-28 pb-20 px-6 max-w-content mx-auto">
<h1 class="text-4xl md:text-5xl font-semibold tracking-tight text-white mb-3">Formations</h1>
<p class="text-lg text-slate-400 max-w-2xl mb-12">
Lecture libre, sans compte. Un compte n'est nécessaire que pour les quiz et le certificat.
</p>
<div class="grid md:grid-cols-3 gap-6 mb-16">
{published.map((c) => (
<a href={`/cours/${c.slug}`} class="group rounded-2xl border border-white/10 bg-night-soft p-6 transition-colors hover:border-copper/40">
<div class="w-2 h-2 rounded-full bg-copper mb-5 shadow-[0_0_12px_rgba(249,115,22,0.8)]"></div>
<h2 class="text-xl font-semibold text-white mb-2 group-hover:text-copper-soft transition-colors">{c.title}</h2>
<p class="text-sm text-slate-400 leading-relaxed">{c.blurb}</p>
<p class="mt-5 text-sm text-copper">Lire la formation →</p>
</a>
))}
</div>
<h2 class="text-xl font-medium text-slate-300 mb-6">En préparation</h2>
<div class="grid md:grid-cols-3 gap-6">
{upcoming.map((c) => (
<div class="rounded-2xl border border-white/5 bg-night-soft/50 p-6 opacity-70">
<div class="w-2 h-2 rounded-full bg-slate-600 mb-5"></div>
<h3 class="text-xl font-semibold text-slate-300 mb-2">{c.title}</h3>
<p class="text-sm text-slate-500 leading-relaxed">{c.blurb}</p>
<p class="mt-5 text-xs uppercase tracking-wider text-slate-600">Bientôt</p>
</div>
))}
</div>
</main>
</Base>