Merge pull request #106 from ishaanchitre12/main

Changing background colors for red and blue buttons
DevDogs-UGA · Oct 20, 2024 · aca8539 · aca8539
2 parents 23e593f + e152d05
commit aca8539
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 6 deletions.
diff --git a/src/app/about/page.js b/src/app/about/page.js
@@ -110,14 +110,14 @@ const AboutPage = () => {
           <div className="flex items-center flex-nowrap justify-center gap-[2rem] py-4">
             <Link
               href="/about/projects"
-              className="text-lg md:text-xl rounded-full font-medium  py-2 px-4 sm:px-6 transition ease-in-out delay-150 bg-DevDogBlue text-white hover:bg-black hover:text-white "
+              className="blue text-lg md:text-xl rounded-full font-medium  py-2 px-4 sm:px-6 transition ease-in-out delay-150 text-white"
             >
               <Button>All Projects</Button>
             </Link>
             <Link
               target="_blank"
               href="/about/people"
-              className="text-lg md:text-xl rounded-full font-medium  py-2 px-4 sm:px-6 transition ease-in-out delay-150 text-white bg-[#BA0C2F] hover:bg-black hover:text-white "
+              className="red text-lg md:text-xl rounded-full font-medium  py-2 px-4 sm:px-6 transition ease-in-out delay-150 text-white"
             >
               <Button>Our People</Button>
             </Link>

diff --git a/src/app/about/projects/page.js b/src/app/about/projects/page.js
@@ -97,7 +97,7 @@ const Page = () => {
 
       <Link
         href="https://github.com/DevDogs-UGA/Optimal-Schedule-Builder"
-        className="bg-BulldogRed container transition ease-in-out duration-300 block mx-auto rounded-full max-w-[17rem] font-semibold py-3 my-[75px]  text-white hover:bg-black hover:text-white"
+        className="red container transition ease-in-out duration-300 block mx-auto rounded-full max-w-[17rem] font-semibold py-3 my-[75px]  text-white"
       >
         <Button className="">View</Button>
       </Link>

diff --git a/src/app/components/NavBar.js b/src/app/components/NavBar.js
@@ -111,7 +111,7 @@ const NavBar = () => {
       <Link
         target="_blank"
         href="https://discord.com/invite/MuyJ4f5xKE"
-        className="hidden lg:block text-lg md:text-xl rounded-full font-medium p-2 transition ease-in-out delay-50 text-white bg-[#BA0C2F] hover:bg-white hover:text-black"
+        className="red hidden lg:block text-lg md:text-xl rounded-full font-medium p-2 transition ease-in-out delay-50 text-white"
       >
         <Button>Join Us</Button>
       </Link>

diff --git a/src/app/globals.css b/src/app/globals.css
@@ -279,6 +279,22 @@ iframe {
   justify-content: center;
 }
 
+.red {
+  background-color: #ba0c2f;
+}
+
+.red:hover {
+  background-color: #e4002b;
+}
+
+.blue {
+  background-color: #33334d;
+}
+
+.blue:hover {
+  background-color: #222233;
+}
+
 #tiers {
   display: flex;
   justify-content: center;

diff --git a/src/app/page.js b/src/app/page.js
@@ -97,14 +97,14 @@ const Home = () => {
           <div className="button-grid">
             <Link
               href="/about"
-              className="text-lg md:text-xl rounded-full font-medium m-4 p-2 transition ease-in-out delay-150 text-white bg-black hover:bg-white hover:text-black "
+              className="text-lg md:text-xl rounded-full font-medium m-4 p-2 transition ease-in-out delay-150 text-black bg-#33334d hover:bg-white hover:text-black "
             >
               <Button>Learn More</Button>
             </Link>
             <Link
               target="_blank"
               href="https://discord.com/invite/MuyJ4f5xKE"
-              className="text-lg md:text-xl rounded-full font-medium m-4 p-2 transition ease-in-out delay-150 text-white bg-[#BA0C2F] hover:bg-white hover:text-black "
+              className="red text-lg md:text-xl rounded-full font-medium m-4 p-2 transition ease-in-out delay-150 text-white"
             >
               <Button>Join Us!</Button>
             </Link>