Merge branch 'dev' of github.com:codeXsit/CodeX-Website into new-events-page

Author: Miran-Firdausi

src/components/Footer/index.jsx

@@ -31,14 +31,18 @@ function Footer() {
               members can learn, collaborate, and grow their coding expertise
               through a variety of activities and events.
             </p>
-            <div className="flex flex-col sm:flex-row items-center sm:items-start gap-4 sm:gap-4 md:w-full">
+            <div className="flex flex-col sm:flex-row items-center gap-4 md:w-full">
               <img
                 src={SitLogo}
                 alt="Symbiosis Logo"
-                className="h-10 md:h-12"
+                className="h-12"
+              />
+              <div className="hidden sm:block w-px h-12 bg-secondary-light"></div>
+              <img
+                src={Logo}
+                alt="CodeX Logo"
+                className="h-16 md:h-20 self-center"
               />
-              <div className="hidden sm:block w-px h-10 bg-secondary-light" />
-              <img src={Logo} alt="CodeX Logo" className="h-10 md:h-12" />
             </div>
           </div>
 

src/components/WebsiteTeam/TeamMember.jsx

@@ -39,42 +39,42 @@ function TeamMember({ member, className }) {
       className={`min-w-[330px] max-w-[330px] relative group transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-105 duration-200 cursor-pointer align-middle ${className}`}
     >
       <div className="align-middle">
-        <div className="absolute top-[10%] -left-4 z-10 opacity-0 group-hover:opacity-100 transition-opacity duration-500 ">
+        <div className="absolute top-[10%] -left-4 z-10 opacity-100 md:opacity-0 md:group-hover:opacity-100 transition-opacity duration-500">
           <div className="flex flex-col space-y-4">
             <a
               href={linkedin}
               target="_blank"
               rel="noreferrer"
-              className="text-white font-sans opacity-0 group-hover:opacity-100 transition-opacity duration-500 delay-100"
+              className="text-white font-sans opacity-100 md:opacity-0 md:group-hover:opacity-100 transition-opacity duration-500 delay-100"
             >
               <img
                 src={LinkedInIcon}
                 alt="Linkedin"
-                className="w-10 h-10 sm:w-8 sm:h-8 md:w-10 md:h-10 lg:w-12 lg:h-12 p-2"
+                className="w-10 h-10 sm:w-10 sm:h-10 md:w-10 md:h-10 lg:w-12 lg:h-12 p-2"
               />
             </a>
             <a
               href={github}
               target="_blank"
               rel="noreferrer"
-              className="text-white font-sans opacity-0 group-hover:opacity-100 transition-opacity duration-500 delay-200"
+              className="text-white font-sans opacity-100 md:opacity-0 md:group-hover:opacity-100 transition-opacity duration-500 delay-200"
             >
               <img
                 src={GithubIcon}
                 alt="Github"
-                className="w-10 h-10 sm:w-8 sm:h-8 md:w-10 md:h-10 lg:w-12 lg:h-12 p-2"
+                className="w-10 h-10 sm:w-10 sm:h-10 md:w-10 md:h-10 lg:w-12 lg:h-12 p-2"
               />
             </a>
             <a
               href={instagram}
               target="_blank"
               rel="noreferrer"
-              className="text-white font-sans opacity-0 group-hover:opacity-100 transition-opacity duration-500 delay-300"
+              className="text-white font-sans opacity-100 md:opacity-0 md:group-hover:opacity-100 transition-opacity duration-500 delay-300"
             >
               <img
                 src={InstagramIcon}
                 alt="Instagram"
-                className="w-10 h-10 sm:w-8 sm:h-8 md:w-10 md:h-10 lg:w-12 lg:h-12 p-2"
+                className="w-10 h-10 sm:w-10 sm:h-10 md:w-10 md:h-10 lg:w-12 lg:h-12 p-2"
               />
             </a>
           </div>