Implement autofocus on first input of login pages (#3744)

This commit add autofocus on the first input of login pages and specificaly:

- login page: on the username
- otp page: on the otp code input
- account recovery page: on the account recovery key input

client/app/views/login/default.html

@@ -6,7 +6,7 @@
         <div class="input-group-prepend">
           <span class="input-group-text"><i class="fa-solid fa-user"></i></span>
         </div>
-        <input class="form-control" name="username" aria-label="{{'Username' | translate}}" placeholder="{{'Username' | translate}}" data-ng-model="Authentication.loginData.loginUsername" type="text" required />
+        <input class="form-control" name="username" aria-label="{{'Username' | translate}}" placeholder="{{'Username' | translate}}" data-ng-model="Authentication.loginData.loginUsername" type="text" autofocus required />
       </div>
     </div>
     <div class="form-group">
@@ -33,7 +33,7 @@
     </div>
 
     <div class="input-group">
-      <input name="input-2fa" class="form-control" data-ng-model="Authentication.loginData.loginAuthCode" type="text" size="6" maxlength="6" required />
+      <input name="input-2fa" class="form-control" data-ng-model="Authentication.loginData.loginAuthCode" type="text" size="6" maxlength="6" autofocus required />
 
       <div class="input-group-btn">
         <button id="login-button" class="btn btn-primary" data-ng-disabled="Authentication.loginInProgress || loginForm.$invalid" data-ng-click="Authentication.login(0, Authentication.loginData.loginUsername, Authentication.loginData.loginPassword, Authentication.loginData.loginAuthCode)" type="submit">

client/app/views/login/simplified.html

@@ -1,7 +1,7 @@
 <div data-ng-if="!Authentication.requireAuthCode">
   <div data-ng-if="public.receivers.length === 1">
     <div class="form-group">
-      <input class="form-control" name="password" placeholder="{{'Password' | translate}}" data-ng-model="loginData.loginPassword" type="password" required />
+      <input class="form-control" name="password" placeholder="{{'Password' | translate}}" data-ng-model="loginData.loginPassword" type="password" autofocus required />
     </div>
     <div class="form-group" data-ng-init="loginData.loginUsername = public.receivers[0].id">
       <button id="login-button" class="btn btn-primary" data-ng-disabled="Authentication.loginInProgress || loginForm.$invalid" data-ng-click="Authentication.login(0, loginData.loginUsername, loginData.loginPassword)" type="submit">

client/app/views/passwordreset/2fa.html

@@ -2,7 +2,7 @@
   <div class="col-md-6">
     <div class="form-group">
       <label data-translate>Enter the two factor authentication code</label>
-      <input class="form-control" data-ng-model="request.auth_code" type="text" size="6" maxlength="6" required />
+      <input class="form-control" data-ng-model="request.auth_code" type="text" size="6" maxlength="6" autofocus required />
     </div>
 
     <div class="input-group">

client/app/views/passwordreset/main.html

@@ -8,7 +8,7 @@
   <div class="col-md-3">
     <form name="form" autocomplete="off" novalidate>
       <div class="input-group">
-        <input class="form-control" name="username" data-ng-model="request.username" type="text" required />
+        <input class="form-control" name="username" data-ng-model="request.username" type="text" autofocus required />
         <span class="input-group-append">
           <button class="btn btn-primary" data-ng-disabled="!request.username"  data-ng-click="submit()" type="submit" data-translate>Submit</button>
 	  <a class="btn" href="#" data-ng-click="Utils.openSupportModal()" data-uib-tooltip="{{'Request support' | translate}}"><i class="fa-solid fa-life-ring"></i></a>

client/app/views/passwordreset/reset.html

@@ -8,7 +8,7 @@
     <div class="col-md-auto">
       <form name="form" autocomplete="off" novalidate>
         <div class="input-group">
-          <input class="form-control recoverykeyinput" type="text" maxlength="64" size="64" data-ng-model="request.recovery_key" name="recoveryKey" recoverykeyvalidator>
+          <input class="form-control recoverykeyinput" type="text" maxlength="64" size="64" data-ng-model="request.recovery_key" name="recoveryKey" recoverykeyvalidator autofocus>
           <div class="input-group-btn">
             <button class="btn btn-primary" data-ng-click="submit()" type="submit" data-translate>Submit</button>
             <a class="btn" href="#" data-ng-click="Utils.openSupportModal()" data-uib-tooltip="{{'Request support' | translate}}"><i class="fa-solid fa-life-ring"></i></a>