From ed07ea442d37a97a141fa35f029920ec9587a09b Mon Sep 17 00:00:00 2001
From: Aneurin Barker Snook <aneurin@aneur.in>
Date: Fri, 4 Sep 2026 21:03:57 +0100
Subject: [PATCH] Put the Save name button beside the input, fit to its width

Matches the status 'Add' form immediately below it: renamed the
shared row layout from .status-list__new to .field-row (it now backs
both forms) and switched the project name form to it -- input grows,
button sits to its right sized to its own label instead of stretching
full width underneath. Dropped the visible 'Name' label in favour of
a placeholder + aria-label, mirroring the status form exactly.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 web/src/style.css                      |  9 ++++++---
 web/src/views/ProjectConfigureView.vue | 25 +++++++++++--------------
 2 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/web/src/style.css b/web/src/style.css
index 100a591..bb395b4 100644
--- a/web/src/style.css
+++ b/web/src/style.css
@@ -749,13 +749,16 @@ h1 {
   cursor: not-allowed;
 }
 
-.status-list__new {
+/* An input with its submit button beside it (fit to its label text) rather
+   than below (full width, the plain .form pattern) -- the status "Add" form
+   and the project name form both use it. */
+.field-row {
   display: flex;
   gap: 0.4rem;
   margin-top: 0.75rem;
 }
 
-.status-list__new input {
+.field-row input {
   flex: 1;
   min-width: 0;
   font: inherit;
@@ -767,7 +770,7 @@ h1 {
   color: var(--text);
 }
 
-.status-list__new button[type='submit'] {
+.field-row button[type='submit'] {
   flex: none;
   padding: 0.4rem 0.7rem;
   font-size: 0.9rem;
diff --git a/web/src/views/ProjectConfigureView.vue b/web/src/views/ProjectConfigureView.vue
index f7239ec..827525e 100644
--- a/web/src/views/ProjectConfigureView.vue
+++ b/web/src/views/ProjectConfigureView.vue
@@ -198,23 +198,20 @@ onBeforeUnmount(() => window.removeEventListener('keydown', onKeydown))
       <section class="config-section">
         <h2>Project name</h2>
 
-        <form class="form" @submit.prevent="onRenameProject">
-          <label>
-            <span>Name</span>
-            <input v-model="nameDraft" type="text" maxlength="255" required />
-            <small v-if="renameError?.fieldError('title')" class="field-error">
-              {{ renameError.fieldError('title') }}
-            </small>
-          </label>
-
-          <p v-if="renameError && Object.keys(renameError.details).length === 0" class="form-error">
-            {{ renameError.message }}
-          </p>
-
+        <form class="field-row" @submit.prevent="onRenameProject">
+          <input
+            v-model="nameDraft"
+            type="text"
+            maxlength="255"
+            required
+            placeholder="Name"
+            aria-label="Project name"
+          />
           <button type="submit" :disabled="renaming || nameDraft.trim() === project.title">
             {{ renaming ? 'Saving…' : 'Save name' }}
           </button>
         </form>
+        <p v-if="renameError" class="form-error">{{ renameError.message }}</p>
       </section>
 
       <section class="config-section">
@@ -251,7 +248,7 @@ onBeforeUnmount(() => window.removeEventListener('keydown', onKeydown))
           </template>
         </draggable>
 
-        <form class="status-list__new" @submit.prevent="onAddStatus">
+        <form class="field-row" @submit.prevent="onAddStatus">
           <input
             v-model="newStatusName"
             type="text"