Email text fields: show email keyboard on mobile devices

chairemobilite · Oct 26, 2023 · 58cb61b · 58cb61b
1 parent 2f5a6f4
commit 58cb61b
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 0 deletions.
diff --git a/packages/chaire-lib-frontend/src/components/forms/auth/localLogin/RegisterForm.tsx b/packages/chaire-lib-frontend/src/components/forms/auth/localLogin/RegisterForm.tsx
@@ -162,6 +162,7 @@ export class RegisterForm extends React.Component<RegisterFormProps & WithTransl
                         name="email"
                         id="email"
                         type="text"
+                        inputMode="email"
                         className="apptr__form-input apptr__form-input-string apptr__input apptr__input-string"
                         autoFocus
                         value={this.state.email}

diff --git a/packages/chaire-lib-frontend/src/components/forms/auth/passwordless/PwdLessLoginForm.tsx b/packages/chaire-lib-frontend/src/components/forms/auth/passwordless/PwdLessLoginForm.tsx
@@ -94,6 +94,7 @@ export class LoginPage extends React.Component<LoginPageProps & WithTranslation,
                     <input
                         name="email"
                         id="email"
+                        inputMode="email"
                         type="text"
                         placeholder={this.props.t(['survey:auth:EmailPlaceholder', 'auth:EmailPlaceholder'])}
                         className="apptr__form-input apptr__form-input-string apptr__input apptr__input-string"

diff --git a/packages/chaire-lib-frontend/src/components/pages/ForgotPasswordPage.tsx b/packages/chaire-lib-frontend/src/components/pages/ForgotPasswordPage.tsx
@@ -111,6 +111,7 @@ export class ForgotPasswordPage extends React.Component<ForgotPasswordPageProps,
                             name="email"
                             id="email"
                             type="text"
+                            inputMode="email"
                             className="apptr__form-input apptr__form-input-string apptr__input apptr__input-string"
                             autoFocus
                             value={this.state.email}