Skip to content

Commit

Permalink
Merge pull request #33 from Bloceducare/development
Browse files Browse the repository at this point in the history
  • Loading branch information
codeWhizperer authored Aug 23, 2023
2 parents 5545eb9 + c353cea commit c7e15b1
Show file tree
Hide file tree
Showing 10 changed files with 878 additions and 409 deletions.
4 changes: 2 additions & 2 deletions components/AboveFold.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,13 +19,13 @@ const AboveFold = () => {
<button className="border-b-4 border-[#122C47]">
<Link href="#"> Home </Link>
</button>
<a
{/* <a
href="https://drive.google.com/file/d/1klY_-Rgec-hwlsb91ED9zzeA2jMOmZvK/view"
target="_blank"
>
{" "}
Sponsor{" "}
</a>
</a> */}
<Link href="/apply/registration">Register </Link>
</nav>

Expand Down
76 changes: 76 additions & 0 deletions components/Gallery.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
const Gallery = () => {

return (
<>
<div className="h-screen flex items-center bg-top bg-no-repeat bg-[url('../images/web3lagos.jpg')] h-[calc(100vh-4rem)] bg-cover ">
<div className="p-4 md:p-12 lg:p-12">
<div className="bg-transparent text-gray-200">
<div className="text-3xl md:text-6xl lg:text-6xl font-bold leading-[50px] md:leading-[90px] lg:leading-[90px]">
<h2>Our</h2>
<h2>Success Story;</h2>
</div>
<div>
<div className="text-2xl mt-2">
<p>Check gallery from the previous event</p>
</div>
<div className="flex gap-4 mt-7 items-center">
<div className="bg-white rounded-full flex items-center justify-center w-8 h-8 md:w-16 md:h-16 lg:w-16 lg:h-16">
<img src="/right-arrow.png" alt="right arrow" width="30px" />
</div>
<div className="text-2xl md:text-3xl lg:text-3xl ">
<p>
Day 1:{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://photos.app.goo.gl/q9LVHsE9un57Kt1d8"
>
Link Here
</a>
</p>
</div>
</div>
<div className="flex gap-4 mt-7 items-center">
<div className="bg-white rounded-full flex items-center justify-center w-8 h-8 md:w-16 md:h-16 lg:w-16 lg:h-16">
<img src="/right-arrow.png" alt="right arrow" width="30px" />
</div>
<div className="text-2xl md:text-3xl lg:text-3xl">
<p>
Day 2:{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://photos.app.goo.gl/RbwmBsbjJoUq4nTm6"
>
Link Here
</a>
</p>
</div>
</div>

<div className="flex gap-4 mt-7 items-center">
<div className="bg-white rounded-full flex items-center justify-center w-8 h-8 md:w-16 md:h-16 lg:w-16 lg:h-16">
<img src="/right-arrow.png" alt="right arrow" width="30px" />
</div>
<div className="text-2xl md:text-3xl lg:text-3xl">
<p>
Day 3:{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://photos.app.goo.gl/GDmtPM991g56svZs5"
>
Link Here
</a>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</>
);
};

export default Gallery;
253 changes: 131 additions & 122 deletions components/Schedule.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,67 @@
// import { schedule } from "data";
// import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
// import { IScheduleItem } from "types";

// const SheduleItem = ({ time, speaker, topic }: IScheduleItem) => {
// return (
// <div className="content">
// <div className="individualEvent1">
// <div className="time">
// <p>{time}</p>
// </div>
// <div className="title">
// <p>{topic}</p>
// </div>
// </div>
// <div className="presenter">
// {!!speaker && (
// <p className="nameTitle">
// by: <span className="name">{speaker}</span>
// </p>
// )}
// </div>
// </div>
// );
// };


// const Schedule = () => {
// const thur = schedule.thur.item.map((item) => <SheduleItem {...item} />);
// const fri = schedule.fri.item.map((item) => <SheduleItem {...item} />);
// const sat = schedule.sat.item.map((item) => <SheduleItem {...item} />);

// return (
// <>

// <div className="max-w-6xl mx-auto mt-16 ">
// <div className="mx-4">
// <h3 className="text-3xl text-white">Outline of Event</h3>
// <Tabs>
// <TabList>
// <Tab>{schedule.thur.title}</Tab>
// <Tab>{schedule.fri.title}</Tab>
// <Tab>{schedule.sat.title}</Tab>
// </TabList>

// <TabPanel>
// <div className="events" id="thursday">
// {thur}
// </div>
// </TabPanel>
// <TabPanel>{fri}</TabPanel>
// <TabPanel>{sat}</TabPanel>
// </Tabs>
// </div>
// </div>
// </>
// );
// };

// export default Schedule;


import React, { useState } from "react";
import { schedule } from "data";
import Link from "next/link";
import { Tab, Tabs, TabList, TabPanel } from "react-tabs";
import { IScheduleItem } from "types";

Expand All @@ -26,139 +88,86 @@ const SheduleItem = ({ time, speaker, topic }: IScheduleItem) => {
};

const Schedule = () => {
// const thur = schedule.thur.item.map((item) => <SheduleItem {...item} />);
// const fri = schedule.fri.item.map((item) => <SheduleItem {...item} />);
// const sat = schedule.sat.item.map((item) => <SheduleItem {...item} />);
const [hallIndex, setHallIndex] = useState(0); // 0 for Hall1, 1 for Hall2

const thurHall1 = schedule.thur.hall1.item.map((item) => (
<SheduleItem {...item} />
));
const thurHall2 = schedule.thur.hall2.item.map((item) => (
<SheduleItem {...item} />
));
const friHall1 = schedule.fri.hall1.item.map((item) => (
<SheduleItem {...item} />
));
const friHall2 = schedule.fri.hall2.item.map((item) => (
<SheduleItem {...item} />
));
const sat = schedule.sat.item.map((item) => <SheduleItem {...item} />);

return (
<>
{/* <div className="bg-[#122C47] "> */}
<div className="h-screen flex items-center bg-top bg-no-repeat bg-[url('../images/web3lagos.jpg')] h-[calc(100vh-4rem)] bg-cover ">
<div className="p-4 md:p-12 lg:p-12">
<div className="bg-transparent text-gray-200">
<div className="text-3xl md:text-6xl lg:text-6xl font-bold leading-[50px] md:leading-[90px] lg:leading-[90px]">
<h2>Our</h2>
<h2>Success Story;</h2>
</div>
<div>
<div className="text-2xl mt-2">
<p>Check gallery from the previous event</p>
</div>
<div className="flex gap-4 mt-7 items-center">
<div className="bg-white rounded-full flex items-center justify-center w-8 h-8 md:w-16 md:h-16 lg:w-16 lg:h-16">
<img src="/right-arrow.png" alt="right arrow" width="30px" />
</div>
<div className="text-2xl md:text-3xl lg:text-3xl ">
<p>
Day 1:{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://photos.app.goo.gl/q9LVHsE9un57Kt1d8"
>
Link Here
</a>
</p>
</div>
</div>
<div className="flex gap-4 mt-7 items-center">
<div className="bg-white rounded-full flex items-center justify-center w-8 h-8 md:w-16 md:h-16 lg:w-16 lg:h-16">
<img src="/right-arrow.png" alt="right arrow" width="30px" />
<div className="max-w-6xl mx-auto mt-16 ">
<div className="mx-4">
<h3 className="text-3xl text-white">Outline of Event</h3>
<Tabs>
<TabList>
<Tab>{schedule.thur.title} - Hall 1</Tab>
<Tab>{schedule.thur.title} - Hall 2</Tab>
<Tab>{schedule.fri.title} - Hall 1</Tab>
<Tab>{schedule.fri.title} - Hall 2</Tab>
<Tab>{schedule.sat.title}</Tab>
</TabList>

<TabPanel>
{hallIndex === 0 ? (
<div className="events" id="thursday">
{thurHall1}
</div>
<div className="text-2xl md:text-3xl lg:text-3xl">
<p>
Day 2:{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://photos.app.goo.gl/RbwmBsbjJoUq4nTm6"
>
Link Here
</a>
</p>
) : (
<div className="events" id="thursday">
{thurHall2}
</div>
</div>

<div className="flex gap-4 mt-7 items-center">
<div className="bg-white rounded-full flex items-center justify-center w-8 h-8 md:w-16 md:h-16 lg:w-16 lg:h-16">
<img src="/right-arrow.png" alt="right arrow" width="30px" />
)}
</TabPanel>
<TabPanel>
{hallIndex === 0 ? (
<div className="events" id="thursday">
{thurHall2}
</div>
<div className="text-2xl md:text-3xl lg:text-3xl">
<p>
Day 3:{" "}
<a
target="_blank"
rel="noopener noreferrer"
href="https://photos.app.goo.gl/GDmtPM991g56svZs5"
>
Link Here
</a>
</p>
) : (
<div className="events" id="thursday">
{thurHall1}
</div>
</div>
</div>
</div>
)}
</TabPanel>
<TabPanel>{hallIndex === 0 ? friHall1 : friHall2}</TabPanel>
<TabPanel>{hallIndex === 0 ? friHall2 : friHall1}</TabPanel>
<TabPanel>{sat}</TabPanel>
</Tabs>
{/* <div className="text-white mt-4">
Toggle between halls: */}
{/* <button
onClick={() => setHallIndex(0)}
className={`mx-2 ${
hallIndex === 0 ? "text-blue-500" : "text-gray-500"
}`}
>
Hall 1
</button> */}
{/* <button
onClick={() => setHallIndex(1)}
className={`mx-2 ${
hallIndex === 1 ? "text-blue-500" : "text-gray-500"
}`}
>
Hall 2
</button> */}
{/* </div> */}
</div>
</div>
{/* <div className="mx-auto w-[1340px]">
<div className="mx-4">
<h3 className="text-3xl text-white text-center pt-36 pb-16">
Order of Event
</h3>
<Tabs>
<TabList>
<Tab>{schedule.thur.title}</Tab>
<Tab>{schedule.fri.title}</Tab>
<Tab>{schedule.sat.title}</Tab>
</TabList>
<TabPanel>
<div className="events" id="thursday">
{thur}
</div>
</TabPanel>
<TabPanel>{fri}</TabPanel>
<TabPanel>{sat}</TabPanel>
</Tabs>
</div>
</div> */}
{/* </div> */}
</>
);
};

export default Schedule;

// const Schedule = () => {
// const thur = schedule.thur.item.map((item) => <SheduleItem {...item} />);
// const fri = schedule.fri.item.map((item) => <SheduleItem {...item} />);
// const sat = schedule.sat.item.map((item) => <SheduleItem {...item} />);

// return (
// <>

// <div className="max-w-6xl mx-auto mt-16 ">
// <div className="mx-4">
// <h3 className="text-3xl text-white">Outline of Event</h3>
// <Tabs>
// <TabList>
// <Tab>{schedule.thur.title}</Tab>
// <Tab>{schedule.fri.title}</Tab>
// <Tab>{schedule.sat.title}</Tab>
// </TabList>

// <TabPanel>
// <div className="events" id="thursday">
// {thur}
// </div>
// </TabPanel>
// <TabPanel>{fri}</TabPanel>
// <TabPanel>{sat}</TabPanel>
// </Tabs>
// </div>
// </div>
// </>
// );
// };

// export default Schedule;
Loading

0 comments on commit c7e15b1

Please sign in to comment.