properly namespacing spin animation #3885

css/font-awesome.css

@@ -78,12 +78,12 @@
   margin-left: .3em;
 }
 .fa-spin {
-  -webkit-animation: spin 2s infinite linear;
-  -moz-animation: spin 2s infinite linear;
-  -o-animation: spin 2s infinite linear;
-  animation: spin 2s infinite linear;
+  -webkit-animation: fa-spin 2s infinite linear;
+  -moz-animation: fa-spin 2s infinite linear;
+  -o-animation: fa-spin 2s infinite linear;
+  animation: fa-spin 2s infinite linear;
 }
-@-moz-keyframes spin {
+@-moz-keyframes fa-spin {
   0% {
     -moz-transform: rotate(0deg);
   }
@@ -91,7 +91,7 @@
     -moz-transform: rotate(359deg);
   }
 }
-@-webkit-keyframes spin {
+@-webkit-keyframes fa-spin {
   0% {
     -webkit-transform: rotate(0deg);
   }
@@ -99,7 +99,7 @@
     -webkit-transform: rotate(359deg);
   }
 }
-@-o-keyframes spin {
+@-o-keyframes fa-spin {
   0% {
     -o-transform: rotate(0deg);
   }
@@ -107,7 +107,7 @@
     -o-transform: rotate(359deg);
   }
 }
-@keyframes spin {
+@keyframes fa-spin {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);

less/spinning.less

@@ -2,25 +2,25 @@
 // --------------------------
 
 .@{fa-css-prefix}-spin {
-  -webkit-animation: spin 2s infinite linear;
-  -moz-animation: spin 2s infinite linear;
-  -o-animation: spin 2s infinite linear;
-  animation: spin 2s infinite linear;
+  -webkit-animation: fa-spin 2s infinite linear;
+  -moz-animation: fa-spin 2s infinite linear;
+  -o-animation: fa-spin 2s infinite linear;
+  animation: fa-spin 2s infinite linear;
 }
 
-@-moz-keyframes spin {
+@-moz-keyframes fa-spin {
   0% { -moz-transform: rotate(0deg); }
   100% { -moz-transform: rotate(359deg); }
 }
-@-webkit-keyframes spin {
+@-webkit-keyframes fa-spin {
   0% { -webkit-transform: rotate(0deg); }
   100% { -webkit-transform: rotate(359deg); }
 }
-@-o-keyframes spin {
+@-o-keyframes fa-spin {
   0% { -o-transform: rotate(0deg); }
   100% { -o-transform: rotate(359deg); }
 }
-@keyframes spin {
+@keyframes fa-spin {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);

scss/_spinning.scss

@@ -2,25 +2,25 @@
 // --------------------------
 
 .#{$fa-css-prefix}-spin {
-  -webkit-animation: spin 2s infinite linear;
-  -moz-animation: spin 2s infinite linear;
-  -o-animation: spin 2s infinite linear;
-  animation: spin 2s infinite linear;
+  -webkit-animation: fa-spin 2s infinite linear;
+  -moz-animation: fa-spin 2s infinite linear;
+  -o-animation: fa-spin 2s infinite linear;
+  animation: fa-spin 2s infinite linear;
 }
 
-@-moz-keyframes spin {
+@-moz-keyframes fa-spin {
   0% { -moz-transform: rotate(0deg); }
   100% { -moz-transform: rotate(359deg); }
 }
-@-webkit-keyframes spin {
+@-webkit-keyframes fa-spin {
   0% { -webkit-transform: rotate(0deg); }
   100% { -webkit-transform: rotate(359deg); }
 }
-@-o-keyframes spin {
+@-o-keyframes fa-spin {
   0% { -o-transform: rotate(0deg); }
   100% { -o-transform: rotate(359deg); }
 }
-@keyframes spin {
+@keyframes fa-spin {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);

src/assets/font-awesome/less/spinning.less

@@ -5,25 +5,25 @@
 // --------------------------
 
 .@{fa-css-prefix}-spin {
-  -webkit-animation: spin 2s infinite linear;
-  -moz-animation: spin 2s infinite linear;
-  -o-animation: spin 2s infinite linear;
-  animation: spin 2s infinite linear;
+  -webkit-animation: fa-spin 2s infinite linear;
+  -moz-animation: fa-spin 2s infinite linear;
+  -o-animation: fa-spin 2s infinite linear;
+  animation: fa-spin 2s infinite linear;
 }
 
-@-moz-keyframes spin {
+@-moz-keyframes fa-spin {
   0% { -moz-transform: rotate(0deg); }
   100% { -moz-transform: rotate(359deg); }
 }
-@-webkit-keyframes spin {
+@-webkit-keyframes fa-spin {
   0% { -webkit-transform: rotate(0deg); }
   100% { -webkit-transform: rotate(359deg); }
 }
-@-o-keyframes spin {
+@-o-keyframes fa-spin {
   0% { -o-transform: rotate(0deg); }
   100% { -o-transform: rotate(359deg); }
 }
-@keyframes spin {
+@keyframes fa-spin {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);

src/assets/font-awesome/scss/_spinning.scss

@@ -5,25 +5,25 @@
 // --------------------------
 
 .#{$fa-css-prefix}-spin {
-  -webkit-animation: spin 2s infinite linear;
-  -moz-animation: spin 2s infinite linear;
-  -o-animation: spin 2s infinite linear;
-  animation: spin 2s infinite linear;
+  -webkit-animation: fa-spin 2s infinite linear;
+  -moz-animation: fa-spin 2s infinite linear;
+  -o-animation: fa-spin 2s infinite linear;
+  animation: fa-spin 2s infinite linear;
 }
 
-@-moz-keyframes spin {
+@-moz-keyframes fa-spin {
   0% { -moz-transform: rotate(0deg); }
   100% { -moz-transform: rotate(359deg); }
 }
-@-webkit-keyframes spin {
+@-webkit-keyframes fa-spin {
   0% { -webkit-transform: rotate(0deg); }
   100% { -webkit-transform: rotate(359deg); }
 }
-@-o-keyframes spin {
+@-o-keyframes fa-spin {
   0% { -o-transform: rotate(0deg); }
   100% { -o-transform: rotate(359deg); }
 }
-@keyframes spin {
+@keyframes fa-spin {
   0% {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);