minor update

ENGINEER-NITK · Sep 17, 2023 · e2cde0c · e2cde0c
1 parent 9fb972b
commit e2cde0c
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 9 deletions.
diff --git a/src/components/common/boxcontent.js b/src/components/common/boxcontent.js
@@ -2,7 +2,7 @@ import { Box, Typography } from "@mui/material";
 import React from "react";
 import Spacer from "../Spacer";
 
-const BoxContent = ({ title, description, width = "100%", mode = "dark" }) => {
+const BoxContent = ({ title, description, description2, width = "100%", mode = "dark", key }) => {
   const color = mode === "dark" ? "white" : "black";
   const descriptionColor = mode === "dark" ? "textSecondary" : "grey";
   return (
@@ -38,8 +38,9 @@ const BoxContent = ({ title, description, width = "100%", mode = "dark" }) => {
         fontFamily="typography.fontFamily"
         fontSize="14px"
         lineHeight="18px"
+
       >
-        <span style={{backgroundColor: 'rgba(23 18 24 / 70%)'}}>Venue: CIDS 5.30 PM Onwards</span>
+        <span style={{backgroundColor: 'rgba(23 18 24 / 70%)'}}>{description2}</span>
       </Typography>
     </Box>
   );

diff --git a/src/components/home/about.js b/src/components/home/about.js
@@ -63,7 +63,7 @@ const About = () => {
       scrollTrigger: {
         trigger: ".trigger",
         start: "top top",
-        end: "+=300",//this was 2000 intially, changed to get it right for 1 card
+        end: "+=500",//this was 2000 intially, changed to get it right for 1 card
         pin: ".trigger",
         pinSpacing: true,
         scrub: 1,
@@ -90,10 +90,12 @@ const About = () => {
       <Spacer size="sm" />
       <Box className='trigger'>
       <Grid container spacing={1.5}>
-        <Grid item xs={12} md={5}>
+        <Grid item xs={14} md={5}>
           <Box   ref={eventsRef}>
             <Box sx={{height: '100vh'}}>
-              <PairOfEvents />
+              <PairOfEvents key = {true} />
+              <DummyPairOfEvents />
+              <DummyPairOfEvents />
             </Box>
           </Box>
         </Grid>
@@ -103,7 +105,7 @@ const About = () => {
               borderRadius: '18px',
               boxShadow: '0px 0px 15px rgba(0,0,0,0.2)', // optional shadow for a bit of depth
               border: '1px solid #ccc' // a light border
-            }} src="https://map.proxi.co/r/KDTnimhlng4EEBF2uY71" allow="geolocation; clipboard-write"  width="100%" height="100%"  allowFullScreen></iframe>
+            }} src="https://map.proxi.co/r/2HgoqtF9Ep_1pZvrvUW7" allow="geolocation; clipboard-write"  width="100%" height="100%"  allowFullScreen></iframe>
           </GradientBox>
         </Grid>
       </Grid>
@@ -112,15 +114,32 @@ const About = () => {
   );
 };
 
-const PairOfEvents = () => {
+const PairOfEvents = (key) => {
   return (
-    <Box my={1} mt={15}>
+    <Box my={1}>
     <Stack direction="column" >
       <GradientBox img="https://res.cloudinary.com/det9aw4gh/image/upload/v1694977732/FlashMob.jpg">
-        <BoxContent
+        <BoxContent key={key}
           width="65%"
           title="Flash Mob"
           description="Date: 19th October 2023"
+          description2="Venue: CIDS 3.45 PM Onwards"
+          />
+      </GradientBox>
+    </Stack>
+    </Box>
+  )
+}
+const DummyPairOfEvents = () => {
+  return (
+    <Box my={1}>
+    <Stack direction="column" >
+      <GradientBox img="">
+        <BoxContent
+          width="65%"
+          title="Comming Sooon"
+          description="SCHEDULE FOR ALL EVENTS WILL BE UPDATED SOON"
+          key={false}
         />
       </GradientBox>
     </Stack>