WEB-392: Fix alignment of download and upload buttons in bulk import

- Added min-height to mat-cards to ensure consistent height
- Added flex-spacer to push buttons to the bottom
- Removed flex-grow from mat-card-content
- Buttons now align horizontally regardless of varying card content
This commit is contained in:
Anvay
2025-11-04 13:59:19 +05:30
parent 3b5a68bb1b
commit f78b7763d6
2 changed files with 8 additions and 3 deletions
@@ -66,13 +66,13 @@
'labels.text.Please retain the value Entity/Person in the filename.' | translate
}}</mat-hint>
<div class="flex-spacer"></div>
<div class="flex-13">
<button mat-raised-button color="primary" [disabled]="!template" (click)="uploadTemplate()">
<i class="fa fa-upload"></i>&nbsp;&nbsp;{{ 'labels.buttons.Upload' | translate }}
</button>
</div>
<div *ngIf="bulkImport.formFields >= 2" class="flex cover"></div>
</mat-card>
</div>
@@ -20,6 +20,7 @@
display: flex;
flex-direction: column;
border-radius: 20px;
min-height: 400px;
h3 {
margin: 0 0 20px;
@@ -36,7 +37,6 @@
mat-card-content {
padding: 0;
margin-bottom: 20px;
flex-grow: 1;
mat-form-field {
width: 100%;
@@ -55,6 +55,11 @@
}
}
.flex-spacer {
flex: 1;
min-height: 20px;
}
mifosx-file-upload {
margin: 16px 0;
flex-grow: 1;