added some table css

static/styles/main.css

@@ -126,3 +126,52 @@ ul#testlogs li a {
 ul#testlogs li a:hover {
 	color:#D14836;
 }
+
+.status-table {
+    border-collapse: collapse;
+    margin: 25px 0;
+    font-size: 0.9em;
+    font-family: sans-serif;
+    min-width: 400px;
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
+}
+
+.status-table thead tr {
+    background-color: #009879;
+    color: #ffffff;
+    text-align: left;
+}
+
+.status-table th,
+.status-table td {
+    padding: 12px 15px;
+}
+
+.status-table tbody tr {
+    border-bottom: 1px solid #dddddd;
+}
+
+.status-table tbody tr.Failed {
+    font-weight: bold;
+    background-color: rgba(255,0,0,0.2);
+}
+
+.status-table tbody tr.Error {
+    font-weight: bold;
+    background-color: rgba(255,0,0,0.4);
+}
+
+.status-table tbody tr.Pending {
+    font-weight: bold;
+    background-color: rgba(128,128,0,0.2);
+}
+
+.status-table tbody tr.Finished {
+    font-weight: bold;
+    background-color: rgba(0,255,0,0.2);
+}
+
+.status-table tbody tr.Running {
+    font-weight: bold;
+    background-color: rgba(0,255,0,0.4);
+}

templates/status.html

@@ -1,7 +1,11 @@
-<table>
-  <tr><th>Status</th><th>Age</th><th>Board</th><th>Vehicle</th></tr>
+<table class="status-table">
+  <thead>
+  <tr><th>Status</th><th>Age (hr:min)</th><th>Board</th><th>Vehicle</th></tr>
+  </thead>
+  <tbody>
   {% for (status,age,board,vehicle,link) in build_status %}
-  <tr><td><a href="{{link}}" target="_blank">{{status}}</a></td><td>{{age}}</td><td>{{board}}</td><td>{{vehicle}}</td></tr>
+  <tr class="{{status}}"><td><a href="{{link}}" target="_blank">{{status}}</a></td><td>{{age}}</td><td>{{board}}</td><td>{{vehicle}}</td></tr>
   {% endfor %}
+  </tbody>
 </table>