diff options
Diffstat (limited to 'src/routes/projects')
| -rw-r--r-- | src/routes/projects/[id]/+page.svelte | 14 | ||||
| -rw-r--r-- | src/routes/projects/[projectId]/routine/[routineId]/+page.svelte | 29 |
2 files changed, 16 insertions, 27 deletions
diff --git a/src/routes/projects/[id]/+page.svelte b/src/routes/projects/[id]/+page.svelte index 8a3561b..2efe05b 100644 --- a/src/routes/projects/[id]/+page.svelte +++ b/src/routes/projects/[id]/+page.svelte @@ -4,6 +4,7 @@ import HealthChart from '$lib/components/HealthChart.svelte'; import ScoreBadge from '$lib/components/ScoreBadge.svelte'; import StatusBadge from '$lib/components/StatusBadge.svelte'; + import Button from '$lib/components/Button.svelte'; import { formatFrequency, parseIntervalToDays, @@ -82,14 +83,13 @@ autocomplete="off" aria-label="Intervalle (ex: 1d, 2w, 3m)" /> - <button - class="btn-accent" - type="submit" + <Button + variant="accent" disabled={!name.trim() || frequencyDays === null} - aria-label="Ajouter" + ariaLabel="Ajouter" > + - </button> + </Button> </form> {#if frequency !== '' && frequencyDays === null} @@ -105,12 +105,12 @@ <li class="item-row item-row--card routine-row"> <form method="POST" action="?/complete" use:enhance> <input type="hidden" name="id" value={routine.id} /> - <button type="submit" class="btn-ghost"> + <Button variant="ghost"> <StatusBadge status={routine.status} overdueDays={routine.overdueDays} /> - </button> + </Button> </form> <div class="routine-info"> <a diff --git a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte index 74880cb..867719a 100644 --- a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte +++ b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte @@ -3,6 +3,7 @@ import HealthChart from '$lib/components/HealthChart.svelte'; import ScoreBadge from '$lib/components/ScoreBadge.svelte'; import StatusBadge from '$lib/components/StatusBadge.svelte'; + import Button from '$lib/components/Button.svelte'; import { formatFrequency, parseIntervalToDays, @@ -111,16 +112,15 @@ {#if frequency !== '' && frequencyDays === null} <p class="error">Intervalle invalide — ex : 1d, 2w, 3m, 1y</p> {/if} - <button - class="btn-primary btn-save" - type="submit" + <Button disabled={!name.trim() || frequencyDays === null} + style="position: relative; padding-right: 2.75rem;" > - <span class="btn-save-label">Enregistrer</span> - <span class="btn-save-check" class:visible={saved} aria-hidden="true" + <span>Enregistrer</span> + <span class="save-check" class:visible={saved} aria-hidden="true" >✓</span > - </button> + </Button> </form> {/if} @@ -170,7 +170,7 @@ placeholder="Note (optionnel)" autocomplete="off" /> - <button class="btn-done btn-done-lg" type="submit">Fait</button> + <Button variant="done" size="lg">Fait</Button> </form> {/if} @@ -259,12 +259,6 @@ flex: 1; } - .btn-done-lg { - padding: 0.75rem 1.25rem; - border-radius: 0.75rem; - font-size: 0.9375rem; - } - .completion-row { flex-wrap: wrap; gap: 0.25rem 0.75rem; @@ -298,12 +292,7 @@ color: var(--danger); } - .btn-save { - position: relative; - padding-right: 2.75rem; - } - - .btn-save-check { + .save-check { position: absolute; right: 1rem; top: 50%; @@ -312,7 +301,7 @@ transition: opacity 0.2s ease; } - .btn-save-check.visible { + .save-check.visible { opacity: 1; } </style> |