From ee08082b3c0322edfc87a50f0715ecbb84f1b7a3 Mon Sep 17 00:00:00 2001
From: Brian Jia <brian.jia04@gmail.com>
Date: Wed, 7 Aug 2024 18:31:12 -0400
Subject: [PATCH] Make links red

---
 src/components/CustomStyles.astro    |  5 +++++
 src/components/widgets/Socials.astro |  6 +++---
 src/pages/contact.astro              | 18 +++++++++++++-----
 src/pages/index.astro                |  6 +++---
 4 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/src/components/CustomStyles.astro b/src/components/CustomStyles.astro
index 5f46071..5d2b974 100644
--- a/src/components/CustomStyles.astro
+++ b/src/components/CustomStyles.astro
@@ -60,4 +60,9 @@ import '@fontsource-variable/inter';
       color: snow;
     }
   }
+
+  .link {
+    text-decoration: underline;
+    color: var(--aw-color-primary);
+  }
 </style>
diff --git a/src/components/widgets/Socials.astro b/src/components/widgets/Socials.astro
index 0e1bb40..a59b27c 100644
--- a/src/components/widgets/Socials.astro
+++ b/src/components/widgets/Socials.astro
@@ -1,5 +1,6 @@
 ---
 import { Icon } from "astro-icon/components";
+import { twMerge } from "tailwind-merge";
 
 const {
   linkedins = [],
@@ -7,13 +8,12 @@ const {
   facebooks = [],
   youtubes = [],
   instagrams = [],
-  classes = [],
+  classes,
 } = Astro.props;
 ---
 
 <div
-  class="font-normal flex flex-row flex-wrap gap-x-3 my-2 text-muted"
-  class:list={classes}
+  class={twMerge("font-normal flex flex-row flex-wrap gap-x-3 my-2 text-muted", classes)}
 >
   {
     instagrams.map((instagram) => (
diff --git a/src/pages/contact.astro b/src/pages/contact.astro
index 1553da1..811cafc 100644
--- a/src/pages/contact.astro
+++ b/src/pages/contact.astro
@@ -19,7 +19,11 @@ const title = "Contact us";
       <div class="flex flex-col gap-8 text-center">
         <div>
           <h2 class="font-bold">Join our Slack</h2>
-          <u><a href="https://linktr.ee/buckeye_sli">https://linktr.ee/buckeye_sli</a></u>
+          <u
+            ><a href="https://linktr.ee/buckeye_sli" class="link"
+              >https://linktr.ee/buckeye_sli</a
+            ></u
+          >
         </div>
 
         <div>
@@ -27,7 +31,7 @@ const title = "Contact us";
           <p>
             Email us at:
             <div class="flex justify-center">
-              <Socials emails={["eng-buckeyesli@osu.edu"]} />
+              <Socials classes="text-primary" emails={["eng-buckeyesli@osu.edu"]} />
             </div>
           </p>
         </div>
@@ -35,9 +39,12 @@ const title = "Contact us";
         <div>
           <h2 class="font-bold">Leadership/Project Inquiries</h2>
           <p>
-            Find the right person on our <u
-              ><a href={getPermalink("/leadership")}>Leadership</a></u
-            > page.
+            Find the right person on our
+            <u
+              ><a href={getPermalink("/leadership")} class="link">Leadership</a
+              ></u
+            >
+            page.
           </p>
         </div>
 
@@ -52,6 +59,7 @@ const title = "Contact us";
               facebooks={["https://www.facebook.com/spacelaunchinitiative/"]}
               youtubes={["https://www.youtube.com/@buckeyesli1865/videos"]}
               instagrams={["https://www.instagram.com/buckeye_sli/"]}
+              classes="text-primary"
             />
           </div>
         </div>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 2d2e710..7c7055f 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -149,7 +149,7 @@ const metadata = {
     items={[
       {
         title:
-          'Step 1: <u><a href="#our-projects"><span class="font-medium">Find your Project Subteam.</span></a></u>',
+          'Step 1: <span class="font-medium"><a href="#our-projects" class="link">Find your Project Subteam.</a></span>',
         description:
           "Research our teams! Across NASA, Spaceport, and Liquids, there is a place for you in BSLI.",
         icon: "tabler:search",
@@ -157,7 +157,7 @@ const metadata = {
       {
         title:
           'Step 2: <span class="font-medium">Check if the team meets when you\'re available.</span>',
-        description: `Meeting times can be found in the <u><a href="#our-projects">"Our Projects"</a></u> section above.`,
+        description: `Meeting times can be found in the <a href="#our-projects" class="link">"Our Projects"</a> section above.`,
         icon: "tabler:clock",
       },
       {
@@ -174,7 +174,7 @@ const metadata = {
       {
         title:
           'Step 5: <span class="font-medium">Consider joining a leadership position!</span>',
-        description: `If you enjoy being part of BSLI, check out the variety of leadership positions available on the <u><a href="${getPermalink("leadership")}"><span class="font-medium">Leadership</a></u> page.`,
+        description: `If you enjoy being part of BSLI, check out the variety of leadership positions available on the <a class="link" href="${getPermalink("leadership")}">Leadership</a> page.`,
         icon: "tabler:bulb",
       },
     ]}