WEB-778 fix(clients): align activate client form layout with standard pattern (#3211)

This commit is contained in:
Shubham Kumar
2026-02-22 19:03:01 -06:00
committed by GitHub
parent ca19447b76
commit e5793fa590
2 changed files with 22 additions and 20 deletions
@@ -10,25 +10,27 @@
<mat-card> <mat-card>
<form [formGroup]="activateClientForm" (ngSubmit)="submit()"> <form [formGroup]="activateClientForm" (ngSubmit)="submit()">
<mat-card-content> <mat-card-content>
<mat-form-field class="flex-fill" (click)="activationDatePicker.open()"> <div class="layout-column">
<mat-label>{{ 'labels.inputs.Activated On Date' | translate }}</mat-label> <mat-form-field (click)="activationDatePicker.open()">
<input <mat-label>{{ 'labels.inputs.Activated On Date' | translate }}</mat-label>
matInput <input
[min]="minDate" matInput
[max]="maxDate" [min]="minDate"
[matDatepicker]="activationDatePicker" [max]="maxDate"
required [matDatepicker]="activationDatePicker"
formControlName="activationDate" required
/> formControlName="activationDate"
<mat-datepicker-toggle matSuffix [for]="activationDatePicker"></mat-datepicker-toggle> />
<mat-datepicker #activationDatePicker></mat-datepicker> <mat-datepicker-toggle matSuffix [for]="activationDatePicker"></mat-datepicker-toggle>
@if (activateClientForm.controls.activationDate.hasError('required')) { <mat-datepicker #activationDatePicker></mat-datepicker>
<mat-error> @if (activateClientForm.controls.activationDate.hasError('required')) {
{{ 'labels.inputs.Activated On Date' | translate }} {{ 'labels.commons.is' | translate }} <mat-error>
<strong>{{ 'labels.commons.required' | translate }}</strong> {{ 'labels.inputs.Activated On Date' | translate }} {{ 'labels.commons.is' | translate }}
</mat-error> <strong>{{ 'labels.commons.required' | translate }}</strong>
} </mat-error>
</mat-form-field> }
</mat-form-field>
</div>
</mat-card-content> </mat-card-content>
<mat-card-actions class="layout-row align-center gap-5px responsive-column"> <mat-card-actions class="layout-row align-center gap-5px responsive-column">
@@ -7,5 +7,5 @@
*/ */
.container { .container {
max-width: 37rem; max-width: 30rem;
} }