23 lines
1.6 KiB
JavaScript
23 lines
1.6 KiB
JavaScript
import React from 'react'
|
|
import { Head, Link } from '@inertiajs/react'
|
|
|
|
export default function AcademyBillingCancel({ message, links = {} }) {
|
|
return (
|
|
<main className="min-h-screen bg-[radial-gradient(circle_at_top_left,_rgba(251,191,36,0.14),_transparent_24%),radial-gradient(circle_at_bottom_right,_rgba(148,163,184,0.14),_transparent_26%),linear-gradient(180deg,_#07111f_0%,_#0f172a_45%,_#111827_100%)] px-4 py-8 sm:px-6 lg:px-8">
|
|
<Head title="Academy Billing Canceled" />
|
|
|
|
<div className="mx-auto max-w-[920px] space-y-8">
|
|
<section className="rounded-[40px] border border-white/10 bg-[linear-gradient(135deg,rgba(7,17,31,0.95),rgba(12,24,45,0.9),rgba(67,20,7,0.78))] p-8 shadow-[0_32px_100px_rgba(2,6,23,0.42)] md:p-10">
|
|
<p className="text-[11px] font-semibold uppercase tracking-[0.24em] text-amber-100/85">Checkout canceled</p>
|
|
<h1 className="mt-4 text-4xl font-semibold tracking-[-0.05em] text-white md:text-5xl">No payment was made.</h1>
|
|
<p className="mt-4 max-w-2xl text-base leading-8 text-slate-300">{message}</p>
|
|
</section>
|
|
|
|
<div className="flex flex-wrap gap-3">
|
|
<Link href={links.pricing || '/academy/pricing'} 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">Return to pricing</Link>
|
|
<Link href={links.academy || '/academy'} 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]">Back to Academy</Link>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
)
|
|
} |