diff --git a/src/app/form/form.component.html b/src/app/form/form.component.html index 01b0163ba4d0d7e1468f0932a51307fcdabd1ac1..0ce70c2ae0e6b45b83b63034b0437f802cb77f8e 100644 --- a/src/app/form/form.component.html +++ b/src/app/form/form.component.html @@ -119,7 +119,10 @@ </div> <div class="form-group" fxLayout="column"> <label for="password">Création de mot de passe</label> - <p class="password" *ngIf="accountForm.get('password').invalid && accountForm.get('password').value"> + <p + class="password" + [ngClass]="{ invalid: accountForm.get('password').invalid && accountForm.get('password').value }" + > Le mot de passe doit contenir au minimum : 8 caractères dont un caractère spécial, un caractère en majuscule et un chiffre. </p> diff --git a/src/app/form/form.component.scss b/src/app/form/form.component.scss index c51c6a9fc4c0f6e2c8f16549b68cb65beb13566a..470827eff01f3b4fc3411913053e3e1a820cfb48 100644 --- a/src/app/form/form.component.scss +++ b/src/app/form/form.component.scss @@ -153,9 +153,14 @@ h3 { margin-bottom: 0; @include cn-regular-18; &.password { - color: $orange-warning; + @include cn-regular-14; + color: $grey-3; + margin-top: 4px; width: 256px; + &.invalid { + color: $orange-warning; + } } &.notRequired { font-style: italic;