From 6b3ce906f1d907df7d989e9c621c3c480964cedb Mon Sep 17 00:00:00 2001
From: Shravani Chendwankar <shravanichendwankar@gmail.com>
Date: Thu, 23 Jan 2025 12:42:23 +0530
Subject: [PATCH 1/6] add creative hover effect for Apply to GSoC link

---
 src/components/Banner.jsx | 27 +++++++++++++++++++--------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/src/components/Banner.jsx b/src/components/Banner.jsx
index 44a482d..7f6d99b 100644
--- a/src/components/Banner.jsx
+++ b/src/components/Banner.jsx
@@ -4,22 +4,33 @@ import { Pattern } from '@/components/Pattern';
 
 export function Banner() {
   return (
-    <section aria-label="Apply Banner" className="scroll-mt-14 bg-[#00843D] dark:bg-yellow-400 sm:scroll-mt-32">
+    <section
+      aria-label="Apply Banner"
+      className="scroll-mt-14 bg-[#00843D] dark:bg-yellow-400 sm:scroll-mt-32"
+    >
       <div className="overflow-hidden lg:relative">
-        <ContainerPattern size="md" className="relative grid grid-cols-1 items-end gap-y-12 lg:static lg:grid-cols-2 pt-24 pb-8 sm:py-10">
+        <ContainerPattern
+          size="md"
+          className="relative grid grid-cols-1 items-end gap-y-12 pt-24 pb-8 sm:py-10 lg:static lg:grid-cols-2"
+        >
           <Pattern className="absolute -top-28 left-0 w-full sm:left-3/4 sm:-top-10 sm:ml-8 sm:w-auto md:left-2/3 lg:left-auto lg:right-2 lg:ml-0 xl:right-auto xl:left-2/3" />
-          <Pattern className="absolute mt-2 -top-32 left-0 w-full sm:left-3/4 sm:top-36 sm:ml-8 sm:w-auto md:left-2/3 lg:left-auto lg:right-2 lg:ml-0 xl:right-auto xl:left-2/3 sm:visible invisible" />
+          <Pattern className="invisible absolute -top-32 left-0 mt-2 w-full sm:visible sm:left-3/4 sm:top-36 sm:ml-8 sm:w-auto md:left-2/3 lg:left-auto lg:right-2 lg:ml-0 xl:right-auto xl:left-2/3" />
           <div>
             <h2 className="font-mono text-5xl font-black tracking-tighter text-white dark:text-black sm:w-3/4 sm:text-5xl md:w-2/3 lg:w-auto">
               Launch into AOSSIE&apos;s open-source world through GSoC!
             </h2>
-            <p className="mt-4 text-lg tracking-tighter text-white dark:text-black font-medium font-mono">
-              Learn how to apply for an opportunity to work on open-source projects and gain real-world experience through Google Summer of Code.
+            <p className="mt-4 font-mono text-lg font-medium tracking-tighter text-white dark:text-black">
+              Learn how to apply for an opportunity to work on open-source
+              projects and gain real-world experience through Google Summer of
+              Code.
             </p>
             <div className="mt-5">
               <Link href="/apply" legacyBehavior>
-                <a className="group relative rounded-lg inline-flex items-center overflow-hidden bg-white dark:bg-black px-8 py-3 text-black dark:text-white focus:outline-none font-mono font-semibold">
-                  Apply to GSoC with AOSSIE
+                <a className="group relative inline-flex items-center overflow-hidden rounded-lg bg-white px-8 py-3 font-mono font-semibold text-black transition-all duration-300 hover:bg-gradient-to-r hover:from-[#00843D] hover:to-green-500 hover:text-white focus:outline-none dark:bg-black dark:text-white dark:hover:from-green-500 dark:hover:to-blue-500">
+                  <span className="absolute inset-0 translate-x-full bg-[#FED41E] transition-transform duration-500 ease-out group-hover:translate-x-0 dark:bg-green-500"></span>
+                  <span className="relative z-10">
+                    Apply to GSoC with AOSSIE
+                  </span>
                 </a>
               </Link>
             </div>
@@ -27,5 +38,5 @@ export function Banner() {
         </ContainerPattern>
       </div>
     </section>
-  );
+  )
 }

