From 6d86b587e9f5e79ac3a5740db65286d9fbd3f3b0 Mon Sep 17 00:00:00 2001
From: Lisa P <mail@lislis.de>
Date: Wed, 16 Sep 2015 18:11:46 +0200
Subject: [PATCH] failing to center dropups

---
 app/styles/app/components/build-tile.sass | 10 +++---
 app/styles/app/layouts/branches.sass      | 37 +++++++++++++----------
 app/templates/components/branch-row.hbs   |  6 ++--
 3 files changed, 29 insertions(+), 24 deletions(-)

diff --git a/app/styles/app/components/build-tile.sass b/app/styles/app/components/build-tile.sass
index e286641c..5c3315a8 100644
--- a/app/styles/app/components/build-tile.sass
+++ b/app/styles/app/components/build-tile.sass
@@ -65,8 +65,8 @@
   @include buildTileColors(#D94341, #FFF7F5, 'failed')
   @include buildTileColors(#D94341, #FFF7F5, 'errored')
   @include buildTileColors(#A1A0A0, #F5F5F5, 'canceled')
-  @include buildTileColors(#bfb502, #fdfcee, 'started', #e5da3f)
-  @include buildTileColors(#bfb502, #fdfcee, 'queued', #e5da3f)
-  @include buildTileColors(#bfb502, #fdfcee, 'booting', #e5da3f)
-  @include buildTileColors(#bfb502, #fdfcee, 'received', #e5da3f)
-  @include buildTileColors(#bfb502, #fdfcee, 'created', #e5da3f)
+  @include buildTileColors(#bfb502, #fdfcee, 'started', #e2c913)
+  @include buildTileColors(#bfb502, #fdfcee, 'queued', #e2c913)
+  @include buildTileColors(#bfb502, #fdfcee, 'booting', #e2c913)
+  @include buildTileColors(#bfb502, #fdfcee, 'received', #e2c913)
+  @include buildTileColors(#bfb502, #fdfcee, 'created', #e2c913)
diff --git a/app/styles/app/layouts/branches.sass b/app/styles/app/layouts/branches.sass
index 07b5a808..8b2a3124 100644
--- a/app/styles/app/layouts/branches.sass
+++ b/app/styles/app/layouts/branches.sass
@@ -128,9 +128,11 @@
       content: ""
       position: absolute
       display: block
-      width: 10px
-      height: 10px
-      left: 46%
+      width: 7px
+      height: 7px
+      left: 0
+      right: 0
+      margin: 0 auto
       transform: rotate(45deg)
     &:after
       background-color: $white
@@ -142,6 +144,7 @@
 .dropup--blue
   @extend %dropup
   &:before
+    background-color: $teal-dark
     bottom: -5px
   &:after
     bottom: -4px
@@ -165,46 +168,48 @@
     fill: $white
     
   @media #{$medium-up}
-    padding: .5em
-    transform: translate(-37%, -180%)
+    padding: .3em
+    transform: translateY(-160%)
+    right: 24.5%
     border: 1px solid $teal-dark
     li
       display: block
       margin: 0
       background-color: $white
-      &:first-of-type
-        border-bottom: 1px solid #E4E6E6
+      border-radius: 0
+      cursor: pointer
     .icon-trigger path,
     .icon-eye path
       fill: #A7AEAE
     a
       display: block
-      padding: 0.2em 0.5em
+      padding: 0.3em .5em 0.4em
       text-decoration: none
       color: $grey-dark
       &:hover
-        background-color: $teal-dark
         color: $white
+        background-color: $teal-dark
         .icon-trigger path,
         .icon-eye path
           fill: $white
 
-  @media #{$large-up}
-    padding: .5em
-    transform: translate(-30%, -180%)
+  .dropup-item
+    display: inline-block
+    vertical-align: middle
 
-    &:before
-      background-color: $teal-dark
+  @media #{$large-up}
+    right: 24.5%
 
 .dropup--status
   @extend %dropup
   display: none
   &:after
-    bottom: -5px
+    bottom: -3px
   &:before
-    bottom: -6px
+    bottom: -4px
   @media #{$medium-up}
     top: -3em
+    width: 100%
     padding: .2em .3em
     white-space: nowrap
     font-size: 14px;
diff --git a/app/templates/components/branch-row.hbs b/app/templates/components/branch-row.hbs
index 4fbc6ae4..37176b83 100644
--- a/app/templates/components/branch-row.hbs
+++ b/app/templates/components/branch-row.hbs
@@ -138,7 +138,7 @@
       <ul>
         <li>
           {{#if hasTriggered}}
-            <span>build was triggered</span>
+            <span class="dropup-item">build was triggered</span>
           {{else}}
             {{#if isTriggering}}
               {{loading-indicator}}
@@ -154,7 +154,7 @@
                     </g>
                   </svg>
                 </span>
-                Trigger a build
+                <span class="dropup-item">Trigger a build</span>
               </a>
             {{/if}}
           {{/if}}
@@ -171,7 +171,7 @@
               </g>
             </svg>
           </span>
-          View all builds</a>
+          <span class="dropup-item">View all builds</span></a>
         </li>
       </ul>
     </div>