_extras.scss 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. /* EXTRAS
  2. * -------------------------- */
  3. /* Animated rotating icon */
  4. .icon-spin {
  5. display: inline-block;
  6. @include animation(spin 2s infinite linear);
  7. }
  8. @-moz-keyframes spin {
  9. 0% {
  10. -moz-transform: rotate(0deg);
  11. }
  12. 100% {
  13. -moz-transform: rotate(359deg);
  14. }
  15. }
  16. @-webkit-keyframes spin {
  17. 0% {
  18. -webkit-transform: rotate(0deg);
  19. }
  20. 100% {
  21. -webkit-transform: rotate(359deg);
  22. }
  23. }
  24. @-o-keyframes spin {
  25. 0% {
  26. -o-transform: rotate(0deg);
  27. }
  28. 100% {
  29. -o-transform: rotate(359deg);
  30. }
  31. }
  32. @-ms-keyframes spin {
  33. 0% {
  34. -ms-transform: rotate(0deg);
  35. }
  36. 100% {
  37. -ms-transform: rotate(359deg);
  38. }
  39. }
  40. @keyframes spin {
  41. 0% {
  42. transform: rotate(0deg);
  43. }
  44. 100% {
  45. transform: rotate(359deg);
  46. }
  47. }
  48. /* Icon rotations and mirroring */
  49. .icon-rotate-90:before {
  50. @include transform(rotate(90deg));
  51. filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  52. }
  53. .icon-rotate-180:before {
  54. @include transform(rotate(180deg));
  55. filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  56. }
  57. .icon-rotate-270:before {
  58. @include transform(rotate(270deg));
  59. filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  60. }
  61. .icon-flip-horizontal:before {
  62. @include transform(scale(-1, 1));
  63. }
  64. .icon-flip-vertical:before {
  65. @include transform(scale(1, -1));
  66. }