Merge pull request #40 from ls1intum/develop

Change UI of run buttons
ls1intum · Nov 18, 2023 · 4b67ef3 · 4b67ef3
2 parents 7b8da11 + db6c780
commit 4b67ef3
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 16 deletions.
diff --git a/src/main/webapp/app/layouts/result-box/result-box.component.html b/src/main/webapp/app/layouts/result-box/result-box.component.html
@@ -1,4 +1,4 @@
-<div class="card mb-3 ms-1 me-1" *ngIf="simulationStats">
+<div class="card h-100" *ngIf="simulationStats">
   <div class="card-header">
     {{ formatRequestType(simulationStats.requestType) }}
   </div>

diff --git a/src/main/webapp/app/layouts/server-badge/server-badge.component.html b/src/main/webapp/app/layouts/server-badge/server-badge.component.html
@@ -3,7 +3,7 @@ <h5>
     class="badge"
     [ngClass]="{
       'bg-success': server == ArtemisServer.LOCAL,
-      'bg-warning': server == ArtemisServer.STAGING,
+      'bg-warning text-dark': server == ArtemisServer.STAGING,
       'bg-danger': server == ArtemisServer.PRODUCTION,
       'bg-info': server == ArtemisServer.TS1 || server == ArtemisServer.TS3
     }"

diff --git a/src/main/webapp/app/layouts/simulation-card/simulation-card.component.html b/src/main/webapp/app/layouts/simulation-card/simulation-card.component.html
@@ -29,20 +29,22 @@
       </button>
     </div>
   </div>
-  <div
-    class="card-footer run-item"
-    role="button"
-    *ngFor="let run of displayedRuns"
-    (click)="clickedRun(run)"
-    [ngClass]="{ 'bg-primary-subtle': run.id == selectedRun?.id }"
-  >
-    <div class="space-between-wrapper">
-      <div class="flex-container">
-        <jhi-status-icon [status]="run!.status"></jhi-status-icon>
-        <p class="mb-0 ms-3">{{ run!.startDateTime | date: 'dd.MM.yyyy, HH:mm' }}</p>
+  <div class="card-footer">
+    <button
+      type="button"
+      *ngFor="let run of displayedRuns"
+      class="shadow btn btn-outline-secondary w-100 mb-2"
+      (click)="clickedRun(run)"
+      [ngClass]="{ active: selectedRun == run }"
+    >
+      <div class="space-between-wrapper text-white">
+        <div class="flex-container">
+          <jhi-status-icon [status]="run!.status"></jhi-status-icon>
+          <p class="mb-0 ms-3">{{ run!.startDateTime | date: 'dd.MM.yyyy, HH:mm' }}</p>
+        </div>
+        <fa-icon [icon]="faChevronRight"></fa-icon>
       </div>
-      <fa-icon [icon]="faChevronRight"></fa-icon>
-    </div>
+    </button>
   </div>
   <div class="card-footer" *ngIf="simulation.runs.length > 3">
     <button

diff --git a/src/main/webapp/app/simulations/simulations-overview/simulations-overview.component.html b/src/main/webapp/app/simulations/simulations-overview/simulations-overview.component.html
@@ -62,7 +62,7 @@ <h2 ngbAccordionHeader>
       </div>
     </div>
     <div class="flex-wrapper">
-      <div class="w-50" *ngFor="let simulationStats of selectedRun.stats">
+      <div class="w-50 mb-3 ps-1 pe-1" *ngFor="let simulationStats of selectedRun.stats">
         <jhi-result-box [simulationStats]="simulationStats"></jhi-result-box>
       </div>
     </div>