autofocus + button
This commit is contained in:
parent
189b4dc967
commit
ade4ac821f
4 changed files with 24 additions and 1 deletions
|
|
@ -108,6 +108,22 @@
|
|||
{/if}
|
||||
</main>
|
||||
|
||||
<!-- FAB: Add entry (mobile only) -->
|
||||
{#if diaryQuery.data}
|
||||
<button
|
||||
onclick={() => {
|
||||
const firstMeal = diaryQuery.data?.meals[0];
|
||||
if (firstMeal) goto(`/diary/${date}/add-entry?meal_id=${firstMeal.id}`);
|
||||
}}
|
||||
class="lg:hidden fixed bottom-[calc(4rem+var(--safe-bottom))] right-4 z-30 w-14 h-14 rounded-full bg-green-600 hover:bg-green-500 shadow-lg flex items-center justify-center transition-colors"
|
||||
aria-label="Add entry"
|
||||
>
|
||||
<svg class="w-7 h-7" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
|
||||
</svg>
|
||||
</button>
|
||||
{/if}
|
||||
|
||||
<Sheet open={calendarOpen} onclose={() => calendarOpen = false}>
|
||||
<CalendarPicker selected={date} onSelect={handleDateSelect} />
|
||||
</Sheet>
|
||||
|
|
|
|||
|
|
@ -228,6 +228,7 @@
|
|||
bind:value={grams}
|
||||
min="1"
|
||||
max="5000"
|
||||
inputmode="decimal"
|
||||
class="flex-1 bg-zinc-800 border border-zinc-700 rounded-xl px-4 py-2.5 text-center text-xl font-semibold focus:outline-none focus:border-green-500 transition-colors"
|
||||
/>
|
||||
<button
|
||||
|
|
|
|||
|
|
@ -117,6 +117,8 @@
|
|||
bind:value={grams}
|
||||
min="1"
|
||||
max="5000"
|
||||
inputmode="decimal"
|
||||
autofocus
|
||||
class="flex-1 bg-zinc-900 border border-zinc-700 rounded-xl px-4 py-3 text-center text-2xl font-semibold focus:outline-none focus:border-green-500 transition-colors"
|
||||
/>
|
||||
<button
|
||||
|
|
@ -127,7 +129,7 @@
|
|||
</div>
|
||||
</main>
|
||||
|
||||
<div class="px-4 pb-[calc(1.5rem+var(--safe-bottom))]">
|
||||
<div class="px-4 pb-[calc(5rem+var(--safe-bottom))] lg:pb-6">
|
||||
<button
|
||||
onclick={handleSave}
|
||||
disabled={saving || grams < 1 || grams === entry.grams}
|
||||
|
|
|
|||
|
|
@ -58,6 +58,7 @@
|
|||
bind:value={protein}
|
||||
min="0"
|
||||
step="0.1"
|
||||
inputmode="decimal"
|
||||
required
|
||||
class="w-full bg-zinc-900 border border-zinc-700 rounded-xl px-4 py-3 text-zinc-100 focus:outline-none focus:border-green-500 transition-colors"
|
||||
/>
|
||||
|
|
@ -70,6 +71,7 @@
|
|||
bind:value={carb}
|
||||
min="0"
|
||||
step="0.1"
|
||||
inputmode="decimal"
|
||||
required
|
||||
class="w-full bg-zinc-900 border border-zinc-700 rounded-xl px-4 py-3 text-zinc-100 focus:outline-none focus:border-green-500 transition-colors"
|
||||
/>
|
||||
|
|
@ -82,6 +84,7 @@
|
|||
bind:value={fat}
|
||||
min="0"
|
||||
step="0.1"
|
||||
inputmode="decimal"
|
||||
required
|
||||
class="w-full bg-zinc-900 border border-zinc-700 rounded-xl px-4 py-3 text-zinc-100 focus:outline-none focus:border-green-500 transition-colors"
|
||||
/>
|
||||
|
|
@ -94,6 +97,7 @@
|
|||
bind:value={fiber}
|
||||
min="0"
|
||||
step="0.1"
|
||||
inputmode="decimal"
|
||||
required
|
||||
class="w-full bg-zinc-900 border border-zinc-700 rounded-xl px-4 py-3 text-zinc-100 focus:outline-none focus:border-green-500 transition-colors"
|
||||
/>
|
||||
|
|
|
|||
Loading…
Reference in a new issue