From a39e649c8333d97d32160ea569dd980c56756d94 Mon Sep 17 00:00:00 2001
From: Shravani Chendwankar <shravanichendwankar@gmail.com>
Date: Thu, 23 Jan 2025 12:55:02 +0530
Subject: [PATCH 2/6] add creative hover effect for Apply to GSoC with Aossie

---
 src/components/Banner.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Banner.jsx b/src/components/Banner.jsx
index 7f6d99b..db8ece9 100644
--- a/src/components/Banner.jsx
+++ b/src/components/Banner.jsx
@@ -29,7 +29,7 @@ export function Banner() {
                 <a className="group relative inline-flex items-center overflow-hidden rounded-lg bg-white px-8 py-3 font-mono font-semibold text-black transition-all duration-300 hover:bg-gradient-to-r hover:from-[#00843D] hover:to-green-500 hover:text-white focus:outline-none dark:bg-black dark:text-white dark:hover:from-green-500 dark:hover:to-blue-500">
                   <span className="absolute inset-0 translate-x-full bg-[#FED41E] transition-transform duration-500 ease-out group-hover:translate-x-0 dark:bg-green-500"></span>
                   <span className="relative z-10">
-                    Apply to GSoC with AOSSIE
+                  Apply to GSoC with AOSSIE
                   </span>
                 </a>
               </Link>

From d5a67d931a8f8a52dbd24cffdf624e7b4097fa6e Mon Sep 17 00:00:00 2001
From: Shravani Chendwankar <shravanichendwankar@gmail.com>
Date: Thu, 23 Jan 2025 13:09:12 +0530
Subject: [PATCH 3/6] add creative hover effect for Apply to GSoC with Aossie

---
 src/components/Banner.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Banner.jsx b/src/components/Banner.jsx
index db8ece9..7f6d99b 100644
--- a/src/components/Banner.jsx
+++ b/src/components/Banner.jsx
@@ -29,7 +29,7 @@ export function Banner() {
                 <a className="group relative inline-flex items-center overflow-hidden rounded-lg bg-white px-8 py-3 font-mono font-semibold text-black transition-all duration-300 hover:bg-gradient-to-r hover:from-[#00843D] hover:to-green-500 hover:text-white focus:outline-none dark:bg-black dark:text-white dark:hover:from-green-500 dark:hover:to-blue-500">
                   <span className="absolute inset-0 translate-x-full bg-[#FED41E] transition-transform duration-500 ease-out group-hover:translate-x-0 dark:bg-green-500"></span>
                   <span className="relative z-10">
-                  Apply to GSoC with AOSSIE
+                    Apply to GSoC with AOSSIE
                   </span>
                 </a>
               </Link>

From ce88b7ecd39c7df300316e7023bd843b4a11478c Mon Sep 17 00:00:00 2001
From: Shravani Chendwankar <shravanichendwankar@gmail.com>
Date: Thu, 23 Jan 2025 14:26:17 +0530
Subject: [PATCH 4/6] add href to project link

---
 src/components/Card.jsx |  2 +-
 src/pages/projects.jsx  | 44 +++++++++++++++++++++++++----------------
 2 files changed, 28 insertions(+), 18 deletions(-)

diff --git a/src/components/Card.jsx b/src/components/Card.jsx
index 910d199..812c6fe 100644
--- a/src/components/Card.jsx
+++ b/src/components/Card.jsx
@@ -55,7 +55,7 @@ Card.Cta = function CardCta({ children }) {
   return (
     <div
       aria-hidden="true"
-      className="relative font-mono z-10 mt-4 flex items-center text-sm font-semibold text-[#00843D] dark:text-yellow-400"
+      className="relative z-10 mt-4 flex items-center font-mono text-sm font-semibold text-[#00843D] dark:text-yellow-400"
     >
       {children}
       <ChevronRightIcon className="ml-1 h-4 w-4 stroke-current" />
diff --git a/src/pages/projects.jsx b/src/pages/projects.jsx
index 7156fbc..2b06b8c 100644
--- a/src/pages/projects.jsx
+++ b/src/pages/projects.jsx
@@ -1,5 +1,6 @@
 import Image from 'next/image'
 import Head from 'next/head'
+import Link from 'next/link'
 
 import { Container } from '@/components/Container'
 import { SectionHeading } from '@/components/SectionHeading'
@@ -21,42 +22,51 @@ export default function Projects() {
   return (
     <>
       <Head>
-        <title>
-          Projects
-        </title>
-        <meta
-          name="description"
-          content="About AOSSIE's Projects"
-        />
+        <title>Projects</title>
+        <meta name="description" content="About AOSSIE's Projects" />
       </Head>
       <Container className="mt-20 mb-28">
         <div className="mt-5">
-          <p className='text-zinc-600 dark:text-zinc-400 text-lg font-mono leading-7'>Our Projects, where we showcase our tech wizardry and code-slinging skills! <br></br> Our portfolio is a treasure trove of open-source gems, featuring projects in a variety of languages and areas. Take a peek and see how we&apos;re making a difference with our technical spells.</p>
+          <p className="font-mono text-lg leading-7 text-zinc-600 dark:text-zinc-400">
+            Our Projects, where we showcase our tech wizardry and code-slinging
+            skills! <br></br> Our portfolio is a treasure trove of open-source
+            gems, featuring projects in a variety of languages and areas. Take a
+            peek and see how we&apos;re making a difference with our technical
+            spells.
+          </p>
         </div>
-        <div className='mt-16'>
+        <div className="mt-16">
           {/* <h1 className="text-4xl font-mono font-extrabold tracking-tighter text-zinc-800 dark:text-zinc-100">
             Active Projects
           </h1> */}
           <SectionHeading>Active Projects</SectionHeading>
-          <p className='text-zinc-600 dark:text-zinc-400 text-lg font-mono leading-7 mt-3'>The following projects are currently actively maintained and mentors are available!</p>
-          <ul role="list" className="grid grid-cols-1 gap-x-12 gap-y-16 sm:grid-cols-2 lg:grid-cols-3 mt-12 mb-16">
+          <p className="mt-3 font-mono text-lg leading-7 text-zinc-600 dark:text-zinc-400">
+            The following projects are currently actively maintained and mentors
+            are available!
+          </p>
+          <ul
+            role="list"
+            className="mt-12 mb-16 grid grid-cols-1 gap-x-12 gap-y-16 sm:grid-cols-2 lg:grid-cols-3"
+          >
             {projects.map((project) => (
               <Card as="li" key={project.name}>
-                <div className="relative z-10 flex h-20 w-20 items-center justify-center rounded-lg bg-white shadow-md shadow-zinc-800/20 ring-1 ring-zinc-900/5 dark:border dark:border-zinc-700/50 dark:bg-zinc-800 dark:ring-white/10 dark:shadow-white/10">
+                <div className="relative z-10 flex h-20 w-20 items-center justify-center rounded-lg bg-white shadow-md shadow-zinc-800/20 ring-1 ring-zinc-900/5 dark:border dark:border-zinc-700/50 dark:bg-zinc-800 dark:shadow-white/10 dark:ring-white/10">
                   <Image
                     src={project.logo}
                     alt="Project Logo"
-                    className='p-2'
+                    className="p-2"
                     unoptimized
                   />
                 </div>
-                <h2 className="mt-6 text-2xl font-semibold font-mono text-zinc-800 dark:text-zinc-100">
+                <h2 className="mt-6 font-mono text-2xl font-semibold text-zinc-800 dark:text-zinc-100">
                   <Card.Link href={project.link.href}>{project.name}</Card.Link>
                 </h2>
                 <Card.Description>{project.description}</Card.Description>
-                <p className="relative z-10 mt-6 flex text-md font-semibold font-mono text-zinc-600 transition group-hover:text-[#00843D] dark:group-hover:text-yellow-400 dark:text-zinc-200">
+                <p className="text-md relative z-10 mt-6 flex font-mono font-semibold text-zinc-600 transition group-hover:text-[#00843D] dark:text-zinc-200 dark:group-hover:text-yellow-400">
                   <LinkIcon className="h-6 w-6 flex-none scale-110" />
-                  <span className="ml-2">{project.link.label}</span>
+                  <span className="ml-2">
+                    <Link href={project.link.href}>{project.link.label}</Link>
+                  </span>
                 </p>
               </Card>
             ))}
@@ -91,5 +101,5 @@ export default function Projects() {
         </div>
       </Container>
     </>
-    )
+  )
 }

From 0a15f29e61e9370131232b1aaff8d8220b11cbfb Mon Sep 17 00:00:00 2001
From: Shravani <shravanichendwankar@gmail.com>
Date: Fri, 24 Jan 2025 16:58:14 +0530
Subject: [PATCH 5/6] Add hover effect on 2023 idea list

---
 src/pages/ideas/index.jsx | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/pages/ideas/index.jsx b/src/pages/ideas/index.jsx
index 328f058..3cf9ab7 100644
--- a/src/pages/ideas/index.jsx
+++ b/src/pages/ideas/index.jsx
@@ -46,16 +46,18 @@ export default function Ideas({ articles }) {
               ))}
             </div>
           </div>
-          <div className="mt-16 text-center">
-            <Link
-              className="group order-2 mx-auto items-center overflow-hidden rounded-lg bg-zinc-800 px-8 py-3 text-white focus:outline-none dark:bg-white dark:text-black"
-              href="/ideas/2023"
-            >
-              <span className="text-center font-mono font-semibold">
-                View 2023 Idea List
-              </span>
-            </Link>
-          </div>
+         <div className="mt-16 text-center">
+  <Link
+    className="group order-2 mx-auto items-center overflow-hidden rounded-lg bg-zinc-800 px-8 py-3 text-white focus:outline-none dark:bg-white dark:text-black transition-transform duration-300 hover:scale-105"
+    href="/ideas/2023"
+  >
+    <span className="relative text-center font-mono font-semibold transition-transform duration-300 group-hover:translate-y-[-2px] group-hover:tracking-wider">
+      View 2023 Idea List
+    </span>
+  </Link>
+</div>
+
+
         </Container.Inner>
       </Container>
     </>

From 6b379be03d0e9f83bf7cc10b915fa05ba9e08518 Mon Sep 17 00:00:00 2001
From: Shravani <shravanichendwankar@gmail.com>
Date: Fri, 24 Jan 2025 19:59:14 +0530
Subject: [PATCH 6/6] Responsive Layout for Project Cards with Flexbox

---
 src/components/Banner.jsx | 2 +-
 src/pages/index.jsx       | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Banner.jsx b/src/components/Banner.jsx
index 7f6d99b..31bb6da 100644
--- a/src/components/Banner.jsx
+++ b/src/components/Banner.jsx
@@ -26,7 +26,7 @@ export function Banner() {
             </p>
             <div className="mt-5">
               <Link href="/apply" legacyBehavior>
-                <a className="group relative inline-flex items-center overflow-hidden rounded-lg bg-white px-8 py-3 font-mono font-semibold text-black transition-all duration-300 hover:bg-gradient-to-r hover:from-[#00843D] hover:to-green-500 hover:text-white focus:outline-none dark:bg-black dark:text-white dark:hover:from-green-500 dark:hover:to-blue-500">
+                <a className="group relative inline-flex items-center overflow-hidden rounded-lg bg-white px-8 py-3 font-mono font-semibold text-black transition-all duration-300 hover:bg-gradient-to-r hover:from-[#00843D] hover:to-green-500 hover:text-white focus:outline-none dark:bg-black dark:text-white dark:hover:from-green-500 dark:hover:to-green-500">
                   <span className="absolute inset-0 translate-x-full bg-[#FED41E] transition-transform duration-500 ease-out group-hover:translate-x-0 dark:bg-green-500"></span>
                   <span className="relative z-10">
                     Apply to GSoC with AOSSIE
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index 2193d69..b35550a 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -144,7 +144,7 @@ export default function Home() {
           </div>
           <div className="mt-10 flex flex-col items-center gap-6 sm:flex-row sm:justify-evenly sm:gap-0">
             <Container.Inner>
-              <div className="grid grid-cols-1 gap-x-12 gap-y-16 sm:grid-cols-2 lg:grid-cols-3">
+              <div className="flex flex-wrap gap-x-8 items-center justify-evenly gap-y-16 sm:flex-wrap lg:flex-row">
                 {randomProjects.map((project) => (
                   <span key={project.name}>
                     <CardEffect