You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
// Chase spinner from https://tobiasahlin.com/spinkit/. MIT license .sk-center-wrapper width: 100% display: flex justify-content: space-around
.sk-chase position: relative animation: sk-chase 2.5s infinite linear both
&.green > .sk-chase-dot:before background-color: #00C853
> .sk-chase-dot width: 100% height: 100% position: absolute left: 0 top: 0 animation: sk-chase-dot 2.0s infinite ease-in-out both
&:before content: '' display: block width: 25% height: 25% border-radius: 100% animation: sk-chase-dot-before 2.0s infinite ease-in-out both background-color: #FFF
&:nth-child(1) animation-delay: -1.1s &:nth-child(2) animation-delay: -1.0s &:nth-child(3) animation-delay: -0.9s &:nth-child(4) animation-delay: -0.8s &:nth-child(5) animation-delay: -0.7s &:nth-child(6) animation-delay: -0.6s &:nth-child(1):before animation-delay: -1.1s &:nth-child(2):before animation-delay: -1.0s &:nth-child(3):before animation-delay: -0.9s &:nth-child(4):before animation-delay: -0.8s &:nth-child(5):before animation-delay: -0.7s &:nth-child(6):before animation-delay: -0.6s
@keyframes sk-chase 100% transform: rotate(360deg)
@keyframes sk-chase-dot 80%, 100% transform: rotate(360deg)
@keyframes sk-chase-dot-before 50% transform: scale(0.4) 100%, 0% transform: scale(1.0)
|