feat: vignettes wireframe SVG des 31 layouts dans la galerie + favicon

This commit is contained in:
2026-07-16 19:31:14 +02:00
parent 2d06f95978
commit 10ca7ec7ad
3 changed files with 539 additions and 1 deletions
+6
View File
@@ -6,6 +6,7 @@ depuis layouts_v2.yaml. Relancer après tout ajout de layout.
Usage : python3 build_gallery.py → produit index.html
"""
import yaml
import wireframes
from pathlib import Path
from datetime import datetime
@@ -35,6 +36,7 @@ def card(name, cfg):
hint = " ".join(cfg.get("agent_hint", "").split())
champs = ", ".join(cfg.get("champs", []))
requis = ", ".join(cfg.get("champs_requis", []))
thumb = wireframes.svg_for(name, mode)
mode_badge = {
"light": ("Clair", "#f4f1ec", NAVY),
"dark": ("Sombre", NAVY, "#ffffff"),
@@ -46,6 +48,7 @@ def card(name, cfg):
<span class="lcode">{lid}</span>
<span class="lmode" style="background:{mode_badge[1]};color:{mode_badge[2]}">{mode_badge[0]}</span>
</div>
<div class="wf-thumb">{thumb}</div>
<h3>{name}</h3>
<p class="hint">{hint}</p>
<div class="fields">
@@ -82,6 +85,7 @@ html = f"""<!DOCTYPE html>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Sliding Design System v2 — Pernod Ricard</title>
<link rel="icon" type="image/svg+xml" href="/static/favicon.svg">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Cambria&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
<style>
@@ -113,6 +117,8 @@ h1{{font-family:Cambria,serif;font-size:60px;font-weight:700;line-height:1.05;le
.lg{{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:24px}}
.lc{{background:#fff;border:1px solid var(--bo);border-radius:10px;padding:24px;transition:all .25s;display:flex;flex-direction:column;box-shadow:0 1px 3px rgba(6,16,51,.04)}}
.lc:hover{{transform:translateY(-3px);box-shadow:0 12px 36px rgba(6,16,51,.10);border-color:var(--coral)}}
.wf-thumb{{margin:0 0 14px;border:1px solid #ECE9E2;border-radius:8px;overflow:hidden;background:#fff}}
.wf-thumb svg{{display:block;width:100%;height:auto}}
.lc-head{{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}}
.lcode{{background:var(--navy);color:#fff;font-size:10px;font-weight:600;padding:3px 9px;border-radius:4px;letter-spacing:.1em;font-family:monospace}}
.lmode{{font-size:10px;font-weight:600;padding:3px 10px;border-radius:20px;letter-spacing:.05em}}