refactor: enhance dialog actions layout and styling in schedule task dialog

This commit is contained in:
Ivan Kalashnikov 2026-01-20 13:12:04 +07:00
parent e6dada42e9
commit 6ba28a5a33
2 changed files with 37 additions and 20 deletions

View file

@ -92,31 +92,32 @@
</mat-dialog-content>
<mat-dialog-actions align="start">
@if (data.task && (data.task.dueWithTime || plannedDayForTask)) {
<div class="dialog-actions-center">
@if (data.task && (data.task.dueWithTime || plannedDayForTask)) {
<button
(click)="remove()"
color="warn"
mat-stroked-button
>
@if (selectedTime) {
<mat-icon>alarm_off</mat-icon>
} @else {
<mat-icon>event_busy</mat-icon>
}
{{ T.F.TASK.D_SCHEDULE_TASK.UNSCHEDULE | translate }}
</button>
}
<button
(click)="remove()"
color="warn"
color="primary"
mat-stroked-button
(click)="submit()"
>
@if (selectedTime) {
<mat-icon>alarm_off</mat-icon>
<mat-icon>alarm</mat-icon>
} @else {
<mat-icon>event_busy</mat-icon>
<mat-icon>today</mat-icon>
}
{{ T.F.TASK.D_SCHEDULE_TASK.UNSCHEDULE | translate }}
{{ T.F.TASK.D_SCHEDULE_TASK.SCHEDULE | translate }}
</button>
}
<button
color="primary"
mat-stroked-button
(click)="submit()"
>
@if (selectedTime) {
<mat-icon>alarm</mat-icon>
} @else {
<mat-icon>today</mat-icon>
}
{{ T.F.TASK.D_SCHEDULE_TASK.SCHEDULE | translate }}
</button>
</div>
</mat-dialog-actions>

View file

@ -111,3 +111,19 @@ mat-dialog-content {
border-left: 1px solid var(--extra-border-color);
}
}
.dialog-actions-center {
display: flex;
justify-content: center;
align-items: center;
width: 96%;
margin: 0 auto;
gap: 8px;
padding-bottom: 18px;
}
.dialog-actions-center button {
flex: 1 1 0;
min-width: 0;
max-width: 100%;
}