beta sign up sends an email with a magic token. then a separate email to login.

This commit is contained in:
2025-12-20 17:15:10 -05:00
parent c06696e66d
commit 8d9013d0dd
8 changed files with 459 additions and 119 deletions
+22 -21
View File
@@ -1,56 +1,57 @@
// app/(account)/layout.tsx
import Link from "next/link";
import AccountChrome from "./AccountChrome";
const nav = [
{ href: "/account", label: "My Account" },
{ href: "/account/settings", label: "Settings" },
{ href: "/vault", label: "My Vault" },
];
export default function AccountLayout({
children,
}: {
children: React.ReactNode;
}) {
export default function AccountLayout({ children }: { children: React.ReactNode }) {
return (
<div className="min-h-screen">
<div className="mx-auto max-w-6xl px-4 py-6">
<AccountChrome />
<div className="mx-auto w-full max-w-6xl px-4 py-6">
{/* Header */}
<div className="mb-6 flex items-center justify-between">
<div className="mb-6 flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between">
<div>
<h1 className="text-2xl font-semibold">Account</h1>
<p className="text-sm opacity-70">
<div className="text-[11px] uppercase tracking-[0.22em] text-white/50">
Account
</div>
<h1 className="mt-1 text-2xl font-semibold text-white/90">
Settings & Profile
</h1>
<p className="mt-1 text-sm text-white/60">
Profile, password, and account settings.
</p>
</div>
<Link href="/builder" className="text-sm opacity-80 hover:underline">
<Link
href="/builder"
className="inline-flex items-center justify-center rounded-lg border border-white/10 bg-white/5 px-3 py-2 text-sm font-semibold text-white/80 hover:bg-white/10"
>
Back to Builder
</Link>
</div>
<div className="grid gap-6 md:grid-cols-[240px_1fr]">
<aside className="rounded-xl border border-white/10 bg-white/5 p-3">
<div className="grid gap-6 lg:grid-cols-12">
<aside className="lg:col-span-3 rounded-2xl border border-white/10 bg-white/5 p-4">
<nav className="flex flex-col gap-1">
{nav.map((item) => (
<Link
key={item.href}
href={item.href}
className="rounded-lg px-3 py-2 text-sm opacity-80 hover:bg-white/10 hover:opacity-100"
className="rounded-lg px-3 py-2 text-sm text-white/70 hover:bg-white/10 hover:text-white"
>
{item.label}
</Link>
))}
<div className="my-2 border-t border-white/10" />
<Link
href="/vault"
className="rounded-lg px-3 py-2 text-sm opacity-80 hover:bg-white/10 hover:opacity-100"
>
My Vault
</Link>
</nav>
</aside>
<main className="rounded-xl border border-white/10 bg-white/5 p-4">
<main className="lg:col-span-9 rounded-2xl border border-white/10 bg-white/5 p-5">
{children}
</main>
</div>