Client - display conditions required for registration

This commit is contained in:
Sam 2022-02-26 18:13:20 +01:00
parent 80198f1dac
commit 5831a70d4b
4 changed files with 41 additions and 10 deletions

View File

@ -12,6 +12,11 @@
/>
<div class="show-password" @click="togglePassword">
{{ $t(`user.${showPassword ? 'HIDE' : 'SHOW'}_PASSWORD`) }}
<i
class="fa"
:class="`fa-eye${showPassword ? '-slash' : ''}`"
aria-hidden="true"
/>
</div>
</div>
</template>
@ -67,8 +72,9 @@
.show-password {
font-style: italic;
font-size: 0.85em;
text-align: right;
margin-top: -0.75 * $default-margin;
padding-left: $default-padding;
padding-right: $default-padding;
cursor: pointer;
}
}

View File

@ -33,6 +33,10 @@
v-model="formData.username"
:placeholder="$t('user.USERNAME')"
/>
<div v-if="action === 'register'" class="form-info">
<i class="fa fa-info-circle" aria-hidden="true" />
{{ $t('user.USERNAME_INFO') }}
</div>
<input
v-if="action !== 'reset'"
id="email"
@ -41,12 +45,15 @@
@invalid="invalidateForm"
type="email"
v-model="formData.email"
:placeholder="
action === 'reset-request'
? $t('user.ENTER_EMAIL')
: $t('user.EMAIL')
"
:placeholder="$t('user.EMAIL')"
/>
<div
v-if="['reset-request', 'register'].includes(action)"
class="form-info"
>
<i class="fa fa-info-circle" aria-hidden="true" />
{{ $t('user.EMAIL_INFO') }}
</div>
<PasswordInput
v-if="action !== 'reset-request'"
:disabled="registration_disabled"
@ -60,6 +67,14 @@
@updatePassword="updatePassword"
@passwordError="invalidateForm"
/>
<div
v-if="['reset', 'register'].includes(action)"
class="form-info"
>
<i class="fa fa-info-circle" aria-hidden="true" />
{{ $t('user.PASSWORD_INFO') }}
</div>
<PasswordStrength
v-if="['reset', 'register'].includes(action)"
:password="formData.password"
@ -219,6 +234,12 @@
font-style: italic;
padding: 0 $default-padding;
}
.form-info {
color: var(--alert-color);
font-size: 0.8em;
margin-top: -0.2 * $default-margin;
padding: 0 $default-padding * 1.5;
}
button {
margin: $default-margin;

View File

@ -3,7 +3,7 @@
"ALREADY_HAVE_ACCOUNT": "Already have an account?",
"CONFIRM_ACCOUNT_DELETION": "Are you sure you want to delete your account? All data will be deleted, this cannot be undone",
"EMAIL": "Email",
"ENTER_EMAIL": "Enter an email address",
"EMAIL_INFO": "Enter a valid email address.",
"ENTER_PASSWORD": "Enter a password",
"HIDE_PASSWORD": "hide password",
"INVALID_TOKEN": "Invalid token, please request a new password reset.",
@ -11,6 +11,7 @@
"LOGIN": "Login",
"LOGOUT": "Logout",
"PASSWORD": "Password",
"PASSWORD_INFO": "At least 8 characters required.",
"PASSWORD_FORGOTTEN": "Forgot password?",
"PASSWORD_RESET": "Password reset",
"PASSWORD_SENT_EMAIL_TEXT": "Check your email. If your address is in our database, you'll received an email with a link to reset your password.",
@ -86,5 +87,6 @@
"RESET_PASSWORD": "Reset your password",
"SHOW_PASSWORD": "show password",
"USER_PICTURE": "user picture",
"USERNAME": "Username"
"USERNAME": "Username",
"USERNAME_INFO": "3 to 30 characters required, only alphanumeric characters and the underscore character \"_\" allowed."
}

View File

@ -3,7 +3,7 @@
"ALREADY_HAVE_ACCOUNT": "Vous avez déjà un compte ?",
"CONFIRM_ACCOUNT_DELETION": "Etes-vous sûr de vouloir supprimer votre compte ? Toutes les données seront définitivement effacés.",
"EMAIL": "Email",
"ENTER_EMAIL": "Saisir une adresse email",
"EMAIL_INFO": "Saisir une adresse email valide.",
"ENTER_PASSWORD": "Saisir un mot de passe",
"HIDE_PASSWORD": "masquer le mot de passe",
"INVALID_TOKEN": "Jeton invalide, veullez demander une nouvelle réinitialisation de mot de passe.",
@ -11,6 +11,7 @@
"LOGIN": "Se connecter",
"LOGOUT": "Se déconnecter",
"PASSWORD": "Mot de passe",
"PASSWORD_INFO": "8 caractères minimum.",
"PASSWORD_FORGOTTEN": "Mot de passe oublié ?",
"PASSWORD_RESET": "Réinitialisation du mot de passe",
"PASSWORD_SENT_EMAIL_TEXT": "Vérifiez votre boite mail. Si vote adresse est dans notre base de données, vous recevrez un email avec un lien pour réinitialiser votre mot de passe.",
@ -85,5 +86,6 @@
"RESET_PASSWORD": "Réinitialiser votre mot de passe",
"SHOW_PASSWORD": "afficher le mot de passe",
"USER_PICTURE": "photo de l'utilisateur",
"USERNAME": "Nom d'utilisateur"
"USERNAME": "Nom d'utilisateur",
"USERNAME_INFO": "3 à 30 caractères requis, seuls les caractères alphanumériques et le caractère \"_\" sont autorisés."
}