Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Contact #82

Merged
merged 2 commits into from
Nov 26, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 2 additions & 8 deletions src/app/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,15 +38,9 @@ export default function Home() {

<Performers />
</div>
<div className="">
{/* <div className="">
<PreviousEdition />
{/* <div>
<h1 className="md:text-8xl mb-10 text-4xl text-center font-black px-10">
2022 Edition
</h1>
</div>
<UnsplashGrid /> */}
</div>
</div> */}
<div id="team" className="bg-transparent h-fit mt-14">
<h1 className="md:text-8xl text-4xl text-center font-black text-redTheme px-10">
The Team
Expand Down
155 changes: 89 additions & 66 deletions src/components/widget/header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,10 @@ import React from "react";
import Link from "next/link";
import NavItem from "../navbar/nav-items";
import RegisterButton from "../navbar/register-button";
import { useRouter } from "next/navigation";
import { Button } from "../ui/button";
const Nav = () => {
const router = useRouter();
gsap.registerPlugin(ScrollTrigger);

const menuToggle = useRef(null);
Expand All @@ -27,7 +30,7 @@ const Nav = () => {
x: 1,
ease: "Power2.easeInOut",
},
"start",
"start"
)
.to(".bar-2", 2, { autoAlpha: 0, stroke: "#000" }, "start")
.to(
Expand All @@ -39,7 +42,7 @@ const Nav = () => {
stroke: "#000",
ease: "Power2.easeInOut",
},
"start",
"start"
);

tl.to(".logo", { x: -300 }, "go")
Expand All @@ -59,7 +62,7 @@ const Nav = () => {
.from(
".listo",
{ duration: 0.15, x: "-50%", stagger: 0.1, opacity: 0 },
"-=0.5",
"-=0.5"
)
.from(
".social-links li",
Expand All @@ -70,7 +73,7 @@ const Nav = () => {
stagger: 0.1,
ease: "Expo.easeInOut",
},
"-=0.5",
"-=0.5"
)
.from(".hero-icon", { scale: 0, duration: 0.3 }, "end")
.from(".life", { x: 1000, duration: 0.35 }, "end");
Expand Down Expand Up @@ -98,6 +101,12 @@ const Nav = () => {
}
};

const handleRegisterClick = () => {
router.push("/register");
menuBar.reverse();
tl.reverse();
};

return (
<>
<header className="fixed z-[100] left-0 top-0 w-screen">
Expand Down Expand Up @@ -146,68 +155,82 @@ const Nav = () => {
</div>
</header>

<section className="fullpage-menu hidden fixed left-0 top-0 w-screen z-50 h-screen">
<div className="header-2 fixed left-0 top-0 w-full flex md:py-[20px] md:px-[30px] p-[30px] z-[60] justify-between items-center">
<Image
src={`${tedxsjecAssetsPrefix}/logo/blackLogo.webp`}
height={180}
width={180}
alt="logo"
// layout="fixed"
priority={true}
/>
</div>
<div className="fullpage-menu-inner flex items-center h-full px-[40px] py-[10px] md:px-[80px] md:py-[40px]">
<div className="menu-bg h-full w-full absolute left-0 top-0">
<span className="bg-white block back w-full h-[34%]"></span>
<span className="bg-white block back w-full h-[34%]"></span>
<span className="bg-white block back w-full h-[34%]"></span>
</div>
<nav className="relative z-10 flex flex-row w-full">
<div>
<ul className="main-menu mt-10">
<NavItem textOne="ABOUT" textTwo="ABOUT" onClick={() => handleClick("about")} />
<NavItem
textOne="SPEAKERS"
textTwo="SPEAKERS"
onClick={() => handleClick("speakers")}
/>
<NavItem
textOne="PERFORMERS"
textTwo="PERFORMERS"
onClick={() => handleClick("performers")}
/>
<NavItem textOne="TEAM" textTwo="TEAM" onClick={() => handleClick("team")} />
<NavItem
textOne="CONTACT"
textTwo="CONTACT"
onClick={() => handleClick("contact")}
/>
<li className="list-none listo leading-[1] font-bold text-white mt-[20px]">
<RegisterButton />
</li>
</ul>
</div>
</nav>
<div className="w-full flex flex-col items-center">
<div className="lg:self-center lg:flex hidden lg:flex-col">
<Image
className="mt-10 hero-icon"
src={`${tedxsjecAssetsPrefix}/logo/ActualLogo.PNG`}
height={550}
width={550}
alt="logo"
/>
</div>
<div className="lg:flex hidden text-nowrap text-4xl relative bottom-32 justify-center items-center text-center">
<h1 className="life uppercase font-bold text-black">
Life - Explore What&#39;s Worth Living
</h1>
</div>
</div>
</div>
</section>
</>
<section className="fullpage-menu hidden fixed left-0 top-0 w-screen z-50 h-screen">
<div className="header-2 fixed left-0 top-0 w-full flex md:py-[20px] md:px-[30px] p-[30px] z-[60] justify-between items-center">
<Image
src={`${tedxsjecAssetsPrefix}/logo/blackLogo.webp`}
height={180}
width={180}
alt="logo"
// layout="fixed"
priority={true}
/>
</div>
<div className="fullpage-menu-inner flex items-center h-full px-[40px] py-[10px] md:px-[80px] md:py-[40px]">
<div className="menu-bg h-full w-full absolute left-0 top-0">
<span className="bg-white block back w-full h-[34%]"></span>
<span className="bg-white block back w-full h-[34%]"></span>
<span className="bg-white block back w-full h-[34%]"></span>
</div>
<nav className="relative z-10 flex flex-row w-full">
<div>
<ul className="main-menu mt-10">
<NavItem
textOne="ABOUT"
textTwo="ABOUT"
onClick={() => handleClick("about")}
/>
<NavItem
textOne="SPEAKERS"
textTwo="SPEAKERS"
onClick={() => handleClick("speakers")}
/>
<NavItem
textOne="PERFORMERS"
textTwo="PERFORMERS"
onClick={() => handleClick("performers")}
/>
<NavItem
textOne="TEAM"
textTwo="TEAM"
onClick={() => handleClick("team")}
/>
<NavItem
textOne="CONTACT"
textTwo="CONTACT"
onClick={() => handleClick("contact")}
/>
<li className="list-none listo leading-[1] font-bold text-white mt-[20px]">
<Button
className="bg-red-600 hover:bg-red-700 text-xl text-white py-6 px-4 transition-all duration-300 transform hover:scale-105"
onClick={handleRegisterClick}
size="lg"
>
Register Now
</Button>
</li>
</ul>
</div>
</nav>
<div className="w-full flex flex-col items-center">
<div className="lg:self-center lg:flex hidden lg:flex-col">
<Image
className="mt-10 hero-icon"
src={`${tedxsjecAssetsPrefix}/logo/ActualLogo.PNG`}
height={550}
width={550}
alt="logo"
/>
</div>
<div className="lg:flex hidden text-nowrap text-4xl relative bottom-32 justify-center items-center text-center">
<h1 className="life uppercase font-bold text-black">
Life - Explore What&#39;s Worth Living
</h1>
</div>
</div>
</div>
</section>
</>
);
};

Expand Down
Loading