From f6cd2bce54d1d581e170d95654dce96fde7c0ee8 Mon Sep 17 00:00:00 2001
From: Laurent Peuch <cortex@worlddomination.be>
Date: Sat, 3 Nov 2018 04:57:28 +0100
Subject: [PATCH] [enh] put fancy colors for job background

---
 static/css/style.css | 16 ++++++++++++++++
 templates/index.html |  2 +-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/static/css/style.css b/static/css/style.css
index ff4a49a..6fc6250 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -20,4 +20,20 @@
 
 .navbar {
     border-bottom: 0.5px solid #ddd;
+}
+
+.doneJob {
+    background-color: #BCFFBC80 !important;;
+}
+
+.failureJob {
+    background-color: #FCAAAA80 !important;;
+}
+
+.canceledJob {
+    background-color: #FAFCAA80 !important;;
+}
+
+.runningJob {
+    background-color: #D9EDF7 !important;;
 }
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index 66fe666..df84c83 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -13,7 +13,7 @@
                     <th>Started time</th>
                     <th>End time</th>
                 </thead>
-                <tr v-for="(job, index) in jobs" :id="job.id" v-bind:class="{deleted: job.deleted}">
+                <tr v-for="(job, index) in jobs" :id="job.id" v-bind:class="[{deleted: job.deleted}, job.state + 'Job']">
                     <td><a v-if="!job.deleted" v-bind:href="'job/' + job.id">{{job.name}}</a><span v-if="job.deleted">{{job.name}} (deleted)</span> <small title="job's id">#{{job.id}} </small></td>
                     <td>{{job.state}}</td>
                     <td>{{timestampToDate(job.created_time)}}</td>