Leon SerfatyandClaude Opus 4.8
857b9a7811
Property Management Network — Next.js 16 (App Router), Better Auth, Drizzle ORM over PostgreSQL, Stripe, OpenAI, Resend. Includes: - Security hardening: access-control/IDOR fixes, TLS-by-default DB layer, constant-time cron auth, strict security headers, atomic AI quota gating, HTML/email output encoding, demo-backdoor disabled in production. - Superadmin dashboard at /admin (overview/MRR, server-paginated users with ban/impersonate/plan/delete, billing, platform activity + admin audit log, AI usage, system health) via the Better Auth admin plugin. - Seed/migration utility scripts under scripts/. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
71 lines
3.2 KiB
TypeScript
71 lines
3.2 KiB
TypeScript
"use client"
|
|
|
|
import Link from "next/link"
|
|
import { motion } from "framer-motion"
|
|
import { ArrowRight, CheckCircle2 } from "lucide-react"
|
|
|
|
export function CtaBanner() {
|
|
return (
|
|
<section className="mx-auto max-w-7xl px-4 sm:px-6 pb-16 sm:pb-24">
|
|
<motion.div
|
|
initial={{ opacity: 0, y: 30 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.6 }}
|
|
className="relative overflow-hidden rounded-3xl border border-indigo-500/20 bg-gradient-to-br from-indigo-600/20 via-[#16161f] to-violet-600/20 p-8 sm:p-12 text-center"
|
|
>
|
|
{/* Glow blobs */}
|
|
<div className="absolute -top-20 left-1/2 -translate-x-1/2 h-60 w-60 rounded-full bg-indigo-600/30 blur-3xl pointer-events-none" />
|
|
<div className="absolute -bottom-20 left-1/3 h-40 w-40 rounded-full bg-violet-600/20 blur-3xl pointer-events-none" />
|
|
<div className="absolute -bottom-10 right-1/3 h-40 w-40 rounded-full bg-indigo-600/20 blur-3xl pointer-events-none" />
|
|
|
|
<div className="relative">
|
|
<motion.div
|
|
initial={{ opacity: 0, scale: 0.95 }}
|
|
whileInView={{ opacity: 1, scale: 1 }}
|
|
viewport={{ once: true }}
|
|
transition={{ delay: 0.1 }}
|
|
>
|
|
<p className="text-xs font-semibold uppercase tracking-widest text-indigo-400 mb-4">Get started today</p>
|
|
<h2 className="text-2xl sm:text-4xl lg:text-5xl font-bold text-white">
|
|
Stop managing rentals<br />the hard way
|
|
</h2>
|
|
<p className="mt-5 text-base sm:text-lg text-white/60 max-w-xl mx-auto">
|
|
Join 200+ landlords who replaced their spreadsheets with Property Management Network. Free plan, no credit card.
|
|
</p>
|
|
|
|
<div className="mt-8 flex flex-col sm:flex-row items-center justify-center gap-3">
|
|
<Link
|
|
href="/signup"
|
|
className="flex w-full sm:w-auto items-center justify-center gap-2 rounded-xl bg-indigo-600 px-6 sm:px-8 py-3.5 sm:py-4 text-sm font-semibold text-white hover:bg-indigo-500 transition-all hover:shadow-xl hover:shadow-indigo-500/30 hover:-translate-y-0.5"
|
|
>
|
|
Create your free account <ArrowRight className="h-4 w-4" />
|
|
</Link>
|
|
<Link
|
|
href="/login"
|
|
className="w-full sm:w-auto rounded-xl border border-white/10 px-6 sm:px-8 py-3.5 sm:py-4 text-sm font-medium text-white/60 hover:text-white hover:bg-white/[0.05] transition text-center"
|
|
>
|
|
Already have an account?
|
|
</Link>
|
|
</div>
|
|
|
|
<div className="mt-6 flex flex-wrap items-center justify-center gap-x-4 sm:gap-x-6 gap-y-2 text-xs text-white/40">
|
|
{[
|
|
"Free plan forever",
|
|
"30-day money-back on paid plans",
|
|
"No credit card required",
|
|
"Cancel anytime",
|
|
].map((t) => (
|
|
<div key={t} className="flex items-center gap-1.5">
|
|
<CheckCircle2 className="h-3.5 w-3.5 text-emerald-400" />
|
|
{t}
|
|
</div>
|
|
))}
|
|
</div>
|
|
</motion.div>
|
|
</div>
|
|
</motion.div>
|
|
</section>
|
|
)
|
|
}
|