From adcc8df7cd4f79f586e3c6e33e4858b8ce0e08b3 Mon Sep 17 00:00:00 2001
From: grabowski <berwn@buildfor.life>
Date: Tue, 7 Apr 2026 11:06:47 +0700
Subject: [PATCH] Align checklist input fields to the right side

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/routes/(app)/devices/[id]/+page.svelte | 20 +++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/routes/(app)/devices/[id]/+page.svelte b/src/routes/(app)/devices/[id]/+page.svelte
index 8562875..85d33fe 100644
--- a/src/routes/(app)/devices/[id]/+page.svelte
+++ b/src/routes/(app)/devices/[id]/+page.svelte
@@ -425,16 +425,18 @@
 														</svg>
 													{/if}
 												</span>
-												<form method="POST" action="?/saveChecklistValue" use:enhance class="flex items-center gap-2">
+												<form method="POST" action="?/saveChecklistValue" use:enhance class="flex flex-1 items-center gap-2">
 													<input type="hidden" name="itemId" value={item.id} />
-													<span class="w-28 flex-shrink-0 truncate text-sm text-gray-700 dark:text-gray-300" title={item.text}>{item.text}</span>
-													<input type="text" name="value" value={item.value ?? ''}
-														placeholder="—"
-														class="w-24 rounded border border-gray-200 px-2 py-0.5 text-sm text-right font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500 focus:outline-none dark:border-gray-600 dark:bg-gray-700 dark:text-white" />
-													{#if item.unit}
-														<span class="w-10 flex-shrink-0 text-xs text-gray-400 dark:text-gray-500">{item.unit}</span>
-													{/if}
-													<button type="submit" class="rounded px-1.5 py-0.5 text-xs text-blue-600 hover:bg-blue-50 dark:text-blue-400 dark:hover:bg-blue-900/20">Save</button>
+													<span class="truncate text-sm text-gray-700 dark:text-gray-300" title={item.text}>{item.text}</span>
+													<div class="ml-auto flex items-center gap-2">
+														<input type="text" name="value" value={item.value ?? ''}
+															placeholder="—"
+															class="w-24 rounded border border-gray-200 px-2 py-0.5 text-sm text-right font-mono focus:border-blue-500 focus:ring-1 focus:ring-blue-500 focus:outline-none dark:border-gray-600 dark:bg-gray-700 dark:text-white" />
+														{#if item.unit}
+															<span class="w-10 flex-shrink-0 text-xs text-gray-400 dark:text-gray-500">{item.unit}</span>
+														{/if}
+														<button type="submit" class="rounded px-1.5 py-0.5 text-xs text-blue-600 hover:bg-blue-50 dark:text-blue-400 dark:hover:bg-blue-900/20">Save</button>
+													</div>
 												</form>
 											{:else}
 												<!-- Checkbox -->