Fusion de origin/lecons (recette 1g) dans progression

Conflit sur la ligne de progression de l'accueil : le texte de 1g
(« Aucune leçon terminée sur 5 », majuscule en tête) dans le lien vers
#/progression.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Pierre MARTIN
2026-11-12 14:19:08 +01:00
co-authored by Claude Opus 5.5
15 changed files with 149 additions and 50 deletions
+73 -25
View File
@@ -1201,6 +1201,13 @@ html.landscape.page-open body {
background: var(--background);
}
/* Hors de l'écran de jeu, la barre haute (Aide, Plein écran, Menu) reste
* en paysage : seul le plateau en paysage s'en passe. Les écrans qui ont
* leur propre en-tête (bare) la masquent toujours. */
html.landscape.page-open:not(.bare) .topbar {
display: flex;
}
/* Repli du plein écran : le paysage ne peut pas être verrouillé, l'écran
* entier tourne d'un quart de tour dans le portrait. Les touchers suivent
* la rotation ; le plateau et les fenêtres sont posés dans #screen. */
@@ -1897,17 +1904,20 @@ html.bare .topbar {
.lessons-rules {
display: flex;
align-items: center;
width: fit-content;
min-height: 44px;
margin-top: var(--space-2);
font-size: 15px;
line-height: 20px;
color: var(--muted);
text-decoration: none;
}
.lessons-rules a {
display: inline-flex;
align-items: center;
min-height: 44px;
.lessons-rules span {
margin-left: var(--space-1);
font-weight: 700;
color: var(--accent);
text-decoration: underline;
}
#lessons-status:empty {
@@ -2157,8 +2167,28 @@ html.bare .topbar {
color: var(--muted);
}
.tutorial-title {
/* En portrait, l'écran tient au moins la hauteur de l'écran : « Retour »
* et « Continuer » restent en bas, sous le pouce. */
.tutorial {
display: flex;
flex-direction: column;
box-sizing: border-box;
min-height: 100vh;
min-height: 100dvh;
}
/* Le titre, et « Revoir » sur sa ligne, à droite. */
.tutorial-title-row {
display: flex;
gap: var(--space-2);
align-items: center;
margin: var(--space-1) 0 var(--space-3);
}
.tutorial-title {
flex: 1;
min-width: 0;
margin: 0;
font-size: 24px;
line-height: 30px;
}
@@ -2173,16 +2203,13 @@ html.bare .topbar {
}
}
.tutorial-board-box .tutorial-replay {
position: absolute;
right: var(--space-1);
bottom: calc(-44px - var(--space-1));
.tutorial-replay {
flex: none;
color: var(--accent);
}
.tutorial-text {
margin-top: var(--space-3);
padding-right: 52px;
}
.tutorial-text p {
@@ -2235,7 +2262,8 @@ html.bare .topbar {
display: grid;
grid-template-columns: 1fr 1.4fr;
gap: var(--space-2);
margin-top: var(--space-6);
margin-top: auto;
padding-top: var(--space-6);
}
.tutorial-nav .button {
@@ -2302,16 +2330,46 @@ html.landscape .tutorial-head {
padding-top: 0;
}
html.landscape .tutorial-title {
html.landscape .tutorial-title-row {
grid-row: 2;
margin: 0 0 var(--space-1);
padding-right: calc(44px + var(--space-4));
padding-right: calc(var(--space-2) + env(safe-area-inset-right));
}
html.landscape .tutorial-title {
font-size: 20px;
line-height: 26px;
}
/* La boîte du plateau s'efface : le plateau et « Revoir » se placent
* eux-mêmes dans la grille. */
/* Une leçon garde en paysage sa ligne « Leçon 1 · 1 sur 4 · à vous »
* au-dessus du titre (recette 1g) : une rangée de plus dans la grille. */
html.landscape #lesson {
grid-template-rows: auto auto auto minmax(0, 1fr) auto auto;
}
html.landscape #lesson .overline {
display: block;
grid-row: 2;
}
html.landscape #lesson .tutorial-title-row {
grid-row: 3;
}
html.landscape #lesson .tutorial-body {
grid-row: 4;
}
html.landscape #lesson .tutorial-cube {
grid-row: 5;
}
html.landscape #lesson .tutorial-nav {
grid-row: 6;
}
/* La boîte du plateau s'efface : le plateau se place lui-même dans la
* grille. */
html.landscape .tutorial-board-box {
display: contents;
}
@@ -2326,16 +2384,6 @@ html.landscape .tutorial-board {
background: var(--frame);
}
html.landscape .tutorial-board-box .tutorial-replay {
position: static;
grid-row: 2;
grid-column: 2;
justify-self: end;
align-self: start;
margin: -9px calc(var(--space-2) + env(safe-area-inset-right)) 0 0;
padding: 0;
}
html.landscape .tutorial-body {
grid-row: 3;
min-height: 0;