From a5c5d919ffdbca169857d0bf83cff3ba07de6fdb Mon Sep 17 00:00:00 2001
From: Shing Hung <yhung022@ucr.edu>
Date: Tue, 25 Feb 2025 18:17:41 -0800
Subject: [PATCH] add links section to robocup page

---
 src/components/main_page/Landing.astro |  8 ++++----
 src/data/roboLinks.json                | 17 +++++++++++++++++
 src/pages/projects/robocup.astro       | 22 ++++++++++++++--------
 3 files changed, 35 insertions(+), 12 deletions(-)
 create mode 100644 src/data/roboLinks.json

diff --git a/src/components/main_page/Landing.astro b/src/components/main_page/Landing.astro
index 3f2a599..9121b65 100644
--- a/src/components/main_page/Landing.astro
+++ b/src/components/main_page/Landing.astro
@@ -7,9 +7,9 @@ import { RiInstagramFill } from "react-icons/ri";
 import { MdEmail } from "react-icons/md";
 ---
 
-<div class="w-full flex justify-between space-x-2">
+<div class="w-full flex justify-between space-x-2 pt-[2%]">
   <div
-    class="md:pt-[5%] pt-[6%] bg-gradient-to-t to-ieee-blue-100/30 p-[5vw] via-ieee-black from-ieee-black md:w-[53%] w-[60%] md:h-[40vw] h-[65vw] border-white/70 border-[0.1vw] rounded-[3vw]"
+    class="md:pt-[5%] pt-[6%] bg-gradient-to-t to-ieee-blue-100/30 p-[5vw] via-ieee-black from-ieee-black md:w-[53%] w-[60%] md:h-[45vw] h-[65vw] border-white/70 border-[0.1vw] rounded-[3vw]"
   >
     <p
       data-inview
@@ -60,12 +60,12 @@ import { MdEmail } from "react-icons/md";
     </div>
   </div>
   <div
-    class="md:w-[46%] w-[40%] md:h-[40vw] h-[65vw] border-white/70 border-[0.1vw] rounded-[3vw] bg-gradient-to-b to-ieee-blue-100/60 from-ieee-black"
+    class="md:w-[46%] w-[40%] md:h-[45vw] h-[65vw] border-white/70 border-[0.1vw] rounded-[3vw] bg-gradient-to-b to-ieee-blue-100/60 from-ieee-black"
   >
     <Image
       src={landingimg}
       alt="circuit"
-      class="w-[95%] md:h-[40vw] h-[60vw] object-contain"
+      class="w-[95%] md:h-[45vw] h-[60vw] object-contain"
     />
   </div>
 </div>
diff --git a/src/data/roboLinks.json b/src/data/roboLinks.json
new file mode 100644
index 0000000..131bef6
--- /dev/null
+++ b/src/data/roboLinks.json
@@ -0,0 +1,17 @@
+[
+    {
+        "text":"RoboCup Small-Size League",
+        "link":"https://ssl.robocup.org/",
+        "delay":"100"
+    },
+    {
+        "text":"Current Year’s Team Description Paper",
+        "link":"https://tdpsearch.com/",
+        "delay":"300"
+    },
+    {
+        "text":"Past Team Description Papers (Select ‘SmallSize’)",
+        "link":"https://drive.google.com/file/d/1wx4d79kWA3_dq6UBP-7pE1ECLRKhAOWK/view?usp=drive_link",
+        "delay":"500"
+    }
+]
\ No newline at end of file
diff --git a/src/pages/projects/robocup.astro b/src/pages/projects/robocup.astro
index 6213d10..1b8a408 100644
--- a/src/pages/projects/robocup.astro
+++ b/src/pages/projects/robocup.astro
@@ -12,7 +12,8 @@ import Contacts from "../../components/robocub/Contacts.astro";
 import Subteams from "../../components/robocub/Subteams.astro";
 import Timeline from "../../components/qp/Timeline.astro";
 import Competition from "../../components/signal/Competition.astro";
-import roboTimeline from "../../data/roboTimeline.json"
+import roboTimeline from "../../data/roboTimeline.json";
+import roboLinks from "../../data/roboLinks.json";
 ---
 
 <Layout>
@@ -31,13 +32,18 @@ import roboTimeline from "../../data/roboTimeline.json"
         title="What is RoboCup?"
         text = "TritonBots FC is UCSD’s RoboCup Small-Size League Team. Students develop fully autonomous soccer playing robots to compete in the annual RoboCup International Competition. All hardware is custom built and software programmed from the ground up. Position, velocity, and field data is received in real time through computer vision."    />
     <div class="w-full flex justify-center">
-        <Link
-            href="https://tdpsearch.com/"
-            target="_blank"
-            className="text-center mb-[10%] z-10 cursor-pointer px-[2%] py-[0.5%] md:text-[1.2vw] text-[2vw] border-[0.1vw] border-white rounded-[0.5vw] hover:text-ieee-yellow hover:border-ieee-yellow duration-300 font-light"
-        >
-            Past Team Description Paper <br/> (Select ‘SmallSize’)
-        </Link>
+        <div class="w-3/5 flex justify-between mb-[15%]">
+            {roboLinks.map((roboLink) => (
+                <Link
+                    data-inview
+                    href={roboLink.link}
+                    target="_blank"
+                    className={`in-view:animate-fade-down animate-de animate-delay-${roboLink.delay} w-[30%] text-center z-10 cursor-pointer px-[2%] py-[1%] md:text-[1.2vw] text-[2vw] border-[0.1vw] border-white rounded-[0.5vw] hover:bg-ieee-yellow/80 duration-300 font-light`}
+                >
+                    {roboLink.text}
+                </Link>
+            ))}
+        </div>
     </div>
     <Competition
         picture="/robocup.webp"