Backport pull request #6324 from jellyfin-web/release-10.10.z

Fix spinner direction (should be clockwise) in @keyframes spin

Original-merge: 74a209ed63d7796dd31e570bcfe0c67522b2f145

Merged-by: thornbill <thornbill@users.noreply.github.com>

Backported-by: thornbill <thornbill@users.noreply.github.com>

src/styles/videoosd.scss

@@ -172,14 +172,8 @@
     margin-left: auto;
 }
 
-@keyframes spin {
-    100% {
-        transform: rotate(360deg);
-    }
-}
-
 .osdMediaStatus .animate {
-    animation: spin 4s linear infinite;
+    animation: spin-clockwise 4s linear infinite;
 }
 
 @media all and (max-width: 30em) {
@@ -236,7 +230,7 @@
 
 .primary-icon.spin {
     font-size: 76px !important;
-    animation: spin 2s linear infinite;
+    animation: spin-counterclockwise 2s linear infinite;
 }
 
 .secondary-icon {
@@ -326,8 +320,14 @@
     }
 }
 
-@keyframes spin {
+@keyframes spin-counterclockwise {
     100% {
         transform: rotate(-360deg);
     }
 }
+
+@keyframes spin-clockwise {
+    100% {
+        transform: rotate(360deg);
+    }
+}