add rotate animation

Author: mattisonchao

src/app/page.css

@@ -0,0 +1,17 @@
+.rotate-image {
+    animation: spin 25s linear infinite;
+    transform-origin: center center;
+}
+
+@keyframes spin {
+    0% {
+        transform: rotate(0deg);
+    }
+    100% {
+        transform: rotate(360deg);
+    }
+}
+
+.rotate-image:hover {
+    animation-play-state: paused;
+}

src/app/page.jsx

@@ -1,8 +1,9 @@
+import "./page.css"
 export default function IndexPage() {
     return (
         <div className="home-content" style={{height: '76vh', marginTop: '8rem', display: "flex", flexDirection: "column", justifyContent: "start", alignItems: "center"}}>
             <div align="center">
-                <img src="/oxia-logo.svg" alt="oxia logo" width="250"/>
+                <img className={"rotate-image"} src="/oxia-logo.svg" alt="oxia logo" width="250"/>
             </div>
 
             <h1 className="headline" style={{