Restyles: Confirmation Dialog

This commit is contained in:
apapachristou 2019-05-22 16:36:24 +03:00
parent 072f97fdb7
commit 0708a4f58d
5 changed files with 24 additions and 8 deletions

View File

@ -1,10 +1,15 @@
<div class="confirmation-dialog"> <div class="confirmation-dialog">
<div class="confirmation-message"> <div class="row d-flex flex-row">
{{ data.message }} <div class="col-auto confirmation-message">
{{ data.message }}
</div>
<div class="col-auto close-btn" (click)="close()"><mat-icon>close</mat-icon></div>
</div> </div>
<div class="row"> <div class="row">
<div class="col"></div> <div class="col"></div>
<div class="col-auto"><button mat-raised-button type="button" (click)="cancel()" class="cancel">{{ data.cancelButton }}</button></div> <div class="col-auto"><button mat-raised-button type="button" (click)="cancel()"
<div class="col-auto"><button mat-raised-button type="button" (click)="confirm()" class="confirm">{{ data.confirmButton }}</button></div> class="cancel">{{ data.cancelButton }}</button></div>
<div class="col-auto"><button mat-raised-button type="button" (click)="confirm()"
class="confirm">{{ data.confirmButton }}</button></div>
</div> </div>
</div> </div>

View File

@ -3,13 +3,18 @@
padding-bottom: 20px; padding-bottom: 20px;
} }
.close-btn {
margin-left: auto;
cursor: pointer;
}
.cancel { .cancel {
background-color: #ba2c2c; background-color: #aaaaaa;
color: #ffffff; color: #ffffff;
} }
.confirm { .confirm {
background-color: #92d050; background-color: #ba2c2c;
color: #ffffff; color: #ffffff;
} }

View File

@ -14,6 +14,10 @@ export class ConfirmationDialogComponent {
) { ) {
} }
close() {
this.dialogRef.close(false);
}
cancel() { cancel() {
this.dialogRef.close(false); this.dialogRef.close(false);
} }

View File

@ -93,7 +93,7 @@ export class DmpOverviewComponent extends BaseComponent implements OnInit {
maxWidth: '300px', maxWidth: '300px',
data: { data: {
message: this.language.instant('GENERAL.CONFIRMATION-DIALOG.DELETE-ITEM'), message: this.language.instant('GENERAL.CONFIRMATION-DIALOG.DELETE-ITEM'),
confirmButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CONFIRM'), confirmButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.DELETE'),
cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL') cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL')
} }
}); });

View File

@ -36,7 +36,9 @@
"DELETE-ITEM": "Delete this item?", "DELETE-ITEM": "Delete this item?",
"ACTIONS": { "ACTIONS": {
"CONFIRM": "Yes", "CONFIRM": "Yes",
"CANCEL": "No" "No": "No",
"DELETE": "Delete",
"CANCEL": "Cancel"
} }
}, },
"ACTIONS": { "ACTIONS": {