Integrate AOS library for animations and update styles

Switch from external dependency to baked-in delivery.

Author: leonard84

spock-website/index.html

@@ -22,9 +22,6 @@
     <meta property="twitter:description" content="Spock is a testing, specification, and mocking framework for JVM developers that emphasizes readability and clarity. By blending BDD concepts and Groovy's concise syntax, Spock helps teams write tests that are easy to understand and enjoyable to maintain.">
     <meta property="twitter:image" content="/spock-main-logo.svg">
 
-    <link href="https://unpkg.com/aos@2.3.4/dist/aos.css" rel="stylesheet"
-          integrity="sha384-/rJKQnzOkEo+daG0jMjU1IwwY9unxt1NBw3Ef2fmOJ3PW/TfAg2KXVoWwMZQZtw9"
-          crossorigin="anonymous">
     <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin="anonymous">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" crossorigin="anonymous">
@@ -285,20 +282,6 @@ <h3 class="text-3xl md:text-4xl font-bold text-center text-gray-100" data-aos="f
     </div>
 </footer>
 
-
-<script src="https://unpkg.com/aos@2.3.4/dist/aos.js"
-        integrity="sha384-n1AULnKdMJlK1oQCLNDL9qZsDgXtH6jRYFCpBtWFc+a9Yve0KSoMn575rk755NJZ"
-        crossorigin="anonymous"></script>
-<script>
-    // Initialize AOS library
-    AOS.init({
-        duration: 800, // Animation duration
-        once: true, // Whether animation should happen only once - while scrolling down
-        offset: 50, // Offset (in px) from the original trigger point
-        disable: new URLSearchParams(window.location.search).get('disableaos') !== null,
-    });
-</script>
-
 <script type="module" src="src/main.ts"></script>
 </body>
 </html>

spock-website/package-lock.json

@@ -13,6 +13,7 @@
   },
   "devDependencies": {
     "@playwright/test": "^1.57.0",
+    "@types/aos": "^3.0.7",
     "linkinator": "^7.5.1",
     "typescript": "~5.9.3",
     "vite": "^7.2.7"
@@ -22,6 +23,7 @@
     "@fortawesome/free-brands-svg-icons": "^7.1.0",
     "@fortawesome/free-solid-svg-icons": "^7.1.0",
     "@tailwindcss/vite": "^4.1.17",
+    "aos": "^2.3.4",
     "tailwindcss": "^4.1.17"
   }
 }

spock-website/package.json

@@ -1,2 +1,10 @@
 import './style.css'
 import './icons'
+import AOS from 'aos'
+
+AOS.init({
+    duration: 800, // Animation duration
+    once: true, // Whether animation should happen only once - while scrolling down
+    offset: 50, // Offset (in px) from the original trigger point
+    disable: new URLSearchParams(window.location.search).get('disableaos') !== null,
+});

spock-website/src/main.ts

@@ -1,4 +1,5 @@
 @import "tailwindcss";
+@import "aos/dist/aos.css";
 
 /* Custom styles - Dark theme is now default */
 body {