color job number links

app/styles/app.scss

@@ -23,7 +23,7 @@
 @import "app/main/log";
 // @import "app/main/repository";
 @import "app/main/sponsors";
-@import "app/main/summary";
+// @import "app/main/summary";
 // @import "app/main/tools";
 @import "app/main";
 @import "app/maximize";
@@ -37,8 +37,8 @@
 @import "app/right/sponsors";
 @import "app/right";
 @import "app/settings";
-@import "app/stats";
-@import "app/status";
+// @import "app/stats";
+// @import "app/status";
 @import "app/tabs";
 @import "app/tipsy";
 

app/styles/app/modules/tiles.sass

@@ -6,6 +6,10 @@
   .build-status a
     color: $color
 
+@mixin colorJobs($color)
+  .build-status a
+    color: $color
+
 .tile
   @extend border-radius-4px
   overflow: hidden
@@ -21,19 +25,28 @@
     width: 1.2em
     height: 0.9em
 
-  &.started,
-  &.created
-    @include colorTiles($start-color)
-  &.failed
-    @include colorTiles($fail-color)
-  &.errored
-    @include colorTiles($error-color)
-  &.canceled
-    @include colorTiles($cancel-color)
-  &.passed
-    @include colorTiles($pass-color)
-  &.inactive
-    @include colorTiles($cancel-color)
+  &:not(.tile--jobs)
+    &.started,
+    &.created
+      @include colorTiles($start-color)
+    &.failed
+      @include colorTiles($fail-color)
+    &.errored
+      @include colorTiles($error-color)
+    &.canceled
+      @include colorTiles($cancel-color)
+    &.passed
+      @include colorTiles($pass-color)
+    &.inactive
+      @include colorTiles($cancel-color)
+
+  &.tile--jobs
+    &.failed
+      @include colorJobs($fail-color)
+    &.errored
+      @include colorJobs($cancel-color)
+    &.passed
+      @include colorJobs($pass-color)
 
   @media #{$medium-up}
     height: 145px

app/templates/jobs.hbs

@@ -13,7 +13,7 @@
 
     {{#each job in view.jobs}}
       {{#view 'jobs-item' context=job}}
-        <div class="tile tile--small tile--jobs row">
+        <div {{bind-attr class=":tile :tile--small :tile--jobs :row job.state" }}>
           <div class="tile-status tile-status--job">
             <span {{bind-attr class=":icon :icon--job job.state"}}></span>
           </div>
@@ -24,7 +24,7 @@
           </div>
 
           <div class="tile-additional medium-8 columns end">
-            <p class="columns small-6 medium-2">
+            <p class="columns small-6 medium-2 build-status">
               <span class="icon icon--hash"></span>
               {{#if job.id}}
                 {{#if job.repo.slug}}