From ac41e7325a1c48eeb51f6d5a1416d1cd346eaae8 Mon Sep 17 00:00:00 2001
From: LuaanNguyen <luanthiennguyen2003@gmail.com>
Date: Mon, 5 Aug 2024 10:29:53 -0700
Subject: [PATCH] Added Uniform Texts

---
 src/components/AboutUs.tsx               |  7 +++++--
 src/components/Button/RiArrowButton.tsx  |  2 +-
 src/components/Info/InfoCards.tsx        |  4 ++--
 src/components/Navigation/DesktopNav.tsx |  5 +++++
 src/components/SocialMediaLinks.tsx      |  2 +-
 src/components/Team/TeamCards.tsx        |  2 +-
 src/pages/Home.tsx                       |  4 ++--
 src/styles/index.css                     | 16 ++++++++++------
 8 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/src/components/AboutUs.tsx b/src/components/AboutUs.tsx
index 6aebd08..820771f 100644
--- a/src/components/AboutUs.tsx
+++ b/src/components/AboutUs.tsx
@@ -24,10 +24,13 @@ const perks = [
 
 export default function AboutUs() {
   return (
-    <main className="flex flex-col  w-[70vw] max-md:w-[95vw] justify-center items-center mx-auto">
+    <main
+      className="flex flex-col  w-[70vw] max-md:w-[95vw] justify-center items-center mx-auto mb-20"
+      id="info"
+    >
       <section className="text-center max-md:text-left">
         <h1 className="section-header-text">About SoDA</h1>
-        <p className="px-24 max-lg:px-4 mx-auto">
+        <p className="hero-small-text px-24 max-lg:px-4 mx-auto">
           The Software Developers Association (SoDA) at Arizona State
           University, is a student run, free organization dedicated to serving
           ASU’s computer science students. SoDA is one of the largest
diff --git a/src/components/Button/RiArrowButton.tsx b/src/components/Button/RiArrowButton.tsx
index 0fb1af4..4b52621 100644
--- a/src/components/Button/RiArrowButton.tsx
+++ b/src/components/Button/RiArrowButton.tsx
@@ -8,7 +8,7 @@ function RiArrowButton({ name }: RoundedButtonTypes) {
   return (
     <button type="button" className="right-arrow-btn">
       <span className="btn-text">{name}</span>
-      <RiArrowRightSLine className="text-3xl text-white" />
+      <RiArrowRightSLine className="text-2xl text-white" />
     </button>
   );
 }
diff --git a/src/components/Info/InfoCards.tsx b/src/components/Info/InfoCards.tsx
index ff3f68c..30d0741 100644
--- a/src/components/Info/InfoCards.tsx
+++ b/src/components/Info/InfoCards.tsx
@@ -6,9 +6,9 @@ import "./InfoCards.css";
 class InfoCards extends Component {
   render() {
     return (
-      <div className="infocards" id="info">
+      <div className="infocards" id="events">
         <Divider horizontal id="title">
-          Info
+          Our Events
         </Divider>
         <br />
 
diff --git a/src/components/Navigation/DesktopNav.tsx b/src/components/Navigation/DesktopNav.tsx
index c6a7cbf..07737fa 100644
--- a/src/components/Navigation/DesktopNav.tsx
+++ b/src/components/Navigation/DesktopNav.tsx
@@ -6,6 +6,11 @@ const navLinks = [
     id_href: "#info",
     cssClass: "nav-text-animation",
   },
+  {
+    name: "Events",
+    id_href: "#events",
+    cssClass: "nav-text-animation",
+  },
   {
     name: "Sponsors",
     id_href: "#sponsors",
diff --git a/src/components/SocialMediaLinks.tsx b/src/components/SocialMediaLinks.tsx
index aa7b2e7..f54dc4c 100644
--- a/src/components/SocialMediaLinks.tsx
+++ b/src/components/SocialMediaLinks.tsx
@@ -23,7 +23,7 @@ const socialMediaLinks = [
   },
   {
     href: "https://discord.gg/the-software-developers-association-762811961238618122",
-    icon: <FaDiscord />,
+    icon: <FaDiscord className="hover:text-soda-red" />,
   },
   {
     href: "https://www.facebook.com/SoDAASU/",
diff --git a/src/components/Team/TeamCards.tsx b/src/components/Team/TeamCards.tsx
index 5e7b885..db27185 100644
--- a/src/components/Team/TeamCards.tsx
+++ b/src/components/Team/TeamCards.tsx
@@ -28,7 +28,7 @@ class MemberCards extends Component<MemberCardsProps> {
           Team
         </Divider>
         <br />
-        <div id="content">
+        <div id="content" className="">
           SoDA is here to help you. Please feel free to reach out to any of us,
           we want to help and would be happy to answer any questions you have!
         </div>
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index cf7105d..2374c9e 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -16,8 +16,8 @@ function Home() {
       <SponsorsMarquee />
       <MemberCards contacts={contactsData as Contacts} />
       <InfoCards />
-      <ShootingStars minDelay={1000} maxSpeed={20} />
-      <StarsBackground starDensity={0.00015} />
+      <ShootingStars minDelay={1000} maxSpeed={20} starWidth={20} />
+      <StarsBackground starDensity={0.0003} />
     </main>
   );
 }
diff --git a/src/styles/index.css b/src/styles/index.css
index 82d4612..68777b1 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -2,6 +2,10 @@
 @tailwind components;
 @tailwind utilities;
 
+:root {
+  color-scheme: dark;
+}
+
 html {
   scroll-behavior: smooth;
 }
@@ -11,7 +15,7 @@ body {
 }
 
 .nav-text-animation {
-  @apply hover:text-xl transition ease-in-out;
+  @apply hover:text-lg text-base transition ease-in-out;
 }
 
 /*Start Animations*/
@@ -184,14 +188,14 @@ body {
 /* --------- STATS --------- */
 .statistics {
   @apply bg-soda-white max-md:w-screen text-soda-black flex  
-  flex-row gap-5 py-4 px-6 my-3 justify-center flex-wrap md:rounded-[80px] z-10;
+  flex-row gap-4 py-4 px-6 my-2 justify-center flex-wrap md:rounded-[80px] z-10;
 }
 
 .stat-container {
   @apply items-center text-center;
 }
 .stat-value {
-  @apply text-4xl font-extrabold;
+  @apply text-3xl font-extrabold;
 }
 
 .stat-label {
@@ -217,7 +221,7 @@ body {
 }
 
 .hero-small-text {
-  @apply my-6 text-lg px-6 text-soda-gray;
+  @apply my-6 text-sm px-6 text-soda-gray;
 }
 
 /* --------- SPONSORS --------- */
@@ -274,7 +278,7 @@ footer {
 
 /* --------- BUTTON --------- */
 .rounded-btn {
-  @apply px-3 py-2 bg-soda-red rounded-full;
+  @apply px-2 py-1 bg-soda-red rounded-full;
 }
 
 .right-arrow-btn {
@@ -285,5 +289,5 @@ footer {
   @apply px-3 py-1 bg-soda-red rounded-lg;
 }
 .btn-text {
-  @apply font-bold text-soda-white;
+  @apply font-semibold text-soda-white text-[15px];
 }