failing to center dropups

This commit is contained in:
Lisa P 2015-09-16 18:11:46 +02:00
parent 0e210d791a
commit 6d86b587e9
3 changed files with 29 additions and 24 deletions

View File

@ -65,8 +65,8 @@
@include buildTileColors(#D94341, #FFF7F5, 'failed') @include buildTileColors(#D94341, #FFF7F5, 'failed')
@include buildTileColors(#D94341, #FFF7F5, 'errored') @include buildTileColors(#D94341, #FFF7F5, 'errored')
@include buildTileColors(#A1A0A0, #F5F5F5, 'canceled') @include buildTileColors(#A1A0A0, #F5F5F5, 'canceled')
@include buildTileColors(#bfb502, #fdfcee, 'started', #e5da3f) @include buildTileColors(#bfb502, #fdfcee, 'started', #e2c913)
@include buildTileColors(#bfb502, #fdfcee, 'queued', #e5da3f) @include buildTileColors(#bfb502, #fdfcee, 'queued', #e2c913)
@include buildTileColors(#bfb502, #fdfcee, 'booting', #e5da3f) @include buildTileColors(#bfb502, #fdfcee, 'booting', #e2c913)
@include buildTileColors(#bfb502, #fdfcee, 'received', #e5da3f) @include buildTileColors(#bfb502, #fdfcee, 'received', #e2c913)
@include buildTileColors(#bfb502, #fdfcee, 'created', #e5da3f) @include buildTileColors(#bfb502, #fdfcee, 'created', #e2c913)

View File

@ -128,9 +128,11 @@
content: "" content: ""
position: absolute position: absolute
display: block display: block
width: 10px width: 7px
height: 10px height: 7px
left: 46% left: 0
right: 0
margin: 0 auto
transform: rotate(45deg) transform: rotate(45deg)
&:after &:after
background-color: $white background-color: $white
@ -142,6 +144,7 @@
.dropup--blue .dropup--blue
@extend %dropup @extend %dropup
&:before &:before
background-color: $teal-dark
bottom: -5px bottom: -5px
&:after &:after
bottom: -4px bottom: -4px
@ -165,46 +168,48 @@
fill: $white fill: $white
@media #{$medium-up} @media #{$medium-up}
padding: .5em padding: .3em
transform: translate(-37%, -180%) transform: translateY(-160%)
right: 24.5%
border: 1px solid $teal-dark border: 1px solid $teal-dark
li li
display: block display: block
margin: 0 margin: 0
background-color: $white background-color: $white
&:first-of-type border-radius: 0
border-bottom: 1px solid #E4E6E6 cursor: pointer
.icon-trigger path, .icon-trigger path,
.icon-eye path .icon-eye path
fill: #A7AEAE fill: #A7AEAE
a a
display: block display: block
padding: 0.2em 0.5em padding: 0.3em .5em 0.4em
text-decoration: none text-decoration: none
color: $grey-dark color: $grey-dark
&:hover &:hover
background-color: $teal-dark
color: $white color: $white
background-color: $teal-dark
.icon-trigger path, .icon-trigger path,
.icon-eye path .icon-eye path
fill: $white fill: $white
@media #{$large-up} .dropup-item
padding: .5em display: inline-block
transform: translate(-30%, -180%) vertical-align: middle
&:before @media #{$large-up}
background-color: $teal-dark right: 24.5%
.dropup--status .dropup--status
@extend %dropup @extend %dropup
display: none display: none
&:after &:after
bottom: -5px bottom: -3px
&:before &:before
bottom: -6px bottom: -4px
@media #{$medium-up} @media #{$medium-up}
top: -3em top: -3em
width: 100%
padding: .2em .3em padding: .2em .3em
white-space: nowrap white-space: nowrap
font-size: 14px; font-size: 14px;

View File

@ -138,7 +138,7 @@
<ul> <ul>
<li> <li>
{{#if hasTriggered}} {{#if hasTriggered}}
<span>build was triggered</span> <span class="dropup-item">build was triggered</span>
{{else}} {{else}}
{{#if isTriggering}} {{#if isTriggering}}
{{loading-indicator}} {{loading-indicator}}
@ -154,7 +154,7 @@
</g> </g>
</svg> </svg>
</span> </span>
Trigger a build <span class="dropup-item">Trigger a build</span>
</a> </a>
{{/if}} {{/if}}
{{/if}} {{/if}}
@ -171,7 +171,7 @@
</g> </g>
</svg> </svg>
</span> </span>
View all builds</a> <span class="dropup-item">View all builds</span></a>
</li> </li>
</ul> </ul>
</div> </div>