tweak some styles and responsive behaviour

app/components/branch-row.coffee

@@ -34,7 +34,7 @@ BranchRowComponent = Ember.Component.extend
       if @get('auth.signedIn')
         options.headers = { Authorization: "token #{@auth.token()}" }
 
-      $.ajax("#{apiEndpoint}/v3/repo/#{repoId}/builds?branch.name=#{branchName}&limit=5&offset=1", options).then (response) ->
+      $.ajax("#{apiEndpoint}/v3/repo/#{repoId}/builds?branch.name=#{branchName}&limit=5", options).then (response) ->
         array = response.builds.map( (build) ->
           Ember.Object.create(build)
         )
@@ -49,17 +49,27 @@ BranchRowComponent = Ember.Component.extend
     lastBuilds
   ).property()
 
+  triggeredBuild: (->
+    triggeredBuild = Ember.ArrayProxy.create(
+      isTriggered: false,
+      status: null
+    )
+  ).property("triggeredBuild.status['@type']")
+
   triggerBuild: (->
     apiEndpoint = config.apiEndpoint
     repoId = @get('build.repository.id')
+    branchName = @get('build.name')
     options = {
       type: 'POST'
     }
     if @get('auth.signedIn')
       options.headers = { Authorization: "token #{@auth.token()}" }
     $.ajax("#{apiEndpoint}/v3/repo/#{repoId}/requests", options).then (response) ->
-      console.log(response);
+      @triggerBuild.set('isTriggered', true)
-      console.log('Build triggered');
+      @triggerBuild.set('status', response)
+      console.log(response)
+      console.log('Build triggered')
   )
 
   actions:

app/controllers/branches.coffee

@@ -14,7 +14,6 @@ BranchesController = Ember.Controller.extend
   activeBranches: (->
     repos = @get('model')
     repos = repos.filter (item, index) ->
-      console.log(item)
       item if item.exists_on_github == true && item.repository.default_branch.name != undefined
     .sortBy('last_build.finished_at')
     .reverse()

app/styles/app/components/build-tile.sass

@@ -28,7 +28,7 @@
     position: relative
     display: inline-block
     height: 100%
-    width: 18.8%
+    width: 18.7%
     background-color: #F7F7F7
     .status-icon
       position: absolute

app/styles/app/layouts/branches.sass

@@ -64,7 +64,7 @@
     & > div:nth-of-type(4)
       width: 5%
     & > div:nth-of-type(5)
-      width: 26%
+      width: 27%
 
   @include statusColors($green-dark, 'passed')
   @include statusColors($red-dark, 'failed')
@@ -76,7 +76,6 @@
   @include statusColors(#bfb502, 'received', #e5db29)
   @include statusColors(#bfb502, 'created', #e5db29)
 
-
 %row-element
   vertical-align: middle
   @media #{$medium-up}
@@ -99,9 +98,22 @@
     display: inline-block
   .branch-nav
     display: none
+    text-align: center
     @media #{$medium-up}
       display: block
 
+.branch-last-build
+  @media #{$medium-up}
+    padding-left: 1em
+    &:before
+      content: "";
+      display: block;
+      width: 1px;
+      background-color: #EFF0EC;
+      position: absolute;
+      height: 3.7em;
+      margin-left: -1em;
+
 // @todo refactor into dropup module
 %dropup
   @media #{$medium-up}
@@ -120,10 +132,7 @@
       height: 10px
       left: 46%
       transform: rotate(45deg)
-    &:before
-      bottom: -6px
     &:after
-      bottom: -4px
       background-color: $white
     .dropup-trigger:hover ~ &,
     .dropup-trigger:hover &,
@@ -132,6 +141,10 @@
 
 .dropup--blue
   @extend %dropup
+  &:before
+    bottom: -5px
+  &:after
+    bottom: -4px
   ul
     margin: 0
     padding: 0
@@ -152,13 +165,15 @@
     fill: $white
     
   @media #{$medium-up}
-    padding: .4em
+    padding: .5em
-    transform: translate(-2.7em, -8.2em)
+    transform: translate(-37%, -180%)
     border: 1px solid $teal-dark
     li
       display: block
       margin: 0
       background-color: $white
+      &:first-of-type
+        border-bottom: 1px solid #E4E6E6
     .icon-trigger path,
     .icon-eye path
       fill: #A7AEAE
@@ -174,6 +189,10 @@
         .icon-eye path
           fill: $white
 
+  @media #{$large-up}
+    padding: .5em
+    transform: translate(-30%, -180%)
+
     &:before
       background-color: $teal-dark
 
@@ -182,6 +201,8 @@
   display: none
   &:after
     bottom: -5px
+  &:before
+    bottom: -6px
   @media #{$medium-up}
     top: -3em
     padding: .2em .3em
@@ -210,7 +231,7 @@
       vertical-align: middle
       width: 5px
       height: 5px
-      border: solid 1px #e5db29
+      border: solid 1px #bfb502
       border-radius: 50%
       transform-origin: center center
 

app/templates/branches.hbs

@@ -27,11 +27,4 @@
       </ul>
     </section>
   {{/if}}
-
-
-  {{!-- {{#if content.isLoaded}} --}}
-
-  {{!-- {{else}}
-    {{loading-indicator}}
-  {{/if}} --}}
 </div>

app/templates/components/branch-row.hbs

@@ -31,7 +31,7 @@
     </div>
   </div>
 </div>
-<div class="two-line">
+<div class="two-line branch-last-build">
   <div class="branch-request">
     <div class="row-item">
       {{#if build.last_build}}
@@ -136,7 +136,9 @@
     </div>
     <div class="dropup--blue">
       <ul>
-        <li><a {{action 'tiggerBuild'}}>
+        <li>
+          {{#unless triggeredBuild.isTriggered}}
+            <a {{action 'tiggerBuild'}}>
               <span class="icon-trigger">
                 <svg x="0px" y="0px" viewBox="0 0 20 20" xml:space="preserve">
                   <g id="Trigger">
@@ -147,7 +149,11 @@
                   </g>
                 </svg>
               </span>
-          Trigger a build</a>
+              Trigger a build
+            </a>
+          {{else}}
+            processing request
+          {{/unless}}
         </li>
         <li><a {{action 'viewAllBuilds'}}>
           <span class="icon-eye">