59 lines
1.1 KiB
Sass
59 lines
1.1 KiB
Sass
|
|
.sync-button
|
|
button
|
|
@extend %border-radius-4px
|
|
padding: 0 10px
|
|
max-width: 98px
|
|
min-height: 25px
|
|
margin-left: .5em
|
|
background: #a6adad
|
|
color: #ffffff
|
|
border: none
|
|
&:hover
|
|
background: #8d9b9a
|
|
cursor: pointer
|
|
|
|
&.is-syncing
|
|
background: #c6b93d
|
|
color: $white
|
|
padding: 0 10px
|
|
max-width: 160px
|
|
.icon
|
|
position: relative
|
|
top: -0.1em
|
|
width: 1em
|
|
height: 1.2em
|
|
vertical-align: middle
|
|
.icon,
|
|
.sync-spinner
|
|
margin-right: .5em
|
|
|
|
.sync-last
|
|
display: inline-block
|
|
font-size: 12px
|
|
color: #848384
|
|
text-align: right
|
|
|
|
.sync-spinner
|
|
vertical-align: middle
|
|
i
|
|
position: relative
|
|
display: inline-block
|
|
width: 8px
|
|
height: 8px
|
|
background-color: $white
|
|
border-radius: 50%
|
|
line-height: 0
|
|
transform-origin: center center
|
|
animation: bouncedelay 1.3s infinite linear
|
|
&:nth-child(2)
|
|
animation-delay: 0.3s
|
|
&:nth-child(3)
|
|
animation-delay: 0.6s
|
|
|
|
@keyframes bouncedelay
|
|
0%, 80%, 100%
|
|
transform: scale(0)
|
|
40%
|
|
transform: scale(1.0)
|