style starred repo tiles

app/styles/app/layouts/dashboard.sass

@@ -20,18 +20,6 @@ $db-text-color: #ACAAAA
 .wrapper-dashboard
   background-color: $wrapper-bg-color
 
-.dashboard-starred
-  margin: 2em 0 3em
-
-.dashboard-active
-  margin-bottom: 3em
-
-.dashboard-inactive
-  margin: 1.5em 0 5em
-  .db
-    h2, h3, p, button, .db-status
-      opacity: .7
-
 .dashboard--empty
   padding: 2em 5em
   background: #E8E6DE
@@ -50,8 +38,6 @@ $db-text-color: #ACAAAA
   margin-bottom: 1em
   background: $white
   @extend %br-4px
-  @media #{$medium-up}
-    height: 57px
 
   h2, h3, p
     margin: 0
@@ -66,9 +52,10 @@ $db-text-color: #ACAAAA
     margin: auto
 
 .db-repo
-  padding-left: 4em
+  padding-left: 3em
   transform: translateY(0.4em)
   overflow: hidden
+  margin-bottom: 1em
   &:after
     content: ""
     display: block
@@ -97,23 +84,17 @@ $db-text-color: #ACAAAA
     left: 0
     right: 0
     margin: auto
-    top: -2em
+    top: -6em
 
   .icon-star
     left: 0
     right: 0
     margin: auto
-    bottom: -2em
+    top: -2em
     opacity: .9
 
 .db-controls
-  // position: relative
+  line-height: 2.2
-  padding-left: 4em
-  transform: translateY(24%)
-  line-height: 3em
-  border-left: 1px solid $db-gray
-  @media #{$medium-up}
-    padding-left: 0
   p,
   button
     display: inline-block
@@ -157,8 +138,6 @@ $db-text-color: #ACAAAA
     height: 2em
     left: 0
     right: 0
-  @media #{$medium-up}
-    height: 100%
 
 .db-burger:hover ~ .dropdown,
 .dropdown:hover
@@ -198,6 +177,43 @@ $db-text-color: #ACAAAA
 
   display: none
 
+.dashboard-starred
+  margin: 2em 0 3em
+  .db
+    padding-bottom: .2em
+  .db-controls
+    padding-left: 3em
+
+.dashboard-active,
+.dashboard-inactive
+  margin-bottom: 3em
+  .db-controls
+    padding-left: 4em
+  @media #{$medium-up}
+    .db
+      height: 57px
+    .db-repo
+      padding-left: 4em
+    .db-controls
+      padding-left: 2em
+      line-height: 3em
+      transform: translateY(26%)
+      border-left: 1px solid $db-gray
+    .db-burger
+      height: 100%
+    .db-status
+      .icon-status
+        top: -2em
+
+      .icon-star
+        bottom: -4em
+
+.dashboard-inactive
+  margin: 1.5em 0 5em
+  .db
+    h2, h3, p, button, .db-status
+      opacity: .7
+
 
 @mixin colorDbelements($color)
   .db-status

app/templates/dashboard/repositories.hbs

@@ -64,13 +64,62 @@
 
 <div class="dashboard">
   <section class="dashboard-starred">
+    <div class="row">
+      <div class="db db--pass column medium-5">
+        <div class="db-status">
+          <span class="icon icon-status icon-started"></span>
+          <span class="icon icon-star"></span>
+        </div>
+        <div class="db-repo column">
+          <h3>travis-pro</h3>
+          <h2>travis-rubies</h2>
+        </div>
+        <div class="db-controls column end">
+          <p class="db-job column small-6"><span class="icon icon-hash"></span>9874 started</p>
+          <p class="db-commit column small-6"><span class="icon icon-github"></span>394348a</p>
+          <p class="db-timeago column small-6"><span class="icon icon-cal"></span>in queue</p>
+          <p class="db-branch column small-6"><span class="icon icon-branch"></span>master</p>
+        </div>
+        <div class="db-burger">
+          <span class="icon icon-burger"></span>
+        </div>
+        <ul class="dropdown">
+          <li><a href="#" title="">Deactivate repository</a></li>
+          <li><a href="#" title="">Trigger a build</a></li>
+        </ul>
+      </div>
+
+      <div class="db db--error column medium-5">
+        <div class="db-lock"><span class="icon icon-lock"></span></div>
+        <div class="db-status">
+          <span class="icon icon-status icon-started"></span>
+          <span class="icon icon-star"></span>
+        </div>
+        <div class="db-repo column">
+          <h3>travis-pro</h3>
+          <h2>travis-rubies</h2>
+        </div>
+        <div class="db-controls column end">
+          <p class="db-job column small-6"><span class="icon icon-hash"></span>9874 started</p>
+          <p class="db-commit column small-6"><span class="icon icon-github"></span>394348a</p>
+          <p class="db-timeago column small-6"><span class="icon icon-cal"></span>in queue</p>
+          <p class="db-branch column small-6"><span class="icon icon-branch"></span>master</p>
+        </div>
+        <div class="db-burger">
+          <span class="icon icon-burger"></span>
+        </div>
+        <ul class="dropdown">
+          <li><a href="#" title="">Deactivate repository</a></li>
+          <li><a href="#" title="">Trigger a build</a></li>
+        </ul>
+      </div>
+    </div>
     {{!-- <div class="row">
       <div class="dashboard--empty">
         <p><span class="icon icon-star"></span>Want to keep an eye on certain projects? Star repositories below to add them in this section.</p>
       </div>
     </div> --}}
 
-    <div></div>
   </section>
   <section class="dashboard-active">