From e636ce5cf91062bdfd35f0a4c4c00c1dbd14993d Mon Sep 17 00:00:00 2001
From: Devadutt <devaduttmohancs@gmail.com>
Date: Thu, 28 Nov 2024 17:37:11 +0530
Subject: [PATCH] info change and other changes

---
 src/app/page.js                | 51 +++++++++++++++++++---------------
 src/components/About/About.css |  8 ++++++
 src/components/About/About.jsx |  4 +--
 src/constants/index.js         |  2 +-
 src/styles/loading.css         |  1 +
 5 files changed, 41 insertions(+), 25 deletions(-)

diff --git a/src/app/page.js b/src/app/page.js
index 2c93613..ac61e5a 100644
--- a/src/app/page.js
+++ b/src/app/page.js
@@ -16,6 +16,7 @@ import Contact from "../components/Contact/ContactPage";
 import Intro from "../components/Intro";
 import TimelineSection from "../components/Timeline/Timeline";
 import Loading from "./loading";
+import {AnimatePresence, motion} from "framer-motion"
 
 export default function Home() {
   const [isLoading, setIsLoading] = useState(true);
@@ -35,30 +36,36 @@ export default function Home() {
     };
   }, []);
 
-  if (isLoading) {
-    return <Loading />;
-  }
 
-  return (
-    <div className="text-white">
-      <Navbar />
-      <BlobAnimation />
 
-      {/* <CountdownTimer
-        targetDate={new Date("December 21, 2024 09:30:00").getTime()}
-      /> */}
 
-      {/* <Intro /> */}
-      <About />
-      <WhyParticipate />
-      <Prizes />
-      <Partners />
-      {/* <Highlights /> */}
-      <TimelineSection />
-      {/* <AccordionImageGallery /> */}
-      <FAQ />
-      <Contact />
-      <Footer />
-    </div>
+  return (
+    <AnimatePresence >
+      {isLoading ? (
+        <motion.div
+          key="loading-screen"
+          initial={{ opacity: 0 }}
+          animate={{ opacity: 1 }}
+          exit={{ opacity: 0.5 }}
+          transition={{ duration: 0.05, ease: 'easeIn' }}
+          className="h-screen w-screen overflow-hidden"
+        >
+          <Loading />
+        </motion.div>
+      ) : (
+        <div className="text-white">
+          <Navbar />
+          <BlobAnimation />
+          <About />
+          <WhyParticipate />
+          <Prizes />
+          <Partners />
+          <TimelineSection />
+          <FAQ />
+          <Contact />
+          <Footer />
+        </div>
+      )}
+    </AnimatePresence>
   );
 }
diff --git a/src/components/About/About.css b/src/components/About/About.css
index 45f779a..2369451 100644
--- a/src/components/About/About.css
+++ b/src/components/About/About.css
@@ -208,6 +208,14 @@
   width: 100vw;
 }
 
+.bottom-rightt{
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  width: 100vw;
+  height: 100vh;
+}
+
 .circle1 {
   position: absolute;
   bottom: -450px;
diff --git a/src/components/About/About.jsx b/src/components/About/About.jsx
index 129dd36..2111472 100644
--- a/src/components/About/About.jsx
+++ b/src/components/About/About.jsx
@@ -10,12 +10,12 @@ import circle3 from "../../assets/backgrounds/about/circle3.png";
 
 const About = () => {
   return (
-    <div className="relative overflow-hidden">
+    <div className="relative">
       <div className="absolute bg-gradient-to-b from-[#0a0a0a] from-10% to-transparent z-50 bg-no-repeat right-0 left-0 top-0 min-h-32" />
       <div id="about" className="about-container pt-[80px]">
         <Image className="pointer-events-none top-left" src={top_left} />
         <Image
-          className="pointer-events-none bottom-right z-0"
+          className="pointer-events-none bottom-rightt z-0"
           src={bottom_right}
         />
         <Image className="pointer-events-none circle1" src={circle1} />
diff --git a/src/constants/index.js b/src/constants/index.js
index 5459126..78d52e7 100644
--- a/src/constants/index.js
+++ b/src/constants/index.js
@@ -22,6 +22,6 @@ export const TimelineData = [
   {
     date: "22nd Decemeber",
     title: "Hackathon - Day 2",
-    para: "Hackathon Concludes and Closing Ceremony",
+    para: "Hackathon Concludes and Closing Ceremony at 12 pm",
   },
 ];
diff --git a/src/styles/loading.css b/src/styles/loading.css
index 9067642..d1dfa6b 100644
--- a/src/styles/loading.css
+++ b/src/styles/loading.css
@@ -10,6 +10,7 @@
     width: 100%;
     height: 100%;
     text-align: center;
+    overflow: hidden;
   }
   .landingbody .vertical-centered-box:after {
     content: '';