fix: add inputmode to number inputs across admin modals to enforce numeric keyboard on mobile

2026-05-29 18:20:30 +01:00
parent c21a59d61d
commit 20bd3e3310
3 changed files with 8 additions and 3 deletions
@@ -483,7 +483,7 @@
 			<div class="space-y-2">
 				<Label.Root for="dc-pct">Discount Percent *</Label.Root>
 				<div class="flex items-center gap-2">
-					<Input id="dc-pct" type="number" min="1" max="100" bind:value={form.discount_percent} class="w-24" />
+					<Input id="dc-pct" type="number" inputmode="numeric" min="1" max="100" bind:value={form.discount_percent} class="w-24" />
 					<span class="text-sm text-gray-500">%</span>
 				</div>
 				{#if errors.discount_percent}<p class="text-xs text-red-500">{errors.discount_percent}</p>{/if}
@@ -545,7 +545,7 @@
 					<div class="grid grid-cols-2 gap-3">
 						<div class="space-y-2">
 							<Label.Root for="dc-ms-val">Value *</Label.Root>
-							<Input id="dc-ms-val" type="number" min="1" bind:value={form.milestone_value} />
+							<Input id="dc-ms-val" type="number" inputmode="numeric" min="1" bind:value={form.milestone_value} />
 							{#if errors.milestone_value}<p class="text-xs text-red-500">{errors.milestone_value}</p>{/if}
 						</div>
 						<div class="space-y-2">
@@ -579,7 +579,7 @@
 			<!-- Max Redemptions -->
 			<div class="space-y-2">
 				<Label.Root for="dc-max">Max Redemptions (campaign total)</Label.Root>
-				<Input id="dc-max" type="number" min="0" bind:value={form.max_redemptions} class="w-32" />
+				<Input id="dc-max" type="number" inputmode="numeric" min="0" bind:value={form.max_redemptions} class="w-32" />
 				<p class="text-xs text-gray-500">0 = unlimited across all users</p>
 			</div>
 		</div>
@@ -370,6 +370,7 @@ import { Button } from '$lib/components/ui/button';
 					<Input
 						id="pt-notice"
 						type="number"
+						inputmode="numeric"
 						min="0"
 						bind:value={formData.notice_duration_hours}
 						class="w-full {formErrors.notice_duration ? 'border-red-500' : ''}"
@@ -385,6 +386,7 @@ import { Button } from '$lib/components/ui/button';
 					<Input
 						id="pt-expiry"
 						type="number"
+						inputmode="numeric"
 						min="1"
 						bind:value={formData.expiry_months}
 						class="w-full {formErrors.expiry ? 'border-red-500' : ''}"
@@ -530,6 +530,7 @@
 						<Input
 							id="service-price"
 							type="number"
+							inputmode="decimal"
 							step="0.01"
 							min="0"
 							placeholder="0.00"
@@ -548,6 +549,7 @@
 					<Input
 						id="service-duration"
 						type="number"
+						inputmode="numeric"
 						min="1"
 						step="1"
 						placeholder="60"
@@ -567,6 +569,7 @@
 					<Input
 						id="minimum-age"
 						type="number"
+						inputmode="numeric"
 						min="0"
 						max="100"
 						step="1"