ups

components/NavBar.tsx

@@ -7,7 +7,7 @@ const Links = [
   { href: '/', label: 'Home' },
   { href: '/about', label: 'About' },
   { href: '/committee', label: 'Committee' },
-  { href: '/speakers', label : 'Speakers'},
+  { href: '/speakers', label: 'Speakers' },
   { href: '/papers', label: 'Call for Papers' },
   { href: '/awards', label: 'Awards' },
   { href: '/registration', label: 'Registration' },
@@ -119,6 +119,9 @@ const NavBar = () => {
       </div>
       <Marquee className="marquee bg-blue-300">
         <div className="content1">
+          <span className="ml-80 font-bold text-yellow-300">
+            Registrations are closed{' '}
+          </span>{' '}
           <span className="ml-80 font-bold text-yellow-300">
             Notification of Acceptance
           </span>{' '}

components/TimeLine.tsx

@@ -1,6 +1,6 @@
-import { Text, Timeline } from '@mantine/core';
-import { AnnotationIcon } from '@heroicons/react/solid';
-import { useEffect, useState } from 'react';
+import { Text, Timeline } from '@mantine/core'
+import { AnnotationIcon } from '@heroicons/react/solid'
+import { useEffect, useState } from 'react'
 const data = [
   {
     label: 'Submission of Full-length Manuscript (opens from)',
@@ -9,25 +9,23 @@ const data = [
   {
     label: 'Last date to submit Full-length Manuscript',
     date: '14th August 2024',
-
   },
   {
     label: 'Notification of Acceptance',
     oldDate: '28th August 2024',
-    newDate:'7th September 2024',
+    newDate: '7th September 2024',
   },
   {
     label: 'Early Bird Registration',
-    date:'Before 18th September 2024',
+    date: 'Before 18th September 2024',
   },
-    {
+  {
     label: 'Last Date for Registration',
-    date: '3rd October 2024',
-
+    oldDate: '3rd October 2024',
   },
   {
     label: 'Submission of Camera-ready Manuscript and Copyright Form',
-    date:'7th October 2024',
+    date: '10th October 2024',
   },
 
   {
@@ -38,29 +36,27 @@ const data = [
     label: 'Conference Dates',
     date: '8th and 9th November 2024',
   },
-];
+]
 
 export default function CustomTimeLine() {
-  const [isVisible, setIsVisible] = useState(false);
+  const [isVisible, setIsVisible] = useState(false)
 
   useEffect(() => {
     const handleScroll = () => {
       if (window.scrollY > 100) {
-        setIsVisible(true);
+        setIsVisible(true)
       } else {
-        setIsVisible(false);
+        setIsVisible(false)
       }
-    };
+    }
 
-    window.addEventListener('scroll', handleScroll);
-    return () => window.removeEventListener('scroll', handleScroll);
-  }, []);
+    window.addEventListener('scroll', handleScroll)
+    return () => window.removeEventListener('scroll', handleScroll)
+  }, [])
 
   return (
     <div className={`timeline-container ${isVisible ? 'fade-in' : ''}`}>
-      <h1 className="timeline-title">
-        Important Dates
-      </h1>
+      <h1 className="timeline-title">Important Dates</h1>
       <Timeline active={0} bulletSize={28} lineWidth={4} color="teal">
         {data.map((item, index) => (
           <Timeline.Item
@@ -72,9 +68,12 @@ export default function CustomTimeLine() {
             <Text size="lg" mt={2} className="timeline-item-text">
               {item.oldDate ? (
                 <>
-                  <span className="line-through text-gray-500">{item.oldDate}</span>
-                  {' '}
-                  <span className="font-bold text-gray-900">{item.newDate}</span>
+                  <span className="text-gray-500 line-through">
+                    {item.oldDate}
+                  </span>{' '}
+                  <span className="font-bold text-gray-900">
+                    {item.newDate}
+                  </span>
                 </>
               ) : (
                 item.date
@@ -84,5 +83,5 @@ export default function CustomTimeLine() {
         ))}
       </Timeline>
     </div>
-  );
+  )
 }