Make the buttons grow

Author: Domin0de

frontend/src/components/About/AboutHomepage.tsx

@@ -14,7 +14,7 @@ export default function AboutHomePage() {
                   <Image src="/assets/csesoc_icon.svg" alt="CSESoc Icon" width={150} height={150} />
                 </div>
                 <h2 className="text-3xl font-extrabold">CSESoc</h2>
-                <button className="bg-[#444F6F] w-full my-5 py-2 rounded">Follow</button>
+                <button className="bg-[#444F6F] w-full my-5 py-2 rounded hover-animate">Follow</button>
               </div>
               {/* RIGHT SIDE */}
               <div className="col-span-4 lg:mt-0 mt-10">

frontend/src/components/Background.tsx

@@ -3,7 +3,7 @@ import Spline from '@splinetool/react-spline';
 const Background = () => {
   return (
     <Spline
-      className="absolute "
+      className="absolute"
       scene="https://prod.spline.design/thPGkOvNXu8XjGlk/scene.splinecode"
     />
   );

frontend/src/components/Event/index.tsx

@@ -11,7 +11,7 @@ const Event = () => {
           listings, check out the CSESoc Discord or our Facebook page!
         </p>
         <a href="events">
-                <button className="mt-10 bg-white border text-[#3977F8] border-[#A7A6E5] text-lg rounded-xl w-[60%] xl:h-12 h-10">
+                <button className="mt-10 bg-white border text-[#3977F8] border-[#A7A6E5] text-lg rounded-xl w-[60%] xl:h-12 h-10 hover-animate">
                   See all events
                 </button>
               </a>

frontend/src/components/Sponsors/index.tsx

@@ -28,7 +28,7 @@ const Sponsors = () => {
               <h2 className="text-4xl font-black">Our sponsors</h2>
               <p className="xl:my-10 my-3 text-lg">Check out our very cool sponsors.</p>
               <a href="sponsors">
-                <button className="bg-white border text-[#3977F8] border-[#A7A6E5] text-lg rounded-xl w-[100%] xl:h-12 h-10">
+                <button className="bg-white border text-[#3977F8] border-[#A7A6E5] text-lg rounded-xl w-[100%] xl:h-12 h-10 hover-animate">
                   View our sponsors
                 </button>
               </a>

frontend/src/styles/globals.css

@@ -27,5 +27,5 @@ body {
 }
 
 .hover-animate:hover {
-  transform: scale(1.01);
+  transform: scale(1.05);
 }