pierre/Ustagammon
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

Recette 1h : courbe, lignes de partie, en-tête, bouton des exercices, carte de l'accueil

Browse Source 
Dernier point plus gros, vert seulement si le taux baisse ; valeurs au
premier et au dernier point, axe réduit à la ligne du 0. Une ligne de
partie = un lien vers le bilan, résultat court, date et niveau en
caption. Plus de « Retour », titre en h1 ; « Nouvelle partie » pleine
largeur en portrait ; « Demander des exercices à une IA ». La carte de
l'accueil sans partie en cours ne montre plus la partie finie (testé).
Phrase progression.hausse sans « un peu ». L'écran relit ses parties à
chaque visite sans montrer celles de la précédente. Test navigateur sur
trois courses jouées jusqu'au bout.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Pierre MARTIN
2026-11-12 20:02:18 +01:00
co-authored by Claude Opus 5.5
parent 2664486541
commit c2c5d13651
13 changed files with 238 additions and 162 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/app.css
+35 -23
View File
@@ -3503,9 +3503,17 @@ html.landscape .summary-panel > .summary-end {
.curve-band { fill: transparent; cursor: pointer; }
.curve-band.selected { fill: var(--accent); fill-opacity: 0.08; }
/* La progression (#/progression, 1h) : la phrase du maître, la courbe du
* taux d'erreur (le dernier point en verdict-good), puis les parties. La
* page reprend l'en-tête et les cartes de l'analyse. */
/* La progression (#/progression, 1h) : le titre, la phrase du maître, la
* courbe du taux d'erreur, puis les parties (charte, ecrans-etape-1.md,
* « 1h »). Les cartes reprennent celles de l'analyse. */
.progression-title {
margin: var(--space-3) 0 var(--space-2);
font-size: 32px;
line-height: 36px;
font-weight: 800;
letter-spacing: -0.01em;
}
.progression-summary {
margin: 0 0 var(--space-4);
font-size: 17px;
@@ -3523,10 +3531,13 @@ html.landscape .summary-panel > .summary-end {
font-family: var(--font-sans);
}
/* Le dernier point, plus gros, à l'encre du texte ; en verdict-good
* seulement si le taux baisse (le vert dit « mieux », jamais « dernier »). */
.progression-dot { fill: var(--text); }
.progression-dot.last { fill: var(--verdict-good); }
.progression-value { fill: var(--muted); font-size: 12px; }
.progression-value.last { fill: var(--verdict-good); font-weight: 700; }
.progression-dot.better { fill: var(--verdict-good); }
.progression-value { fill: var(--muted); font-size: 13px; }
.progression-value.last { fill: var(--text); font-weight: 700; }
.progression-value.better { fill: var(--verdict-good); }
.progression .link-button {
display: inline-flex;
@@ -3539,6 +3550,13 @@ html.landscape .summary-panel > .summary-end {
margin: 0 0 var(--space-4);
}
/* Sans partie terminée : « Nouvelle partie », pleine largeur en portrait. */
@media (orientation: portrait) {
.progression-empty .button {
flex: 1;
}
}
.progression-list {
display: flex;
flex-direction: column;
@@ -3549,27 +3567,30 @@ html.landscape .summary-panel > .summary-end {
}
.progression-item {
display: flex;
gap: var(--space-2);
align-items: center;
padding: var(--space-2) var(--space-3);
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius-md);
}
/* Toute la ligne ouvre le bilan de la partie. */
/* Une ligne, un seul lien vers le bilan : résultat et date à gauche, taux
* en gras, puis le chevron. */
.progression-game {
display: flex;
flex: 1;
gap: var(--space-3);
align-items: center;
min-width: 0;
min-height: 44px;
min-height: 56px;
padding: var(--space-2) var(--space-3);
color: inherit;
text-decoration: none;
}
.progression-game > .icon {
flex: none;
width: 20px;
height: 20px;
color: var(--muted);
}
.progression-text {
display: flex;
flex: 1;
@@ -3577,11 +3598,6 @@ html.landscape .summary-panel > .summary-end {
min-width: 0;
}
.progression-text .muted {
font-size: 15px;
line-height: 20px;
}
.progression-rate {
display: flex;
flex: none;
@@ -3601,10 +3617,6 @@ html.landscape .summary-panel > .summary-end {
color: var(--muted);
}
.progression-analysis {
flex: none;
}
/* Le visualiseur : « ‹ Coup 7 sur 24 · 6-1 › », le plateau d'avant le
* coup, la phrase du maître, votre coup contre celui du maître. */
.viewer-nav {