OPDS: fix performance issue caused by SVG spinner

Fixes #1287
johnfactotum · Mar 31, 2024 · 7748b6d · 7748b6d
1 parent 0fbdd04
commit 7748b6d
Showing 1 changed file with 9 additions and 1 deletion.
diff --git a/src/opds/main.html b/src/opds/main.html
@@ -161,6 +161,14 @@
     from { opacity: 0; }
     to { opacity: 1; }
 }
+#loading:not([hidden]) svg path {
+    animation: .6s linear infinite rotate;
+    transform-origin: center;
+}
+@keyframes rotate {
+    from { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}
 
 /* feed
 ------------------------------------------------------------------------------*/
@@ -648,7 +656,7 @@ <h1><a></a></h1>
     <foliate-scrolled id="loading">
         <foliate-center>
             <svg width="48" height="48" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2">
-                <path d="M24 8A 16 16 0 0 0 24 40"><animateTransform attributeName="transform" type="rotate" from="0 24 24" to="360 24 24" dur="600ms" repeatCount="indefinite"/></path>
+                <path d="M24 8A 16 16 0 0 0 24 40"></path>
             </svg>
             <h1></h1>
         </foliate-center>