github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2024-11-25 09:41:49 +08:00
Code Issues Actions 46 Packages Projects Releases Wiki Activity

fix: Add a11y labels to auth modal inputs (#3207)

Browse Source
This commit is contained in:
Sami Mazouz 2021-12-16 09:30:34 +01:00 committed by GitHub
parent 6a90930373
commit 93e7b446bd
3 changed files with 21 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
framework/core/js/src/forum/components/ForgotPasswordModal.tsx
View File

@ -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}
/>

9
framework/core/js/src/forum/components/LogInModal.tsx
View File

@ -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}
/>

13
framework/core/js/src/forum/components/SignUpModal.tsx
View File

@ -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}
/>