Mark Henderson
bada63452f
- Map Justine tokens to shadcn CSS variables (--vibn-* aliases) - Switch fonts to Inter + Lora via next/font (IBM Plex Mono for code) - Base typography: body Inter, h1–h3 Lora; marketing hero + wordmark serif - Project shell and global chrome use semantic colors - Replace Outfit/Newsreader references across TSX inline styles Made-with: Cursor
95 lines
2.9 KiB
TypeScript
95 lines
2.9 KiB
TypeScript
import { Button } from "@/components/ui/button";
|
|
import Link from "next/link";
|
|
import type { Metadata } from "next";
|
|
import { homepage } from "@/marketing/content/homepage";
|
|
import { Footer } from "@/marketing/components";
|
|
|
|
export const metadata: Metadata = {
|
|
title: homepage.meta.title,
|
|
description: homepage.meta.description,
|
|
openGraph: {
|
|
title: homepage.meta.title,
|
|
description: homepage.meta.description,
|
|
url: "https://www.vibnai.com",
|
|
siteName: "VIBN",
|
|
type: "website",
|
|
},
|
|
twitter: {
|
|
card: "summary_large_image",
|
|
title: homepage.meta.title,
|
|
description: homepage.meta.description,
|
|
},
|
|
};
|
|
|
|
export default function MarketingLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<div className="flex min-h-screen flex-col">
|
|
{/* Navigation */}
|
|
<header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
|
|
<div className="container flex h-16 items-center">
|
|
<div className="flex gap-6 md:gap-10">
|
|
<Link href="/" className="flex items-center space-x-2">
|
|
<img
|
|
src="/vibn-black-circle-logo.png"
|
|
alt="Vib'n"
|
|
className="h-8 w-8"
|
|
/>
|
|
<span className="font-serif text-xl font-bold tracking-tight">Vib'n</span>
|
|
</Link>
|
|
</div>
|
|
<div className="flex flex-1 items-center justify-between space-x-2 md:justify-end">
|
|
<nav className="flex items-center space-x-6">
|
|
<Link
|
|
href="/#features"
|
|
className="text-sm font-medium transition-colors hover:text-primary"
|
|
>
|
|
Features
|
|
</Link>
|
|
<Link
|
|
href="/#how-it-works"
|
|
className="text-sm font-medium transition-colors hover:text-primary"
|
|
>
|
|
How It Works
|
|
</Link>
|
|
<Link
|
|
href="/#pricing"
|
|
className="text-sm font-medium transition-colors hover:text-primary"
|
|
>
|
|
Pricing
|
|
</Link>
|
|
<Link
|
|
href="https://github.com/MawkOne/viben"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-sm font-medium transition-colors hover:text-primary"
|
|
>
|
|
GitHub
|
|
</Link>
|
|
</nav>
|
|
<div className="flex items-center space-x-4">
|
|
<Link href="/auth">
|
|
<Button variant="ghost" size="sm">
|
|
Sign In
|
|
</Button>
|
|
</Link>
|
|
<Link href="/auth">
|
|
<Button size="sm">Get Started</Button>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
{/* Main Content */}
|
|
<main className="flex-1 w-full">{children}</main>
|
|
|
|
<Footer />
|
|
</div>
|
|
);
|
|
}
|
|
|