98552163a8
Complete frontend implementation with: - Next.js 16 with App Router and TypeScript - Tailwind CSS v4 with custom violet theme - shadcn/ui components with Lucide React icons - Landing page with hero, services, pricing, testimonials, FAQ - Service selection page with toggle - Login/Register pages with social auth UI - Multi-step checkout flow - Client dashboard with stats, projects, support tickets - Billing page with subscription, payment methods, invoices - All mock data and TypeScript types 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
111 lines
3.4 KiB
TypeScript
111 lines
3.4 KiB
TypeScript
import Link from 'next/link'
|
|
import { ArrowLeft } from 'lucide-react'
|
|
import { AuthLayout } from '@/components/auth/auth-layout'
|
|
import { SocialLoginButtons } from '@/components/auth/social-login-buttons'
|
|
import { Button } from '@/components/ui/button'
|
|
import { Input } from '@/components/ui/input'
|
|
import { Label } from '@/components/ui/label'
|
|
|
|
export default function RegisterPage() {
|
|
return (
|
|
<AuthLayout
|
|
title="Create Account"
|
|
subtitle="Start scaling your business with AI & Web solutions today."
|
|
>
|
|
<div className="flex flex-col gap-6">
|
|
{/* Social Login */}
|
|
<SocialLoginButtons />
|
|
|
|
{/* Divider */}
|
|
<div className="relative">
|
|
<div className="absolute inset-0 flex items-center">
|
|
<div className="w-full border-t border-border" />
|
|
</div>
|
|
<div className="relative flex justify-center text-sm">
|
|
<span className="px-4 bg-background text-muted-foreground">
|
|
Or continue with email
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Register Form */}
|
|
<form className="flex flex-col gap-4">
|
|
<div className="flex flex-col gap-2">
|
|
<Label htmlFor="name">Full Name</Label>
|
|
<Input
|
|
id="name"
|
|
type="text"
|
|
placeholder="John Doe"
|
|
className="bg-card border-border"
|
|
/>
|
|
</div>
|
|
|
|
<div className="flex flex-col gap-2">
|
|
<Label htmlFor="email">Email</Label>
|
|
<Input
|
|
id="email"
|
|
type="email"
|
|
placeholder="you@example.com"
|
|
className="bg-card border-border"
|
|
/>
|
|
</div>
|
|
|
|
<div className="flex flex-col gap-2">
|
|
<Label htmlFor="password">Password</Label>
|
|
<Input
|
|
id="password"
|
|
type="password"
|
|
placeholder="••••••••"
|
|
className="bg-card border-border"
|
|
/>
|
|
</div>
|
|
|
|
<div className="flex items-start gap-2">
|
|
<input
|
|
type="checkbox"
|
|
id="terms"
|
|
className="mt-1 w-4 h-4 rounded border-border"
|
|
/>
|
|
<Label htmlFor="terms" className="text-sm text-muted-foreground">
|
|
I agree to the{' '}
|
|
<Link href="#" className="text-primary hover:underline">
|
|
Terms of Service
|
|
</Link>{' '}
|
|
and{' '}
|
|
<Link href="#" className="text-primary hover:underline">
|
|
Privacy Policy
|
|
</Link>
|
|
</Label>
|
|
</div>
|
|
|
|
<Button
|
|
type="submit"
|
|
className="glow-button bg-primary hover:bg-primary-glow text-white w-full"
|
|
>
|
|
Create Account
|
|
</Button>
|
|
</form>
|
|
|
|
{/* Log in link */}
|
|
<p className="text-center text-sm text-muted-foreground">
|
|
Already have an account?{' '}
|
|
<Link href="/login" className="text-primary hover:underline font-medium">
|
|
Log in
|
|
</Link>
|
|
</p>
|
|
|
|
{/* Back to home */}
|
|
<div className="text-center">
|
|
<Link
|
|
href="/"
|
|
className="text-sm text-muted-foreground hover:text-foreground inline-flex items-center gap-1"
|
|
>
|
|
<ArrowLeft className="w-4 h-4" />
|
|
Back to home
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</AuthLayout>
|
|
)
|
|
}
|