From db6c780b13a0c8743acf0a442d3a3b6af3049bb0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Valentin=20Bo=CC=88hm?= <valentin.boehm@tum.de>
Date: Sat, 18 Nov 2023 11:33:16 +0100
Subject: [PATCH] Change UI of run buttons

---
 .../result-box/result-box.component.html      |  2 +-
 .../server-badge/server-badge.component.html  |  2 +-
 .../simulation-card.component.html            | 28 ++++++++++---------
 .../simulations-overview.component.html       |  2 +-
 4 files changed, 18 insertions(+), 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
index 855ddf2a..70ce92dd 100644
--- 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
index b8eca991..dbdb4204 100644
--- 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
index e78860ed..ee9f7bea 100644
--- 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
index 124866e2..fd940a74 100644
--- 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>