feat(site,docs): aligne le site vitrine et la doc sur l'app « Emerald »

Site (packages/site) : adopte le design system Emerald (polices Inter +
JetBrains Mono variables, tokens sémantiques, thème clair/sombre + bascule)
et met les mockups à jour sur l'app réelle.

- style.css : tokens Emerald (@theme sombre + override html[data-theme=light]) ;
  lib/theme.ts + ThemeToggle.vue + anti-FOUC index.html ; sweep des couleurs
  brutes vers les tokens dans toutes les sections.
- Mockups fidèles à l'IDE multi-projet : HeroMockup (rail ActivityBar au lieu
  de la sidebar large + v obsolète retirée), ShowcaseSection (supervision au
  lieu du dashboard worktree-first, onglets mobiles réels), WorkspaceShowcase
  (diff-add/del, bouton commit accent-solid) ; framing « worktree-first »
  résiduel levé (i18n).
- og-cover.png rafraîchi (carte Emerald).

Docs : README.md + README.fr.md (retrait « Status: MVP », ajout du langage
Emerald + thème clair/sombre/système, VSIX 0.2.0 -> 0.3.0, section Screenshots),
vscode README (VSIX 0.3.0), brand README (thème clair), CHANGELOG daemon 3.2.0.
Captures IDE sombre + clair (brand/screenshot-ide-*.png).
This commit is contained in:
2026-07-20 22:48:59 +02:00
parent 063f5e928b
commit adc53b413e
37 changed files with 887 additions and 519 deletions

View File

@@ -4,14 +4,14 @@ defineProps<{ title: string }>();
<template>
<div
class="rounded-xl border border-zinc-800 bg-zinc-900/50 p-6 transition-[transform,border-color] duration-[180ms] ease-in-out hover:-translate-y-[3px] hover:border-emerald-400/40"
class="rounded-xl border border-border bg-surface-1/50 p-6 transition-[transform,border-color] duration-[180ms] ease-in-out hover:-translate-y-[3px] hover:border-accent/40"
>
<div
class="mb-4 inline-flex h-[42px] w-[42px] items-center justify-center rounded-[10px] bg-emerald-500/10 text-emerald-400"
class="mb-4 inline-flex h-[42px] w-[42px] items-center justify-center rounded-[10px] bg-accent/10 text-accent"
>
<slot name="icon" />
</div>
<h3 class="m-0 mb-[7px] text-lg font-semibold text-zinc-50">{{ title }}</h3>
<p class="m-0 text-[14.5px] leading-[1.55] text-zinc-400"><slot /></p>
<h3 class="m-0 mb-[7px] text-lg font-semibold text-fg">{{ title }}</h3>
<p class="m-0 text-[14.5px] leading-[1.55] text-fg-muted"><slot /></p>
</div>
</template>