feat(fitness): label finish button "FINISH EARLY" with unfinished sets
CI / update (push) Has been cancelled

Switches the active-workout finish button to "FINISH EARLY" /
"VORZEITIG BEENDEN" with an orange tint when any set in the workout is
still incomplete, so users can tell at a glance whether they're
wrapping up cleanly or cutting it short.
This commit is contained in:
2026-05-10 14:56:12 +02:00
parent e87b8bd864
commit 5fd8027d3e
4 changed files with 14 additions and 2 deletions
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "homepage", "name": "homepage",
"version": "1.69.4", "version": "1.69.5",
"private": true, "private": true,
"type": "module", "type": "module",
"scripts": { "scripts": {
+1
View File
@@ -98,6 +98,7 @@ export const de = {
workout_name_placeholder: "Trainingsname", workout_name_placeholder: "Trainingsname",
cancel_workout: "TRAINING ABBRECHEN", cancel_workout: "TRAINING ABBRECHEN",
finish: "BEENDEN", finish: "BEENDEN",
finish_early: "VORZEITIG BEENDEN",
new_set_added: "neuer Satz", new_set_added: "neuer Satz",
new_sets_added: "neue Sätze", new_sets_added: "neue Sätze",
exercises_title: "Übungen", exercises_title: "Übungen",
+1
View File
@@ -98,6 +98,7 @@ export const en = {
workout_name_placeholder: "Workout name", workout_name_placeholder: "Workout name",
cancel_workout: "CANCEL WORKOUT", cancel_workout: "CANCEL WORKOUT",
finish: "FINISH", finish: "FINISH",
finish_early: "FINISH EARLY",
new_set_added: "new set", new_set_added: "new set",
new_sets_added: "new sets", new_sets_added: "new sets",
exercises_title: "Exercises", exercises_title: "Exercises",
@@ -97,6 +97,7 @@
const workoutSetsTotal = $derived( const workoutSetsTotal = $derived(
workout.exercises.reduce((/** @type {number} */ n, /** @type {any} */ ex) => n + ex.sets.length, 0) workout.exercises.reduce((/** @type {number} */ n, /** @type {any} */ ex) => n + ex.sets.length, 0)
); );
const hasUnfinishedSets = $derived(workoutSetsTotal > 0 && workoutSetsDone < workoutSetsTotal);
/** @param {number} idx */ /** @param {number} idx */
function setFocus(idx) { focusedIdx = idx; } function setFocus(idx) { focusedIdx = idx; }
@@ -1770,7 +1771,9 @@
<button class="cancel-btn" onclick={async () => { if (gps.isTracking) await gps.stop(); gps.reset(); workout.cancel(); await sync.onWorkoutEnd(); await goto(`/fitness/${sl.workout}`); }}> <button class="cancel-btn" onclick={async () => { if (gps.isTracking) await gps.stop(); gps.reset(); workout.cancel(); await sync.onWorkoutEnd(); await goto(`/fitness/${sl.workout}`); }}>
{t.cancel_workout} {t.cancel_workout}
</button> </button>
<button class="finish-btn" onclick={finishWorkout}>{t.finish}</button> <button class="finish-btn" class:premature={hasUnfinishedSets} onclick={finishWorkout}>
{hasUnfinishedSets ? t.finish_early : t.finish}
</button>
</div> </div>
</main> </main>
</div> </div>
@@ -2132,6 +2135,13 @@
.finish-btn:active { .finish-btn:active {
transform: scale(0.98); transform: scale(0.98);
} }
.finish-btn.premature {
background: var(--orange);
color: var(--nord0);
}
.finish-btn.premature:hover {
background: color-mix(in srgb, var(--orange) 85%, var(--nord0));
}
/* GPS section */ /* GPS section */
.gps-section { .gps-section {