40 lines
1.3 KiB
TypeScript
40 lines
1.3 KiB
TypeScript
"use client";
|
|
|
|
import type { ReactNode } from "react";
|
|
|
|
import { SignedIn } from "@/auth/clerk";
|
|
|
|
import { BrandMark } from "@/components/atoms/BrandMark";
|
|
import { UserMenu } from "@/components/organisms/UserMenu";
|
|
|
|
export function LandingShell({ children }: { children: ReactNode }) {
|
|
return (
|
|
<div className="landing-page bg-app text-strong">
|
|
<section className="relative overflow-hidden px-4 pb-20 pt-16 sm:px-6 lg:px-8">
|
|
<div
|
|
className="absolute inset-0 bg-landing-grid opacity-[0.18] pointer-events-none"
|
|
aria-hidden="true"
|
|
/>
|
|
<div
|
|
className="absolute -top-40 right-0 h-72 w-72 rounded-full bg-[color:var(--accent-soft)] blur-3xl pointer-events-none"
|
|
aria-hidden="true"
|
|
/>
|
|
<div
|
|
className="absolute -bottom-32 left-0 h-72 w-72 rounded-full bg-[color:var(--surface-strong)] blur-3xl pointer-events-none"
|
|
aria-hidden="true"
|
|
/>
|
|
|
|
<div className="relative mx-auto flex w-full max-w-6xl flex-col gap-12">
|
|
<header className="flex items-center justify-between gap-4">
|
|
<BrandMark />
|
|
<SignedIn>
|
|
<UserMenu />
|
|
</SignedIn>
|
|
</header>
|
|
<main>{children}</main>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
);
|
|
}
|