Fixing the warning icon placement.

Author: renemadsen

eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-plannings-table/time-plannings-table.component.html

@@ -17,11 +17,21 @@
         <ng-container *ngIf="row['avatarUrl'] === null">
           <div class="progress-circle" [style.--percentage]="row['percentageCompleted']">
             <div class="avatar" [style.background-image]="'url(https://www.gravatar.com/avatar/?d=retro&s=32)'"></div>
+            <ng-container *ngIf="row['softwareVersionIsValid'] === false">
+                <span [matTooltip]="'Needs update!' | translate " class="material-symbols-outlined">
+                  <mat-icon class="red-warning-avatar-icon">error</mat-icon>
+                </span>
+            </ng-container>
           </div>
         </ng-container>
         <ng-container *ngIf="row['avatarUrl'] !== null">
           <div class="progress-circle" [style.--percentage]="row['percentageCompleted']">
             <div class="avatar" [style.background-image]="'url(' + row['avatarUrl'] + ')'"></div>
+            <ng-container *ngIf="row['softwareVersionIsValid'] === false">
+                <span [matTooltip]="'Needs update!' | translate " class="material-symbols-outlined">
+                  <mat-icon class="red-warning-avatar-icon">error</mat-icon>
+                </span>
+            </ng-container>
           </div>
         </ng-container>
         <br>
@@ -57,11 +67,6 @@
                 </span>
               </ng-container>
               {{row['softwareVersion']}}
-              <div *ngIf="row['softwareVersionIsValid'] === false">
-                <span [matTooltip]="'Needs update!' | translate " class="material-symbols-outlined">
-                  <mat-icon class="neutral-icon red-text">error</mat-icon>
-                </span>
-              </div>
             </div>
           </div>
         </div>
@@ -74,11 +79,21 @@
         <ng-container *ngIf="row['avatarUrl'] === null">
           <div class="progress-circle" [style.--percentage]="row['percentageCompleted']">
             <div class="avatar" [style.background-image]="'url(https://www.gravatar.com/avatar/?d=retro&s=32)'"></div>
+            <ng-container *ngIf="row['softwareVersionIsValid'] === false">
+                <span [matTooltip]="'Needs update!' | translate " class="material-symbols-outlined">
+                  <mat-icon class="red-warning-avatar-icon">error</mat-icon>
+                </span>
+            </ng-container>
           </div>
         </ng-container>
         <ng-container *ngIf="row['avatarUrl'] !== null">
           <div class="progress-circle" [style.--percentage]="row['percentageCompleted']">
             <div class="avatar" [style.background-image]="'url(' + row['avatarUrl'] + ')'"></div>
+            <ng-container *ngIf="row['softwareVersionIsValid'] === false">
+                <span [matTooltip]="'Needs update!' | translate " class="material-symbols-outlined">
+                  <mat-icon class="red-warning-avatar-icon">error</mat-icon>
+                </span>
+            </ng-container>
           </div>
         </ng-container>
         <br>
@@ -113,11 +128,6 @@
                 </span>
               </ng-container>
               {{row['softwareVersion']}}
-              <div *ngIf="row['softwareVersionIsValid'] === false">
-                <span [matTooltip]="'Needs update!' | translate " class="material-symbols-outlined" >
-                  <mat-icon class="neutral-icon red-text">error</mat-icon>
-                </span>
-              </div>
             </div>
           </div>
         </div>