hermann/expria-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

feat(design-system): reskin Charcoal — tokens dark-default + sidebar navy permanent

Browse source 
- Remplacement intégral index.css par palette Charcoal (DESIGN_SYSTEM.md v2.0)
- Dark = thème par défaut, .light = override via @custom-variant light
- Sidebar navy #0C1528 permanent (identique dark+light)
- Script anti-FOUC inline dans index.html
- Layout : radial-gradient sur <main>, sidebar 230px, max-w-[1100px]
- Renommage tokens Boréal→Charcoal sur ~45 composants
- Inversion dark: → baseline + light: sur primitives shadcn
- Fix logo blanc forcé dans sidebar
- ADR 006 mis à jour

Typecheck: OK · Tests: 122/122 ✅

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Hermann_Kitio 2026-04-24 23:07:38 +03:00
parent 407d1bd134
commit b68f160bce
61 changed files with 1269 additions and 726 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/features/historique/components/SimulationListItem.tsx
View file

@ -25,31 +25,33 @@ export function SimulationListItem({ item }: Props) {
return (
<Link
to={`/rapport/${item.id}`}
className="block rounded-lg border border-line bg-surface p-4 shadow-sm transition-colors duration-150 hover:border-expria hover:bg-surface-hover focus-visible:outline-none focus-visible:shadow-focus"
className="block rounded-lg border border-border bg-surface p-4 shadow-card transition-colors duration-150 hover:border-brand hover:bg-surface-hover focus-visible:outline-none focus-visible:shadow-focus"
>
<div className="flex items-start justify-between gap-3">
<div className="min-w-0 space-y-1">
<div className="flex flex-wrap items-center gap-2">
<span className="text-sm font-semibold text-ink-1">{formatTache(item.tache)}</span>
<span className="text-sm font-semibold text-ink-primary">
{formatTache(item.tache)}
</span>
{isExam && <Badge variant="nclc">Examen</Badge>}
{!hasScore && <Badge variant="neutral">En cours</Badge>}
</div>
<p className="text-xs text-ink-4">{formatRelativeDate(item.created_at)}</p>
<p className="text-xs text-ink-secondary">{formatRelativeDate(item.created_at)}</p>
</div>
{hasScore ? (
<div className="shrink-0 text-right">
<p className="tabular-nums text-ink-1">
<p className="tabular-nums text-ink-primary">
<span className="text-xl font-bold">{item.score}</span>
<span className="text-sm font-medium text-ink-4">/20</span>
<span className="text-sm font-medium text-ink-secondary">/20</span>
</p>
<p className="text-xs text-ink-4 tabular-nums">
<p className="text-xs text-ink-secondary tabular-nums">
NCLC {item.nclc}
{item.nclc_cible ? ` / cible ${item.nclc_cible}` : ''}
</p>
</div>
) : (
<div className="shrink-0 text-right text-xs text-ink-4">Score à venir</div>
<div className="shrink-0 text-right text-xs text-ink-secondary">Score à venir</div>
)}
</div>
</Link>