diff --git a/src/app/profile/edit/edit.component.html b/src/app/profile/edit/edit.component.html index 48dcb3f8c92cf514839288ed3076a58290201706..84e666e86caee0134ac292e560e01787c91f5d1e 100644 --- a/src/app/profile/edit/edit.component.html +++ b/src/app/profile/edit/edit.component.html @@ -216,12 +216,19 @@ (closed)="$event ? confirm() : closeModal()" > <div class="modal-content"> - <app-input [label]="'Nouvel email'" [size]="'large'" [status]="getEmailStatus(newEmail)" [(value)]="newEmail" /> + <app-input + [label]="'Nouvel email'" + [size]="'large'" + [status]="getEmailStatus(newEmail)" + [wide]="true" + [(value)]="newEmail" + /> <app-input [label]="'Confirmer le nouvel email'" [size]="'large'" [status]="getEmailStatus(newEmailConfirm)" [statusText]="getEmailStatusText()" + [wide]="true" [(value)]="newEmailConfirm" /> </div> @@ -235,38 +242,35 @@ (closed)="$event ? confirm() : closeModal()" > <div class="modal-content"> - <div class="modal-form-group"> - <app-input - [label]="'Ancien mot de passe'" - [size]="'large'" - [autocomplete]="'on'" - [status]="getPasswordStatus(oldPassword)" - [statusText]="getOldPasswordStatusText(getPasswordStatus(oldPassword))" - [type]="'password'" - [(value)]="oldPassword" - /> - </div> - <div class="modal-form-group"> - <app-input - [label]="'Nouveau mot de passe'" - [size]="'large'" - [status]="getPasswordStatus(newPassword)" - [statusText]="getPasswordStatusText(getPasswordStatus(newPassword))" - [type]="'password'" - [(value)]="newPassword" - /> - </div> - <div class="modal-form-group"> - <app-input - [label]="'Confirmer le nouveau mot de passe'" - [size]="'large'" - [autocomplete]="'on'" - [status]="getPasswordStatus(newPasswordConfirm, newPassword)" - [statusText]="getNewPasswordStatusText(getPasswordStatus(newPasswordConfirm, newPassword))" - [type]="'password'" - [(value)]="newPasswordConfirm" - /> - </div> + <app-input + [label]="'Ancien mot de passe'" + [size]="'large'" + [autocomplete]="'on'" + [status]="getPasswordStatus(oldPassword)" + [statusText]="getOldPasswordStatusText(getPasswordStatus(oldPassword))" + [type]="'password'" + [wide]="true" + [(value)]="oldPassword" + /> + <app-input + [label]="'Nouveau mot de passe'" + [size]="'large'" + [status]="getPasswordStatus(newPassword)" + [statusText]="getPasswordStatusText(getPasswordStatus(newPassword))" + [type]="'password'" + [wide]="true" + [(value)]="newPassword" + /> + <app-input + [label]="'Confirmer le nouveau mot de passe'" + [size]="'large'" + [autocomplete]="'on'" + [status]="getPasswordStatus(newPasswordConfirm, newPassword)" + [statusText]="getNewPasswordStatusText(getPasswordStatus(newPasswordConfirm, newPassword))" + [type]="'password'" + [wide]="true" + [(value)]="newPasswordConfirm" + /> </div> </app-modal> @@ -289,6 +293,7 @@ [label]="'Mot de passe'" [type]="'password'" [size]="'large'" + [wide]="true" [(value)]="oldPassword" /> </div> diff --git a/src/app/profile/edit/edit.component.scss b/src/app/profile/edit/edit.component.scss index ef12dc1a71d6dc6c8fab6d2bead1db205969b95c..a3c1bd35e62cfe12e91b9af495a12454c7f8b189 100644 --- a/src/app/profile/edit/edit.component.scss +++ b/src/app/profile/edit/edit.component.scss @@ -165,9 +165,5 @@ p { .modal-content { display: flex; flex-direction: column; - align-items: center; - - app-input { - width: 300px; - } + gap: 16px; } diff --git a/src/app/shared/components/modal/modal.component.scss b/src/app/shared/components/modal/modal.component.scss index 4f00e6cdc1e9fdff9e0602f45d383cae5909ec04..bae1cdb00e5580c8ca61e39a917bd242e9e804a7 100644 --- a/src/app/shared/components/modal/modal.component.scss +++ b/src/app/shared/components/modal/modal.component.scss @@ -13,7 +13,7 @@ background-color: $modal-background; .modal { display: flex; - width: 400px; + width: 360px; max-height: 90%; padding: 20px; flex-direction: column;