mirror of
https://github.com/flarum/framework.git
synced 2024-11-25 09:41:49 +08:00
fix: Add a11y labels to auth modal inputs (#3207)
This commit is contained in:
parent
5befaa6886
commit
a36f98d1fc
|
@ -52,6 +52,8 @@ export default class ForgotPasswordModal<CustomAttrs extends IForgotPasswordModa
|
|||
);
|
||||
}
|
||||
|
||||
const emailLabel = extractText(app.translator.trans('core.forum.forgot_password.email_placeholder'));
|
||||
|
||||
return (
|
||||
<div className="Modal-body">
|
||||
<div className="Form Form--centered">
|
||||
|
@ -61,7 +63,8 @@ export default class ForgotPasswordModal<CustomAttrs extends IForgotPasswordModa
|
|||
className="FormControl"
|
||||
name="email"
|
||||
type="email"
|
||||
placeholder={extractText(app.translator.trans('core.forum.forgot_password.email_placeholder'))}
|
||||
placeholder={emailLabel}
|
||||
aria-label={emailLabel}
|
||||
bidi={this.email}
|
||||
disabled={this.loading}
|
||||
/>
|
||||
|
|
|
@ -57,6 +57,9 @@ export default class LogInModal<CustomAttrs extends ILoginModalAttrs = ILoginMod
|
|||
fields() {
|
||||
const items = new ItemList();
|
||||
|
||||
const identificationLabel = extractText(app.translator.trans('core.forum.log_in.username_or_email_placeholder'));
|
||||
const passwordLabel = extractText(app.translator.trans('core.forum.log_in.password_placeholder'));
|
||||
|
||||
items.add(
|
||||
'identification',
|
||||
<div className="Form-group">
|
||||
|
@ -64,7 +67,8 @@ export default class LogInModal<CustomAttrs extends ILoginModalAttrs = ILoginMod
|
|||
className="FormControl"
|
||||
name="identification"
|
||||
type="text"
|
||||
placeholder={extractText(app.translator.trans('core.forum.log_in.username_or_email_placeholder'))}
|
||||
placeholder={identificationLabel}
|
||||
aria-label={identificationLabel}
|
||||
bidi={this.identification}
|
||||
disabled={this.loading}
|
||||
/>
|
||||
|
@ -80,7 +84,8 @@ export default class LogInModal<CustomAttrs extends ILoginModalAttrs = ILoginMod
|
|||
name="password"
|
||||
type="password"
|
||||
autocomplete="current-password"
|
||||
placeholder={extractText(app.translator.trans('core.forum.log_in.password_placeholder'))}
|
||||
placeholder={passwordLabel}
|
||||
aria-label={passwordLabel}
|
||||
bidi={this.password}
|
||||
disabled={this.loading}
|
||||
/>
|
||||
|
|
|
@ -68,6 +68,10 @@ export default class SignUpModal<CustomAttrs extends ISignupModalAttrs = ISignup
|
|||
fields() {
|
||||
const items = new ItemList();
|
||||
|
||||
const usernameLabel = extractText(app.translator.trans('core.forum.sign_up.username_placeholder'));
|
||||
const emailLabel = extractText(app.translator.trans('core.forum.sign_up.email_placeholder'));
|
||||
const passwordLabel = extractText(app.translator.trans('core.forum.sign_up.password_placeholder'));
|
||||
|
||||
items.add(
|
||||
'username',
|
||||
<div className="Form-group">
|
||||
|
@ -75,7 +79,8 @@ export default class SignUpModal<CustomAttrs extends ISignupModalAttrs = ISignup
|
|||
className="FormControl"
|
||||
name="username"
|
||||
type="text"
|
||||
placeholder={extractText(app.translator.trans('core.forum.sign_up.username_placeholder'))}
|
||||
placeholder={usernameLabel}
|
||||
aria-label={usernameLabel}
|
||||
bidi={this.username}
|
||||
disabled={this.loading || this.isProvided('username')}
|
||||
/>
|
||||
|
@ -90,7 +95,8 @@ export default class SignUpModal<CustomAttrs extends ISignupModalAttrs = ISignup
|
|||
className="FormControl"
|
||||
name="email"
|
||||
type="email"
|
||||
placeholder={extractText(app.translator.trans('core.forum.sign_up.email_placeholder'))}
|
||||
placeholder={emailLabel}
|
||||
aria-label={emailLabel}
|
||||
bidi={this.email}
|
||||
disabled={this.loading || this.isProvided('email')}
|
||||
/>
|
||||
|
@ -107,7 +113,8 @@ export default class SignUpModal<CustomAttrs extends ISignupModalAttrs = ISignup
|
|||
name="password"
|
||||
type="password"
|
||||
autocomplete="new-password"
|
||||
placeholder={extractText(app.translator.trans('core.forum.sign_up.password_placeholder'))}
|
||||
placeholder={passwordLabel}
|
||||
aria-label={passwordLabel}
|
||||
bidi={this.password}
|
||||
disabled={this.loading}
|
||||
/>
|
||||
|
|
Loading…
Reference in New Issue
Block a user