jennie/ghostguild-org
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(forms): tighten labels and add Circle helper text

Browse source 
- join.vue: "Full Name" -> "Name", "Email Address" -> "Email", drop redundant "Your name" placeholder
- join.vue + accept-invite.vue: unify Circle helper copy to "Where you are in your co-op journey. You can change this anytime."
- join.vue: add .field-note style rule for the new helper paragraph
This commit is contained in:
Jennie Robinson Faber 2026-05-23 16:05:15 +01:00
parent ad63a37a05
commit 1079e8212f
2 changed files with 11 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

2
app/pages/accept-invite.vue
View file

@ -68,7 +68,7 @@
<div class="form-group full-width">
<label class="form-label">Circle</label>
<p class="field-note" style="margin-bottom: 8px">Which circle fits where you are right now?</p>
<p class="field-note" style="margin-bottom: 8px">Where you are in your co-op journey. You can change this anytime.</p>
<div class="circle-radios">
<div class="circle-radio community">
<input

13
app/pages/join.vue
View file

@ -121,18 +121,17 @@
<form @submit.prevent="handleSubmit">
<div class="form-stack">
<div class="form-group">
<label class="form-label" for="join-name">Full Name</label>
<label class="form-label" for="join-name">Name</label>
<input
id="join-name"
v-model="form.name"
class="form-input"
type="text"
placeholder="Your name"
required
>
</div>
<div class="form-group">
<label class="form-label" for="join-email">Email Address</label>
<label class="form-label" for="join-email">Email</label>
<input
id="join-email"
v-model="form.email"
@ -144,6 +143,7 @@
</div>
<div class="form-group">
<label class="form-label">Circle</label>
<p class="field-note">Where you are in your co-op journey. You can change this anytime.</p>
<div class="circle-radios">
<div class="circle-radio community">
<input
@ -627,6 +627,13 @@ onUnmounted(() => {
margin-top: 10px;
line-height: 1.6;
}
.field-note {
font-size: 10px;
color: var(--text-faint);
margin-top: 4px;
margin-bottom: 8px;
line-height: 1.4;
}
/* ---- TWO-COLUMN JOIN LAYOUT ---- */
.join-two-col {