import { Link } from "@tanstack/react-router";
import { buttonClass } from "~/ui/Button";
import { DisplayTitle } from "./DisplayTitle";
/** Closing call to action: a ruled-off section with the two ways to start. */
export function CtaBand({ title, body }: { title: string; body: string }) {
return (
<section className="flex flex-col gap-6 border-t border-kumo-hairline pt-12 md:flex-row md:items-end md:justify-between">
<div className="space-y-3">
<DisplayTitle title={title} />
<p className="max-w-xl leading-7 text-kumo-subtle">{body}</p>
</div>
<div className="flex shrink-0 flex-wrap gap-3">
<Link to="/signup" className={buttonClass("primary")}>
Create an account
</Link>
<Link to="/self-host" className={buttonClass("secondary")}>
Self-host gitfor
</Link>
</div>
</section>
);
}