From fbad3b0e5113fc39bc4472bb3af1b770022e72ab Mon Sep 17 00:00:00 2001
From: "web@ppanel" <web@ppanel.dev>
Date: Fri, 14 Mar 2025 23:21:17 +0700
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(timeline):=20Simplify=20timeli?=
 =?UTF-8?q?ne=20component=20layout=20and=20remove=20commented-out=20code?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/ui/src/components/timeline.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/ui/src/components/timeline.tsx b/packages/ui/src/components/timeline.tsx
index 7d761d9..bdd0f66 100644
--- a/packages/ui/src/components/timeline.tsx
+++ b/packages/ui/src/components/timeline.tsx
@@ -28,25 +28,25 @@ export const Timeline = ({ data }: { data: TimelineEntry[] }) => {
   const opacityTransform = useTransform(scrollYProgress, [0, 0.1], [0, 1]);
 
   return (
-    <div className='w-full bg-white font-sans md:px-10 dark:bg-neutral-950' ref={containerRef}>
-      <div className='mx-auto max-w-7xl px-4 py-20 md:px-8 lg:px-10'>
-        <h2 className='mb-4 max-w-4xl text-lg text-black md:text-4xl dark:text-white'>
+    <div className='w-full font-sans md:px-10' ref={containerRef}>
+      <div className='mx-auto max-w-7xl px-4 py-10 md:px-8 lg:px-10'>
+        {/* <h2 className='mb-4 max-w-4xl text-lg text-black md:text-4xl dark:text-white'>
           Changelog from my journey
         </h2>
         <p className='max-w-sm text-sm text-neutral-700 md:text-base dark:text-neutral-300'>
           I&apos;ve been working on Aceternity for the past 2 years. Here&apos;s a timeline of my
           journey.
-        </p>
+        </p> */}
       </div>
 
       <div ref={ref} className='relative mx-auto max-w-7xl pb-20'>
         {data.map((item, index) => (
           <div key={index} className='flex justify-start pt-10 md:gap-10 md:pt-40'>
-            <div className='sticky top-40 z-40 flex max-w-xs flex-col items-center self-start md:w-full md:flex-row lg:max-w-sm'>
+            <div className='sticky top-40 z-40 flex max-w-xs flex-col items-center self-start whitespace-nowrap md:w-auto md:flex-row lg:max-w-sm'>
               <div className='absolute left-3 flex h-10 w-10 items-center justify-center rounded-full bg-white md:left-3 dark:bg-black'>
                 <div className='h-4 w-4 rounded-full border border-neutral-300 bg-neutral-200 p-2 dark:border-neutral-700 dark:bg-neutral-800' />
               </div>
-              <h3 className='hidden text-xl font-bold text-neutral-500 md:block md:pl-20 md:text-5xl dark:text-neutral-500'>
+              <h3 className='hidden text-xl font-bold text-neutral-500 md:block md:pl-20 md:text-xl dark:text-neutral-500'>
                 {item.title}
               </h3>
             </div>