diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 08ff741..59ae2d7 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -81,6 +81,12 @@ if (!Number.isFinite(n)) return ''; return String(Math.round(n)); } + function placeholderOdometer(): string { + if (!data.lastFuelup) return 'No last fuel up'; + const n = Number(data.lastFuelup.odometer); + if (!Number.isFinite(n)) return ''; + return String(Math.round(n)); + } let odometer: string = $state(initialOdometer()); let odometerEdited: boolean = $state(false); // Local calendar date, NOT toISOString().slice(0, 10): the UTC form is @@ -833,10 +839,15 @@
{ odometerEdited = true; clearSmartCheckIssues(); }} - class:text-zinc-400={!odometerEdited && odometer !== ''} - placeholder="87,432" /> + step="1" + onkeydown={(e) => { if (e.key === '.' || e.key === ',') e.preventDefault(); }} + bind:value={odometer} + oninput={() => { + odometerEdited = true; + clearSmartCheckIssues(); + }} + class:text-zinc-400={!odometerEdited && odometer !== ''} + placeholder={placeholderOdometer()} /> {#if !odometerEdited && odometer !== ''} prefilled