displaying fash message at the bottom

This commit is contained in:
2023-02-12 20:28:18 +01:00
parent 7c34c2ba91
commit 120e032c99
2 changed files with 21 additions and 20 deletions

View File

@@ -4,11 +4,11 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row flex-nowrap"> <div class="row flex-nowrap">
<div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark"> <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark">
<sidenav></sidenav> <sidenav class="sticky-top"></sidenav>
</div> </div>
<div class="col py-3"> <div class="col py-3">
<flashmessages></flashmessages>
<router-outlet></router-outlet> <router-outlet></router-outlet>
<flashmessages></flashmessages>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -1,18 +1,19 @@
<ngb-toast <div class="toast-container position-fixed bottom-0 end-0 p-3">
*ngFor="let flashmessage of flashmessagesService.toasts" <ngb-toast
[header]="flashmessage.type" [autohide]="true" [delay]="flashmessage.delay || 1500" *ngFor="let flashmessage of flashmessagesService.toasts"
(hiddden)="flashmessagesService.remove(flashmessage)" [header]="flashmessage.type" [autohide]="true" [delay]="flashmessage.delay || 1500"
> (hiddden)="flashmessagesService.remove(flashmessage)"
<ng-container [ngSwitch]="flashmessage.type"> >
<div *ngSwitchCase="'Success'" class="alert alert-success" role="alert"> <ng-container [ngSwitch]="flashmessage.type">
{{flashmessage.body}} <div *ngSwitchCase="'Success'" class="alert alert-success" role="alert">
</div> {{flashmessage.body}}
<div *ngSwitchCase="'Info'" class="alert alert-primary" role="alert"> </div>
{{flashmessage.body}} <div *ngSwitchCase="'Info'" class="alert alert-primary" role="alert">
</div> {{flashmessage.body}}
<div *ngSwitchCase="'Error'" class="alert alert-danger" role="alert"> </div>
{{flashmessage.body}} <div *ngSwitchCase="'Error'" class="alert alert-danger" role="alert">
</div> {{flashmessage.body}}
</ng-container> </div>
</ngb-toast> </ng-container>
</ngb-toast>
</div>