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:
+73
-25
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user