Fork-Awesome/src/assets/font-awesome/scss/_extras.scss

48 lines
1.5 KiB
SCSS
Raw Normal View History

2013-10-16 19:46:28 +02:00
---
---
2013-05-16 09:19:04 +02:00
/* EXTRAS
* -------------------------- */
/* Stacked and layered icon */
2013-10-16 19:46:28 +02:00
@include {{ site.fontawesome.css_prefix }}-stack();
2013-05-16 09:19:04 +02:00
/* Animated rotating icon */
2013-10-16 19:46:28 +02:00
.{{ site.fontawesome.css_prefix }}-spin {
-webkit-animation: spin 2s infinite linear;
2013-06-12 16:51:29 +02:00
-moz-animation: spin 2s infinite linear;
-o-animation: spin 2s infinite linear;
animation: spin 2s infinite linear;
}
2013-06-14 22:57:00 +02:00
2013-05-16 09:19:04 +02:00
@-moz-keyframes spin {
2013-06-12 16:51:29 +02:00
0% { -moz-transform: rotate(0deg); }
100% { -moz-transform: rotate(359deg); }
2013-05-16 09:19:04 +02:00
}
@-webkit-keyframes spin {
2013-06-12 16:51:29 +02:00
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(359deg); }
2013-05-16 09:19:04 +02:00
}
@-o-keyframes spin {
2013-06-12 16:51:29 +02:00
0% { -o-transform: rotate(0deg); }
100% { -o-transform: rotate(359deg); }
2013-05-16 09:19:04 +02:00
}
@-ms-keyframes spin {
2013-06-12 16:51:29 +02:00
0% { -ms-transform: rotate(0deg); }
100% { -ms-transform: rotate(359deg); }
2013-05-16 09:19:04 +02:00
}
@keyframes spin {
2013-06-12 16:51:29 +02:00
0% { transform: rotate(0deg); }
100% { transform: rotate(359deg); }
2013-05-16 09:19:04 +02:00
}
2013-10-16 19:46:28 +02:00
// Icon rotations & flipping
// -------------------------
2013-05-16 09:19:04 +02:00
2013-10-16 19:46:28 +02:00
.{{ site.fontawesome.css_prefix }}-rotate-90 { @include {{ site.fontawesome.css_prefix }}-rotate(90deg, 1); }
.{{ site.fontawesome.css_prefix }}-rotate-180 { @include {{ site.fontawesome.css_prefix }}-rotate(180deg, 2); }
.{{ site.fontawesome.css_prefix }}-rotate-270 { @include {{ site.fontawesome.css_prefix }}-rotate(270deg, 3); }
2013-06-12 16:51:29 +02:00
2013-10-16 19:46:28 +02:00
.{{ site.fontawesome.css_prefix }}-flip-horizontal { @include {{ site.fontawesome.css_prefix }}-flip(-1, 1); }
.{{ site.fontawesome.css_prefix }}-flip-vertical { @include {{ site.fontawesome.css_prefix }}-flip(1, -1); }