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>
91 lines
2.8 KiB
TypeScript
91 lines
2.8 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 LoginPage() {
|
|
return (
|
|
<AuthLayout
|
|
title="Welcome Back"
|
|
subtitle="Log in to access your dashboard and manage your projects."
|
|
>
|
|
<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>
|
|
|
|
{/* Login Form */}
|
|
<form className="flex flex-col gap-4">
|
|
<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">
|
|
<div className="flex items-center justify-between">
|
|
<Label htmlFor="password">Password</Label>
|
|
<Link
|
|
href="#"
|
|
className="text-sm text-primary hover:underline"
|
|
>
|
|
Forgot password?
|
|
</Link>
|
|
</div>
|
|
<Input
|
|
id="password"
|
|
type="password"
|
|
placeholder="••••••••"
|
|
className="bg-card border-border"
|
|
/>
|
|
</div>
|
|
|
|
<Button
|
|
type="submit"
|
|
className="glow-button bg-primary hover:bg-primary-glow text-white w-full"
|
|
>
|
|
Log In
|
|
</Button>
|
|
</form>
|
|
|
|
{/* Sign up link */}
|
|
<p className="text-center text-sm text-muted-foreground">
|
|
Don't have an account?{' '}
|
|
<Link href="/register" className="text-primary hover:underline font-medium">
|
|
Sign up
|
|
</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>
|
|
)
|
|
}
|