41 lines
1.9 KiB
TypeScript
41 lines
1.9 KiB
TypeScript
import { Button } from '@/components/ui/button'
|
|
import { Mail, SendHorizonal } from 'lucide-react'
|
|
|
|
export default function CallToAction3() {
|
|
return (
|
|
<section className="py-16 md:py-24 lg:py-32">
|
|
<div className="mx-auto max-w-5xl px-6">
|
|
<div className="text-center">
|
|
<h2 className="text-heading-2 text-balance font-semibold">Start Building</h2>
|
|
<p className="mt-4">Libero sapiente aliquam quibusdam aspernatur.</p>
|
|
|
|
<form
|
|
action=""
|
|
className="mx-auto mt-10 max-w-sm lg:mt-12">
|
|
<div className="bg-background has-[input:focus]:ring-muted relative grid grid-cols-[1fr_auto] items-center rounded-[calc(var(--radius)+0.75rem)] border border-border pr-3 shadow-sm has-[input:focus]:ring-2">
|
|
<Mail className="text-caption pointer-events-none absolute inset-y-0 left-5 my-auto size-5" />
|
|
|
|
<input
|
|
placeholder="Your mail address"
|
|
className="h-14 w-full bg-transparent pl-12 focus:outline-none"
|
|
type="email"
|
|
/>
|
|
|
|
<div className="md:pr-1.5 lg:pr-0">
|
|
<Button variant="primary" aria-label="submit">
|
|
<span className="hidden md:block">Get Started</span>
|
|
<SendHorizonal
|
|
className="relative mx-auto size-5 md:hidden"
|
|
strokeWidth={2}
|
|
/>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
)
|
|
}
|
|
|