diff --git a/apps/web/src/components/SiteHeader.tsx b/apps/web/src/components/SiteHeader.tsx index 62e497b..d4f81a3 100644 --- a/apps/web/src/components/SiteHeader.tsx +++ b/apps/web/src/components/SiteHeader.tsx @@ -8,7 +8,10 @@ import { Header } from "./Header"; export function SiteHeader() { const { data: session } = authClient.useSession(); const routerState = useRouterState(); - const isHomepage = routerState.location.pathname === "/"; + const pathname = routerState.location.pathname; + const isHomepage = pathname === "/"; + + if (pathname === "/kamp") return null; const [isVisible, setIsVisible] = useState(false); diff --git a/apps/web/src/routeTree.gen.ts b/apps/web/src/routeTree.gen.ts index 8d21f23..8e4d170 100644 --- a/apps/web/src/routeTree.gen.ts +++ b/apps/web/src/routeTree.gen.ts @@ -12,8 +12,8 @@ import { Route as rootRouteImport } from './routes/__root' import { Route as TermsRouteImport } from './routes/terms' import { Route as ResetPasswordRouteImport } from './routes/reset-password' import { Route as PrivacyRouteImport } from './routes/privacy' -import { Route as OpenMicRouteImport } from './routes/open-mic' import { Route as LoginRouteImport } from './routes/login' +import { Route as KampRouteImport } from './routes/kamp' import { Route as ForgotPasswordRouteImport } from './routes/forgot-password' import { Route as DrinkkaartRouteImport } from './routes/drinkkaart' import { Route as ContactRouteImport } from './routes/contact' @@ -42,16 +42,16 @@ const PrivacyRoute = PrivacyRouteImport.update({ path: '/privacy', getParentRoute: () => rootRouteImport, } as any) -const OpenMicRoute = OpenMicRouteImport.update({ - id: '/open-mic', - path: '/open-mic', - getParentRoute: () => rootRouteImport, -} as any) const LoginRoute = LoginRouteImport.update({ id: '/login', path: '/login', getParentRoute: () => rootRouteImport, } as any) +const KampRoute = KampRouteImport.update({ + id: '/kamp', + path: '/kamp', + getParentRoute: () => rootRouteImport, +} as any) const ForgotPasswordRoute = ForgotPasswordRouteImport.update({ id: '/forgot-password', path: '/forgot-password', @@ -119,8 +119,8 @@ export interface FileRoutesByFullPath { '/contact': typeof ContactRoute '/drinkkaart': typeof DrinkkaartRoute '/forgot-password': typeof ForgotPasswordRoute + '/kamp': typeof KampRoute '/login': typeof LoginRoute - '/open-mic': typeof OpenMicRoute '/privacy': typeof PrivacyRoute '/reset-password': typeof ResetPasswordRoute '/terms': typeof TermsRoute @@ -138,8 +138,8 @@ export interface FileRoutesByTo { '/contact': typeof ContactRoute '/drinkkaart': typeof DrinkkaartRoute '/forgot-password': typeof ForgotPasswordRoute + '/kamp': typeof KampRoute '/login': typeof LoginRoute - '/open-mic': typeof OpenMicRoute '/privacy': typeof PrivacyRoute '/reset-password': typeof ResetPasswordRoute '/terms': typeof TermsRoute @@ -158,8 +158,8 @@ export interface FileRoutesById { '/contact': typeof ContactRoute '/drinkkaart': typeof DrinkkaartRoute '/forgot-password': typeof ForgotPasswordRoute + '/kamp': typeof KampRoute '/login': typeof LoginRoute - '/open-mic': typeof OpenMicRoute '/privacy': typeof PrivacyRoute '/reset-password': typeof ResetPasswordRoute '/terms': typeof TermsRoute @@ -179,8 +179,8 @@ export interface FileRouteTypes { | '/contact' | '/drinkkaart' | '/forgot-password' + | '/kamp' | '/login' - | '/open-mic' | '/privacy' | '/reset-password' | '/terms' @@ -198,8 +198,8 @@ export interface FileRouteTypes { | '/contact' | '/drinkkaart' | '/forgot-password' + | '/kamp' | '/login' - | '/open-mic' | '/privacy' | '/reset-password' | '/terms' @@ -217,8 +217,8 @@ export interface FileRouteTypes { | '/contact' | '/drinkkaart' | '/forgot-password' + | '/kamp' | '/login' - | '/open-mic' | '/privacy' | '/reset-password' | '/terms' @@ -237,8 +237,8 @@ export interface RootRouteChildren { ContactRoute: typeof ContactRoute DrinkkaartRoute: typeof DrinkkaartRoute ForgotPasswordRoute: typeof ForgotPasswordRoute + KampRoute: typeof KampRoute LoginRoute: typeof LoginRoute - OpenMicRoute: typeof OpenMicRoute PrivacyRoute: typeof PrivacyRoute ResetPasswordRoute: typeof ResetPasswordRoute TermsRoute: typeof TermsRoute @@ -274,13 +274,6 @@ declare module '@tanstack/react-router' { preLoaderRoute: typeof PrivacyRouteImport parentRoute: typeof rootRouteImport } - '/open-mic': { - id: '/open-mic' - path: '/open-mic' - fullPath: '/open-mic' - preLoaderRoute: typeof OpenMicRouteImport - parentRoute: typeof rootRouteImport - } '/login': { id: '/login' path: '/login' @@ -288,6 +281,13 @@ declare module '@tanstack/react-router' { preLoaderRoute: typeof LoginRouteImport parentRoute: typeof rootRouteImport } + '/kamp': { + id: '/kamp' + path: '/kamp' + fullPath: '/kamp' + preLoaderRoute: typeof KampRouteImport + parentRoute: typeof rootRouteImport + } '/forgot-password': { id: '/forgot-password' path: '/forgot-password' @@ -381,8 +381,8 @@ const rootRouteChildren: RootRouteChildren = { ContactRoute: ContactRoute, DrinkkaartRoute: DrinkkaartRoute, ForgotPasswordRoute: ForgotPasswordRoute, + KampRoute: KampRoute, LoginRoute: LoginRoute, - OpenMicRoute: OpenMicRoute, PrivacyRoute: PrivacyRoute, ResetPasswordRoute: ResetPasswordRoute, TermsRoute: TermsRoute, diff --git a/apps/web/src/routes/index.tsx b/apps/web/src/routes/index.tsx index 92038cb..843f8bd 100644 --- a/apps/web/src/routes/index.tsx +++ b/apps/web/src/routes/index.tsx @@ -1,318 +1,168 @@ import { createFileRoute, Link } from "@tanstack/react-router"; import { useEffect, useState } from "react"; +import EventRegistrationForm from "@/components/homepage/EventRegistrationForm"; +import Footer from "@/components/homepage/Footer"; +import Hero from "@/components/homepage/Hero"; +import HoeInschrijven from "@/components/homepage/HoeInschrijven"; +import Info from "@/components/homepage/Info"; + +const KAMP_BANNER_KEY = "kk_kamp_banner_dismissed"; export const Route = createFileRoute("/")({ - component: SelectorPage, + component: HomePage, }); -function SelectorPage() { - const [hovered, setHovered] = useState<"kamp" | "openmic" | null>(null); - const [mounted, setMounted] = useState(false); - const [isMobile, setIsMobile] = useState(false); +function KampBanner({ onDismiss }: { onDismiss: () => void }) { + const [visible, setVisible] = useState(false); useEffect(() => { - const check = () => setIsMobile(window.innerWidth < 640); - check(); - window.addEventListener("resize", check, { passive: true }); - return () => window.removeEventListener("resize", check); - }, []); - - useEffect(() => { - const t = setTimeout(() => setMounted(true), 60); + if (!document.getElementById("kamp-banner-font")) { + const el = document.createElement("link"); + el.id = "kamp-banner-font"; + el.rel = "stylesheet"; + el.href = + "https://fonts.googleapis.com/css2?family=Special+Elite&display=swap"; + document.head.appendChild(el); + } + const t = setTimeout(() => setVisible(true), 600); return () => clearTimeout(t); }, []); + const handleDismiss = () => { + setVisible(false); + setTimeout(onDismiss, 300); + }; + return (
- {/* ── Kamp Inschrijvingen ───────────────────────────────────────── */} - setHovered("kamp")} - onMouseLeave={() => setHovered(null)} - aria-label="Ga naar de kamp inschrijvingen op ejv.be" > - {/* Diagonal stripe texture */} -