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>
This commit is contained in:
2026-09-04 21:03:57 +01:00
co-authored by Claude Sonnet 5
parent ea169ebed0
commit ed07ea442d
2 changed files with 17 additions and 17 deletions
+11 -14
View File
@@ -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"