Skip to content

Commit 42979d5

Browse files
feat: Add accessible labels to Auth form inputs
- Adds explicit `label` props to Full Name, Email, and Password inputs in `web/pages/Auth.tsx`. - Leverages the existing `label` prop support in `Input` component for better accessibility. - Fixes issues where inputs relied solely on placeholders. - Verified with Playwright tests and screenshot.
1 parent 22f39f1 commit 42979d5

File tree

2 files changed

+2885
-0
lines changed

2 files changed

+2885
-0
lines changed

web/pages/Auth.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -214,6 +214,7 @@ export const Auth = () => {
214214
exit={{ height: 0, opacity: 0 }}
215215
>
216216
<Input
217+
label="Full Name"
217218
placeholder="Full Name"
218219
value={name}
219220
onChange={(e) => setName(e.target.value)}
@@ -225,6 +226,7 @@ export const Auth = () => {
225226
</AnimatePresence>
226227

227228
<Input
229+
label="Email Address"
228230
type="email"
229231
placeholder="Email Address"
230232
value={email}
@@ -233,6 +235,7 @@ export const Auth = () => {
233235
className={isNeo ? 'rounded-none' : ''}
234236
/>
235237
<Input
238+
label="Password"
236239
type="password"
237240
placeholder="Password"
238241
value={password}

0 commit comments

Comments
 (0)