Make the change-email form a single line, like the rename forms
Switches from the stacked .form pattern to .field-row: the input and its submit button now sit side by side, the button sized to fit its text rather than stretched full width -- matching the project rename and add-status forms. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -140,24 +140,27 @@ async function onRemovePasskey(passkey: Passkey) {
|
||||
We'll email a confirmation link to the new address; the change only
|
||||
takes effect once you open it.
|
||||
</p>
|
||||
<form class="form" @submit.prevent="onChangeEmail">
|
||||
<label>
|
||||
<span>New email</span>
|
||||
<input v-model="newEmail" class="field" type="email" maxlength="255" required />
|
||||
<small v-if="changeError?.fieldError('email')" class="field-error">
|
||||
{{ changeError.fieldError('email') }}
|
||||
</small>
|
||||
</label>
|
||||
|
||||
<p v-if="changeError && Object.keys(changeError.details).length === 0" class="form-error">
|
||||
{{ changeError.message }}
|
||||
</p>
|
||||
<p v-if="changeMessage" class="muted">{{ changeMessage }}</p>
|
||||
|
||||
<form class="field-row" @submit.prevent="onChangeEmail">
|
||||
<input
|
||||
v-model="newEmail"
|
||||
class="field field--compact"
|
||||
type="email"
|
||||
maxlength="255"
|
||||
required
|
||||
placeholder="New email"
|
||||
aria-label="New email"
|
||||
/>
|
||||
<button type="submit" :disabled="changing || cooldown > 0">
|
||||
{{ changing ? 'Sending…' : cooldown > 0 ? `Wait ${cooldown}s` : 'Send confirmation link' }}
|
||||
</button>
|
||||
</form>
|
||||
<p v-if="changeError?.fieldError('email')" class="field-error">
|
||||
{{ changeError.fieldError('email') }}
|
||||
</p>
|
||||
<p v-if="changeError && Object.keys(changeError.details).length === 0" class="form-error">
|
||||
{{ changeError.message }}
|
||||
</p>
|
||||
<p v-if="changeMessage" class="muted">{{ changeMessage }}</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
|
||||
Reference in New Issue
Block a user