16 lines
1.2 KiB
JavaScript
16 lines
1.2 KiB
JavaScript
import React from 'react'
|
|
import { Link } from '@inertiajs/react'
|
|
|
|
export default function UpgradeCta({ title, description, primaryHref, primaryLabel, secondaryHref = null, secondaryLabel = null }) {
|
|
return (
|
|
<section className="rounded-[30px] border border-white/10 bg-[linear-gradient(135deg,rgba(8,47,73,0.92),rgba(30,41,59,0.94),rgba(67,20,7,0.82))] p-6 shadow-[0_24px_80px_rgba(2,6,23,0.32)] md:p-7">
|
|
<p className="text-[11px] font-semibold uppercase tracking-[0.22em] text-sky-100/85">Academy Billing</p>
|
|
<h2 className="mt-3 text-2xl font-semibold tracking-[-0.04em] text-white">{title}</h2>
|
|
<p className="mt-3 max-w-2xl text-sm leading-7 text-slate-200/90">{description}</p>
|
|
<div className="mt-5 flex flex-wrap gap-3">
|
|
<Link href={primaryHref} className="rounded-full border border-sky-300/25 bg-sky-300/12 px-5 py-3 text-sm font-semibold text-sky-100 transition hover:border-sky-300/40 hover:bg-sky-300/18">{primaryLabel}</Link>
|
|
{secondaryHref && secondaryLabel ? <Link href={secondaryHref} className="rounded-full border border-white/10 bg-white/[0.05] px-5 py-3 text-sm font-semibold text-white transition hover:border-white/20 hover:bg-white/[0.08]">{secondaryLabel}</Link> : null}
|
|
</div>
|
|
</section>
|
|
)
|
|
} |