fix(style): improve readability of add_step2Unverified
b2cc75a parent: 9582306 modified
assets/style.css +4 -1 | @@ -398,8 +398,11 @@ a.team-pill:hover { filter: brightness(.96); } | ||
| 398 | 398 | .dot-16 { width: 16px; height: 16px; } |
| 399 | 399 | |
| 400 | 400 | /* — ajout étape 2 — */ |
| 401 | -.picked { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-6); } | |
| 401 | +.picked { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-4); } | |
| 402 | 402 | .picked .pname { font-size: 20px; font-family: var(--font-heading); } |
| 403 | +.picked>div { display: flex; align-items: center; gap: var(--space-2); margin:0; padding:0; } | |
| 404 | +.step2_hr { border: none; border-bottom: solid 1px var(--color-divider); } | |
| 405 | +h4.add_step_title { margin-top: var(--space-3); margin-bottom: var(--space-3); } | |
| 403 | 406 | .mini-label { display: block; font-size: 12px; opacity: .7; margin: 0 0 var(--space-2); } |
| 404 | 407 | .duration-row { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); } |
| 405 | 408 | .stepper { |
| @@ -398,8 +398,11 @@ a.team-pill:hover { filter: brightness(.96); } | |||
| 398 | .dot-16 { width: 16px; height: 16px; } | 398 | .dot-16 { width: 16px; height: 16px; } |
| 399 | 399 | ||
| 400 | /* — ajout étape 2 — */ | 400 | /* — ajout étape 2 — */ |
| 401 | -.picked { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-6); } | 401 | +.picked { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-4); } |
| 402 | .picked .pname { font-size: 20px; font-family: var(--font-heading); } | 402 | .picked .pname { font-size: 20px; font-family: var(--font-heading); } |
| 403 | +.picked>div { display: flex; align-items: center; gap: var(--space-2); margin:0; padding:0; } | ||
| 404 | +.step2_hr { border: none; border-bottom: solid 1px var(--color-divider); } | ||
| 405 | +h4.add_step_title { margin-top: var(--space-3); margin-bottom: var(--space-3); } | ||
| 403 | .mini-label { display: block; font-size: 12px; opacity: .7; margin: 0 0 var(--space-2); } | 406 | .mini-label { display: block; font-size: 12px; opacity: .7; margin: 0 0 var(--space-2); } |
| 404 | .duration-row { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); } | 407 | .duration-row { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); } |
| 405 | .stepper { | 408 | .stepper { |
modified
src/i18n.rs +8 -0 | @@ -89,6 +89,8 @@ pub struct Tr { | ||
| 89 | 89 | pub bad_credentials: &'static str, |
| 90 | 90 | // ─── ajout ─── |
| 91 | 91 | pub title_add: &'static str, |
| 92 | + pub title_picked: &'static str, | |
| 93 | + pub title_select_duration: &'static str, | |
| 92 | 94 | /// Écran de choix (deux boutons) de l'onglet Ajouter. |
| 93 | 95 | pub add_choice_hint: &'static str, |
| 94 | 96 | pub choice_timer_sub: &'static str, |
| @@ -364,6 +366,8 @@ pub static FR: Tr = Tr { | ||
| 364 | 366 | sign_in: "Se connecter", |
| 365 | 367 | bad_credentials: "Identifiants incorrects.", |
| 366 | 368 | title_add: "Ajouter du temps", |
| 369 | + title_picked: "Catégorie choisie", | |
| 370 | + title_select_duration: "Combien de temps ?", | |
| 367 | 371 | add_choice_hint: "Compte le temps au fur et à mesure, ou saisis une durée que tu as déjà passée.", |
| 368 | 372 | choice_timer_sub: "Tu choisiras la catégorie en l'arrêtant.", |
| 369 | 373 | choice_manual_sub: "Une durée déjà passée, en deux étapes.", |
| @@ -596,6 +600,8 @@ pub static EN: Tr = Tr { | ||
| 596 | 600 | sign_in: "Sign in", |
| 597 | 601 | bad_credentials: "Incorrect credentials.", |
| 598 | 602 | title_add: "Add time", |
| 603 | + title_picked: "Selected category", | |
| 604 | + title_select_duration: "How much time?", | |
| 599 | 605 | add_choice_hint: "Track time as it passes, or enter a duration you already spent.", |
| 600 | 606 | choice_timer_sub: "You'll pick the category when stopping it.", |
| 601 | 607 | choice_manual_sub: "A duration already spent, in two steps.", |
| @@ -828,6 +834,8 @@ pub static DE: Tr = Tr { | ||
| 828 | 834 | sign_in: "Anmelden", |
| 829 | 835 | bad_credentials: "Zugangsdaten sind falsch.", |
| 830 | 836 | title_add: "Zeit erfassen", |
| 837 | + title_picked: "Ausgewählte Kategorie", | |
| 838 | + title_select_duration: "Wieviel Zeit?", | |
| 831 | 839 | add_choice_hint: "Miss die Zeit, während sie läuft, oder erfasse eine bereits verbrachte Dauer.", |
| 832 | 840 | choice_timer_sub: "Die Kategorie wählst du beim Stoppen.", |
| 833 | 841 | choice_manual_sub: "Eine bereits verbrachte Dauer, in zwei Schritten.", |
| @@ -89,6 +89,8 @@ pub struct Tr { | |||
| 89 | pub bad_credentials: &'static str, | 89 | pub bad_credentials: &'static str, |
| 90 | // ─── ajout ─── | 90 | // ─── ajout ─── |
| 91 | pub title_add: &'static str, | 91 | pub title_add: &'static str, |
| 92 | + pub title_picked: &'static str, | ||
| 93 | + pub title_select_duration: &'static str, | ||
| 92 | /// Écran de choix (deux boutons) de l'onglet Ajouter. | 94 | /// Écran de choix (deux boutons) de l'onglet Ajouter. |
| 93 | pub add_choice_hint: &'static str, | 95 | pub add_choice_hint: &'static str, |
| 94 | pub choice_timer_sub: &'static str, | 96 | pub choice_timer_sub: &'static str, |
| @@ -364,6 +366,8 @@ pub static FR: Tr = Tr { | |||
| 364 | sign_in: "Se connecter", | 366 | sign_in: "Se connecter", |
| 365 | bad_credentials: "Identifiants incorrects.", | 367 | bad_credentials: "Identifiants incorrects.", |
| 366 | title_add: "Ajouter du temps", | 368 | title_add: "Ajouter du temps", |
| 369 | + title_picked: "Catégorie choisie", | ||
| 370 | + title_select_duration: "Combien de temps ?", | ||
| 367 | add_choice_hint: "Compte le temps au fur et à mesure, ou saisis une durée que tu as déjà passée.", | 371 | add_choice_hint: "Compte le temps au fur et à mesure, ou saisis une durée que tu as déjà passée.", |
| 368 | choice_timer_sub: "Tu choisiras la catégorie en l'arrêtant.", | 372 | choice_timer_sub: "Tu choisiras la catégorie en l'arrêtant.", |
| 369 | choice_manual_sub: "Une durée déjà passée, en deux étapes.", | 373 | choice_manual_sub: "Une durée déjà passée, en deux étapes.", |
| @@ -596,6 +600,8 @@ pub static EN: Tr = Tr { | |||
| 596 | sign_in: "Sign in", | 600 | sign_in: "Sign in", |
| 597 | bad_credentials: "Incorrect credentials.", | 601 | bad_credentials: "Incorrect credentials.", |
| 598 | title_add: "Add time", | 602 | title_add: "Add time", |
| 603 | + title_picked: "Selected category", | ||
| 604 | + title_select_duration: "How much time?", | ||
| 599 | add_choice_hint: "Track time as it passes, or enter a duration you already spent.", | 605 | add_choice_hint: "Track time as it passes, or enter a duration you already spent.", |
| 600 | choice_timer_sub: "You'll pick the category when stopping it.", | 606 | choice_timer_sub: "You'll pick the category when stopping it.", |
| 601 | choice_manual_sub: "A duration already spent, in two steps.", | 607 | choice_manual_sub: "A duration already spent, in two steps.", |
| @@ -828,6 +834,8 @@ pub static DE: Tr = Tr { | |||
| 828 | sign_in: "Anmelden", | 834 | sign_in: "Anmelden", |
| 829 | bad_credentials: "Zugangsdaten sind falsch.", | 835 | bad_credentials: "Zugangsdaten sind falsch.", |
| 830 | title_add: "Zeit erfassen", | 836 | title_add: "Zeit erfassen", |
| 837 | + title_picked: "Ausgewählte Kategorie", | ||
| 838 | + title_select_duration: "Wieviel Zeit?", | ||
| 831 | add_choice_hint: "Miss die Zeit, während sie läuft, oder erfasse eine bereits verbrachte Dauer.", | 839 | add_choice_hint: "Miss die Zeit, während sie läuft, oder erfasse eine bereits verbrachte Dauer.", |
| 832 | choice_timer_sub: "Die Kategorie wählst du beim Stoppen.", | 840 | choice_timer_sub: "Die Kategorie wählst du beim Stoppen.", |
| 833 | choice_manual_sub: "Eine bereits verbrachte Dauer, in zwei Schritten.", | 841 | choice_manual_sub: "Eine bereits verbrachte Dauer, in zwei Schritten.", |
modified
templates/add_step2.html +11 -3 | @@ -1,12 +1,20 @@ | ||
| 1 | 1 | {% extends "app.html" %} |
| 2 | 2 | {% import "components.html" as c %} |
| 3 | 3 | {% block content %} |
| 4 | -<a class="btn btn-ghost" style="margin:0 0 var(--space-3);padding-left:0" href="/temps/nouveau?mode=manuel">{{ shell.tr.change_category }}</a> | |
| 4 | + | |
| 5 | +<h4 class="add_step_title">{{ shell.tr.title_picked }}</h4> | |
| 5 | 6 | <div class="picked"> |
| 6 | - <span class="dot dot-16" style="background:{{ picked_color }}"></span> | |
| 7 | - <span class="pname">{{ picked_name }}</span> | |
| 7 | + <div> | |
| 8 | + <span class="dot dot-16" style="background:{{ picked_color }}"></span> | |
| 9 | + <span class="pname">{{ picked_name }}</span> | |
| 10 | + </div> | |
| 11 | + <a class="btn btn-ghost" style="margin:0 0" href="/temps/nouveau?mode=manuel">{{ shell.tr.change_category }}</a> | |
| 8 | 12 | </div> |
| 9 | 13 | |
| 14 | +<hr class="step2_hr"> | |
| 15 | + | |
| 16 | +<h4 class="add_step_title">{{ shell.tr.title_select_duration }}</h4> | |
| 17 | + | |
| 10 | 18 | <form method="post" action="/temps" data-duration> |
| 11 | 19 | <input type="hidden" name="csrf" value="{{ csrf }}"> |
| 12 | 20 | <input type="hidden" name="categorie" value="{{ categorie }}"> |
| @@ -1,12 +1,20 @@ | |||
| 1 | {% extends "app.html" %} | 1 | {% extends "app.html" %} |
| 2 | {% import "components.html" as c %} | 2 | {% import "components.html" as c %} |
| 3 | {% block content %} | 3 | {% block content %} |
| 4 | -<a class="btn btn-ghost" style="margin:0 0 var(--space-3);padding-left:0" href="/temps/nouveau?mode=manuel">{{ shell.tr.change_category }}</a> | 4 | + |
| 5 | +<h4 class="add_step_title">{{ shell.tr.title_picked }}</h4> | ||
| 5 | <div class="picked"> | 6 | <div class="picked"> |
| 6 | - <span class="dot dot-16" style="background:{{ picked_color }}"></span> | 7 | + <div> |
| 7 | - <span class="pname">{{ picked_name }}</span> | 8 | + <span class="dot dot-16" style="background:{{ picked_color }}"></span> |
| 9 | + <span class="pname">{{ picked_name }}</span> | ||
| 10 | + </div> | ||
| 11 | + <a class="btn btn-ghost" style="margin:0 0" href="/temps/nouveau?mode=manuel">{{ shell.tr.change_category }}</a> | ||
| 8 | </div> | 12 | </div> |
| 9 | 13 | ||
| 14 | +<hr class="step2_hr"> | ||
| 15 | + | ||
| 16 | +<h4 class="add_step_title">{{ shell.tr.title_select_duration }}</h4> | ||
| 17 | + | ||
| 10 | <form method="post" action="/temps" data-duration> | 18 | <form method="post" action="/temps" data-duration> |
| 11 | <input type="hidden" name="csrf" value="{{ csrf }}"> | 19 | <input type="hidden" name="csrf" value="{{ csrf }}"> |
| 12 | <input type="hidden" name="categorie" value="{{ categorie }}"> | 20 | <input type="hidden" name="categorie" value="{{ categorie }}"> |