travis-web/app/styles/app/components/sync-button.sass
2016-02-11 14:43:00 +01:00

62 lines
1.1 KiB
Sass

.sync-button
padding: 0.8em 0
display: flex
flex-direction: row-reverse
.button
padding: 5px 10px
margin-left: .5em
height: 25px
position: relative
z-index: 1
background: #a6adad
color: #ffffff
font-size: 14px
font-weight: $font-weight-normal
border: none
border-radius: 2px
line-height: 1
&:hover
background: #8d9b9a
cursor: pointer
&.is-syncing
background: #c6b93d
color: white
.icon
width: 1.1em
height: 1.2em
vertical-align: middle
svg path
fill: white
.icon
margin-right: .5em
.loading-indicator--white
margin-right: .5em
vertical-align: top
.profile-main
.sync-button
button
max-width: none
font-size: $font-size-sm
.sync-last
font-size: $font-size-sm
color: #adaaab
margin-left: .8rem
.sync-last
display: inline-block
margin: 0
font-size: 14px
color: #848384
text-align: right
pointer-events: none
transform: translateX(50%)
opacity: 0
transition: transform 200ms ease, opacity 100ms ease
.button:hover ~ &
transform: translateX(0)
opacity: 1