Font-Awesome/scss/_spinning.scss

106 lines
2.4 KiB
SCSS
Raw Normal View History

// Spinning Icons
// --------------------------
2013-05-16 15:19:04 +08:00
.#{$fa-css-prefix}-spin {
-webkit-animation: fa-spin 2s infinite linear;
animation: fa-spin 2s infinite linear;
2013-06-12 22:51:29 +08:00
}
2013-06-15 04:57:00 +08:00
.#{$fa-css-prefix}-spin.#{$fa-css-prefix}-spinner {
-webkit-animation: fa-spin-fa-spinner .8s infinite linear;
animation: fa-spin-fa-spinner .8s infinite linear;
}
2014-08-21 00:52:15 +08:00
@-webkit-keyframes fa-spin {
0% {
2014-08-21 00:52:15 +08:00
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
2014-08-21 00:52:15 +08:00
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
2013-05-16 15:19:04 +08:00
}
@keyframes fa-spin {
2014-04-10 21:55:00 +08:00
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
2014-04-10 21:55:00 +08:00
}
100% {
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
2014-04-10 21:55:00 +08:00
}
2013-05-16 15:19:04 +08:00
}
@-webkit-keyframes fa-spin-fa-spinner {
0%, 12.499% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
12.5%, 24.999% {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
25%, 37.499% {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
37.5%, 49.99% {
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}
50%, 62.499% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
62.5%, 74.999% {
-webkit-transform: rotate(225deg);
transform: rotate(225deg);
}
75%, 87.499% {
-webkit-transform: rotate(270deg);
transform: rotate(270deg);
}
87.5%, 99.999% {
-webkit-transform: rotate(315deg);
transform: rotate(315deg);
}
}
@keyframes fa-spin-fa-spinner {
0%, 12.499% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
12.5%, 24.999% {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
25%, 37.499% {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
37.5%, 49.99% {
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}
50%, 62.499% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
62.5%, 74.999% {
-webkit-transform: rotate(225deg);
transform: rotate(225deg);
}
75%, 87.499% {
-webkit-transform: rotate(270deg);
transform: rotate(270deg);
}
87.5%, 99.999% {
-webkit-transform: rotate(315deg);
transform: rotate(315deg);
}
}