#59 fixed animation on logs

This commit is contained in:
Fabio Formosa
2022-09-16 23:39:49 +02:00
parent e0b0378329
commit 5be49a4090
8 changed files with 47 additions and 36 deletions

View File

@@ -1,29 +1,29 @@
<mat-card>
<mat-card >
<mat-card-header>
<mat-card-title><b>JOB LOGS</b></mat-card-title>
<mat-card-subtitle><b>JOB LOGS</b></mat-card-subtitle>
</mat-card-header>
<mat-card-content>
<div id="logs">
<div *ngFor = "let log of logs" fxLayout="row" fxLayout.xs="column">
<div fxFlex="1 1 20%">
<span [ngClass]="{'animated zoomIn firstLog': $first}"> [{{log.time|date:'medium'}}]</span>
</div>
<div fxFlex="1 1 10%">
<span [ngClass]="{'animated zoomIn firstLog': $first}">
<i class = "fas" [ngClass]="{'fa-check-circle green': log.type == 'INFO',
'fa-exclamation-triangle yellow': log.type == 'WARN',
'fa-times-circle red': log.type == 'ERROR'}"></i>
</span>
</div>
<div fxFlex="1 1 20%">
<span [ngClass]="{'animated zoomIn firstLog': $first}">
{{log.threadName}}
</span>
</div>
<div fxFlex="1 1 50%">
<span [ngClass]="{'animated zoomIn firstLog': $first}"> {{log.msg}}</span>
</div>
<div id="logs">
<div *ngFor = "let log of logs; let first = first" fxLayout="row" fxLayout.xs="column" fxLayoutAlign="start" fxLayoutGap="10px">
<div fxFlex="0 1 300px">
<span [ngClass]="{'animate__animated animate__zoomIn zoomIn firstLog': first}"> [{{log.time|date:'medium'}}]</span>
</div>
<div fxFlex="1 1 16px">
<span [ngClass]="{'animated zoomIn firstLog': first}">
<i class = "fas" [ngClass]="{'fa-check-circle green': log.type == 'INFO',
'fa-exclamation-triangle yellow': log.type == 'WARN',
'fa-times-circle red': log.type == 'ERROR'}"></i>
</span>
</div>
<div fxFlex="0 1 250px">
<span [ngClass]="{'animate__animated animate__zoomIn zoomIn firstLog': first}">
{{log.threadName}}
</span>
</div>
<div fxFlex="1 1">
<span [ngClass]="{'animate__animated animate__zoomIn zoomIn firstLog': first}"> {{log.msg}}</span>
</div>
</div>
</div>
</mat-card-content>
</mat-card>
</mat-card>