From a60923a4d3c3c538afcaad8f6eb972efef795a85 Mon Sep 17 00:00:00 2001
From: Subhajit Ghosh <subhajitstd07@gmail.com>
Date: Sun, 17 Dec 2023 07:29:51 +0000
Subject: [PATCH 1/5] Replaced all the css into tailwind css on TimelineEvent
 component

---
 components/Timeline/TimelineEvent/TimelineEvent.js            | 4 ++--
 .../__tests__/__snapshots__/TimelineEvent.test.js.snap        | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/components/Timeline/TimelineEvent/TimelineEvent.js b/components/Timeline/TimelineEvent/TimelineEvent.js
index 0e6e2fd0a..817ebf81b 100644
--- a/components/Timeline/TimelineEvent/TimelineEvent.js
+++ b/components/Timeline/TimelineEvent/TimelineEvent.js
@@ -8,8 +8,8 @@ TimelineEvent.propTypes = {
 
 function TimelineEvent({ content, title }) {
   return (
-    <div className={styles.eventContainer}>
-      <h4 className={styles.eventTitle}>{title}</h4>
+    <div className="ml-8 mr-0 border-1 border-solid border-[#c5c5c5] p-5 rounded-md">
+      <h4 className="uppercase md:text-2xl">{title}</h4>
 
       <div className={styles.eventContent}>{content}</div>
     </div>
diff --git a/components/Timeline/TimelineEvent/__tests__/__snapshots__/TimelineEvent.test.js.snap b/components/Timeline/TimelineEvent/__tests__/__snapshots__/TimelineEvent.test.js.snap
index 713c58fc2..c5bf70d38 100644
--- a/components/Timeline/TimelineEvent/__tests__/__snapshots__/TimelineEvent.test.js.snap
+++ b/components/Timeline/TimelineEvent/__tests__/__snapshots__/TimelineEvent.test.js.snap
@@ -2,10 +2,10 @@
 
 exports[`TimelineEvent should render with required props 1`] = `
 <div
-  className="eventContainer"
+  className="ml-8 mr-0 border-1 border-solid border-[#c5c5c5] p-5 rounded-md"
 >
   <h4
-    className="eventTitle"
+    className="uppercase md:text-2xl"
   >
     test title
   </h4>

From 592604aeb6ecc9e2f14be6d1c7b9b54d68fcf8de Mon Sep 17 00:00:00 2001
From: Subhajit Ghosh <subhajitstd07@gmail.com>
Date: Tue, 19 Dec 2023 10:52:15 +0000
Subject: [PATCH 2/5] Replaced all the css into tailwind css on TimelineEvent
 component

---
 components/Timeline/TimelineEvent/TimelineEvent.js            | 4 ++--
 .../__tests__/__snapshots__/TimelineEvent.test.js.snap        | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/components/Timeline/TimelineEvent/TimelineEvent.js b/components/Timeline/TimelineEvent/TimelineEvent.js
index 817ebf81b..be69d71d8 100644
--- a/components/Timeline/TimelineEvent/TimelineEvent.js
+++ b/components/Timeline/TimelineEvent/TimelineEvent.js
@@ -8,8 +8,8 @@ TimelineEvent.propTypes = {
 
 function TimelineEvent({ content, title }) {
   return (
-    <div className="ml-8 mr-0 border-1 border-solid border-[#c5c5c5] p-5 rounded-md">
-      <h4 className="uppercase md:text-2xl">{title}</h4>
+    <div className="mb-8 border-1 border-solid border-[#c5c5c5] p-5 rounded-md">
+      <h4 className="capitalize md:text-2xl">{title}</h4>
 
       <div className={styles.eventContent}>{content}</div>
     </div>
diff --git a/components/Timeline/TimelineEvent/__tests__/__snapshots__/TimelineEvent.test.js.snap b/components/Timeline/TimelineEvent/__tests__/__snapshots__/TimelineEvent.test.js.snap
index c5bf70d38..ace8660cb 100644
--- a/components/Timeline/TimelineEvent/__tests__/__snapshots__/TimelineEvent.test.js.snap
+++ b/components/Timeline/TimelineEvent/__tests__/__snapshots__/TimelineEvent.test.js.snap
@@ -2,10 +2,10 @@
 
 exports[`TimelineEvent should render with required props 1`] = `
 <div
-  className="ml-8 mr-0 border-1 border-solid border-[#c5c5c5] p-5 rounded-md"
+  className="mb-8 border-1 border-solid border-[#c5c5c5] p-5 rounded-md"
 >
   <h4
-    className="uppercase md:text-2xl"
+    className="capitalize md:text-2xl"
   >
     test title
   </h4>

From 0b2c6a87eb9f5676131f150db0e13a29e675f2cd Mon Sep 17 00:00:00 2001
From: Subhajit Ghosh <subhajitstd07@gmail.com>
Date: Wed, 20 Dec 2023 15:23:20 +0000
Subject: [PATCH 3/5] Replaced all the css into tailwind css on TimelineNav
 component

---
 .../Timeline/TimelineNav/TimelineNav.js       | 14 ++++++++-----
 .../__snapshots__/TimelineNav.test.js.snap    | 20 +++++++++----------
 2 files changed, 19 insertions(+), 15 deletions(-)

diff --git a/components/Timeline/TimelineNav/TimelineNav.js b/components/Timeline/TimelineNav/TimelineNav.js
index 2c97dd13f..cacd6dce8 100644
--- a/components/Timeline/TimelineNav/TimelineNav.js
+++ b/components/Timeline/TimelineNav/TimelineNav.js
@@ -1,18 +1,22 @@
 import { Link } from 'react-scroll';
 import historyData from '../historyData';
-import styles from './TimelineNav.module.css';
 
 const TimelineNav = () => {
   return (
-    <section className={styles.timelineNav}>
-      <nav className={styles.timelineNavLinksContainer}>
+    <section className="py-0 px-16 sm:p-0">
+      <nav className="flex justify-around">
         {Object.keys(historyData).map(year => (
-          <Link key={year} to={`event-${year}`} smooth className={styles.timelineNavLink}>
+          <Link
+            key={year}
+            to={`event-${year}`}
+            smooth
+            className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
+          >
             {year}
           </Link>
         ))}
       </nav>
-      <div className={styles.timelineNavSeperator} />
+      <div className="mt-4 bg-[#3d7d7d7] h-1" />
     </section>
   );
 };
diff --git a/components/Timeline/TimelineNav/__tests__/__snapshots__/TimelineNav.test.js.snap b/components/Timeline/TimelineNav/__tests__/__snapshots__/TimelineNav.test.js.snap
index 0c7b15311..564a7526a 100644
--- a/components/Timeline/TimelineNav/__tests__/__snapshots__/TimelineNav.test.js.snap
+++ b/components/Timeline/TimelineNav/__tests__/__snapshots__/TimelineNav.test.js.snap
@@ -2,13 +2,13 @@
 
 exports[`TimelineNav should render with no props passed passed 1`] = `
 <section
-  className="timelineNav"
+  className="py-0 px-16 sm:p-0"
 >
   <nav
-    className="timelineNavLinksContainer"
+    className="flex justify-around"
   >
     <Link
-      className="timelineNavLink"
+      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2011"
@@ -16,7 +16,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2011
     </Link>
     <Link
-      className="timelineNavLink"
+      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2013"
@@ -24,7 +24,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2013
     </Link>
     <Link
-      className="timelineNavLink"
+      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2014"
@@ -32,7 +32,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2014
     </Link>
     <Link
-      className="timelineNavLink"
+      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2015"
@@ -40,7 +40,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2015
     </Link>
     <Link
-      className="timelineNavLink"
+      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2019"
@@ -48,7 +48,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2019
     </Link>
     <Link
-      className="timelineNavLink"
+      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2021"
@@ -56,7 +56,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2021
     </Link>
     <Link
-      className="timelineNavLink"
+      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2023"
@@ -65,7 +65,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
     </Link>
   </nav>
   <div
-    className="timelineNavSeperator"
+    className="mt-4 bg-[#3d7d7d7] h-1"
   />
 </section>
 `;

From f210215885f45829a44d7de10401554557c58508 Mon Sep 17 00:00:00 2001
From: Subhajit Ghosh <subhajitstd07@gmail.com>
Date: Wed, 20 Dec 2023 15:27:32 +0000
Subject: [PATCH 4/5] Replaced all the css into tailwind css on TimelineNav
 component

---
 .../TimelineNav/TimelineNav.module.css        | 32 -------------------
 1 file changed, 32 deletions(-)

diff --git a/components/Timeline/TimelineNav/TimelineNav.module.css b/components/Timeline/TimelineNav/TimelineNav.module.css
index e21f4f6d1..4e4186d85 100644
--- a/components/Timeline/TimelineNav/TimelineNav.module.css
+++ b/components/Timeline/TimelineNav/TimelineNav.module.css
@@ -1,35 +1,3 @@
-.timelineNav {
-  padding: 0 4rem;
-}
-
-@media screen and (--small-viewport) {
-  .timelineNav {
-    padding: 0;
-  }
-}
-
-.timelineNavLinksContainer {
-  display: flex;
-  justify-content: space-around;
-}
-
-.timelineNavLink {
-  font-weight: 700;
-  font-size: 1.2rem;
-  cursor: pointer;
-  transition: transform opacity 100ms ease-in-out;
-}
-
 .timelineNavLink:not(:hover) {
   opacity: 0.6;
 }
-
-.timelineNavLink:hover {
-  transform: scale(1.1);
-}
-
-.timelineNavSeperator {
-  margin-top: 1rem;
-  background-color: #d7d7d7;
-  height: 2px;
-}

From 9bd2ecd13c5ab83765704ac9e6ee020504b241cf Mon Sep 17 00:00:00 2001
From: Subhajit Ghosh <subhajitstd07@gmail.com>
Date: Thu, 21 Dec 2023 10:18:35 +0000
Subject: [PATCH 5/5] Replaced all the css into tailwind css on TimelineNav
 component

---
 components/Timeline/TimelineNav/TimelineNav.js |  6 +++---
 .../__snapshots__/TimelineNav.test.js.snap     | 18 +++++++++---------
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/components/Timeline/TimelineNav/TimelineNav.js b/components/Timeline/TimelineNav/TimelineNav.js
index cacd6dce8..5e4566f76 100644
--- a/components/Timeline/TimelineNav/TimelineNav.js
+++ b/components/Timeline/TimelineNav/TimelineNav.js
@@ -3,20 +3,20 @@ import historyData from '../historyData';
 
 const TimelineNav = () => {
   return (
-    <section className="py-0 px-16 sm:p-0">
+    <section className="px-16 sm:p-0">
       <nav className="flex justify-around">
         {Object.keys(historyData).map(year => (
           <Link
             key={year}
             to={`event-${year}`}
             smooth
-            className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
+            className="font-bold text-xl cursor-pointer opacity-60 hover:opacity-60 transition-all duration-100 ease-in-out hover:scale-[1.1]"
           >
             {year}
           </Link>
         ))}
       </nav>
-      <div className="mt-4 bg-[#3d7d7d7] h-1" />
+      <div className="mt-4 bg-[#d7d7d7] h-1" />
     </section>
   );
 };
diff --git a/components/Timeline/TimelineNav/__tests__/__snapshots__/TimelineNav.test.js.snap b/components/Timeline/TimelineNav/__tests__/__snapshots__/TimelineNav.test.js.snap
index 564a7526a..521780288 100644
--- a/components/Timeline/TimelineNav/__tests__/__snapshots__/TimelineNav.test.js.snap
+++ b/components/Timeline/TimelineNav/__tests__/__snapshots__/TimelineNav.test.js.snap
@@ -2,13 +2,13 @@
 
 exports[`TimelineNav should render with no props passed passed 1`] = `
 <section
-  className="py-0 px-16 sm:p-0"
+  className="px-16 sm:p-0"
 >
   <nav
     className="flex justify-around"
   >
     <Link
-      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
+      className="font-bold text-xl cursor-pointer opacity-60 hover:opacity-60 transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2011"
@@ -16,7 +16,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2011
     </Link>
     <Link
-      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
+      className="font-bold text-xl cursor-pointer opacity-60 hover:opacity-60 transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2013"
@@ -24,7 +24,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2013
     </Link>
     <Link
-      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
+      className="font-bold text-xl cursor-pointer opacity-60 hover:opacity-60 transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2014"
@@ -32,7 +32,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2014
     </Link>
     <Link
-      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
+      className="font-bold text-xl cursor-pointer opacity-60 hover:opacity-60 transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2015"
@@ -40,7 +40,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2015
     </Link>
     <Link
-      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
+      className="font-bold text-xl cursor-pointer opacity-60 hover:opacity-60 transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2019"
@@ -48,7 +48,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2019
     </Link>
     <Link
-      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
+      className="font-bold text-xl cursor-pointer opacity-60 hover:opacity-60 transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2021"
@@ -56,7 +56,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
       2021
     </Link>
     <Link
-      className="font-bold text-xl cursor-pointer transition-all duration-100 ease-in-out hover:scale-[1.1]"
+      className="font-bold text-xl cursor-pointer opacity-60 hover:opacity-60 transition-all duration-100 ease-in-out hover:scale-[1.1]"
       offset={0}
       smooth={true}
       to="event-2023"
@@ -65,7 +65,7 @@ exports[`TimelineNav should render with no props passed passed 1`] = `
     </Link>
   </nav>
   <div
-    className="mt-4 bg-[#3d7d7d7] h-1"
+    className="mt-4 bg-[#d7d7d7] h-1"
   />
 </section>
 `;