Polish EventSphere web experience

This commit is contained in:
Austin A
2026-04-26 10:15:50 +01:00
parent 622e91e759
commit bbd653709f
14 changed files with 939 additions and 360 deletions

View File

@@ -1,10 +1,10 @@
"use client";
import Link from "next/link";
import { Button } from "@/components/ui/Button";
import Image from "next/image";
import { useEffect, useMemo, useState } from "react";
import { apiFetch } from "@/lib/api";
import Image from "next/image";
import { BrandMark } from "@/components/ui/BrandMark";
export function PublicShell({ children }: { children: React.ReactNode }) {
const [branding, setBranding] = useState<{ appName: string; logoUrl: string | null } | null>(null);
@@ -29,19 +29,40 @@ export function PublicShell({ children }: { children: React.ReactNode }) {
}, [tenantSlug]);
const appName = branding?.appName ?? "EventSphere";
return <div className="min-h-screen bg-white">
<header className="mx-auto flex max-w-7xl items-center justify-between px-6 py-6">
<Link href="/" className="flex items-center gap-3 font-black text-ink">
{branding?.logoUrl ? (
<Image src={branding.logoUrl} alt={appName} width={40} height={40} className="h-10 w-10 rounded-xl object-cover" />
) : (
<span className="grid h-10 w-10 place-items-center rounded-xl bg-accent text-white">E</span>
)}
{appName}
</Link>
<nav className="hidden gap-8 text-sm font-semibold text-slate-600 md:flex"><a>Platform</a><a>Events</a><a>Pricing</a><a>Contact</a></nav>
<Button>Start Registration</Button>
</header>
{children}
</div>;
return (
<div className="min-h-screen bg-white text-ink">
<header className="sticky top-0 z-30 border-b border-line/80 bg-white/90 backdrop-blur-xl">
<div className="mx-auto flex min-h-20 max-w-[118rem] items-center justify-between gap-4 px-4 sm:px-6 lg:px-8">
<Link href="/" className="flex min-w-0 items-center gap-3 text-ink" aria-label={`${appName} home`}>
{branding?.logoUrl ? (
<Image src={branding.logoUrl} alt={appName} width={46} height={46} className="h-11 w-11 rounded-lg object-cover" />
) : (
<BrandMark size="md" />
)}
<span className="min-w-0">
<span className="block truncate text-xl font-black tracking-tight sm:text-2xl">{appName}</span>
<span className="hidden truncate text-xs font-medium text-slate-600 sm:block">Enterprise Event Management Platform</span>
</span>
</Link>
<nav className="hidden items-center gap-8 text-sm font-semibold text-slate-600 lg:flex" aria-label="Public navigation">
<a href="#features" className="hover:text-accent">Platform</a>
<a href="#integrations" className="hover:text-accent">Integrations</a>
<a href="#security" className="hover:text-accent">Security</a>
</nav>
<div className="flex items-center gap-2">
<Link href="/login" className="hidden min-h-10 items-center rounded-md px-3 text-sm font-semibold text-slate-700 transition hover:bg-slate-100 sm:inline-flex">
Sign in
</Link>
<a
href="#events"
className="inline-flex min-h-10 items-center justify-center rounded-md bg-accent px-4 py-2 text-sm font-semibold text-white shadow-[0_8px_18px_rgba(22,119,255,0.22)] transition hover:bg-blue-600"
>
Start Registration
</a>
</div>
</div>
</header>
{children}
</div>
);
}