50 lines
1.5 KiB
TypeScript
50 lines
1.5 KiB
TypeScript
import type { ReactNode } from 'react';
|
|
|
|
type Props = {
|
|
badge: string;
|
|
title: string;
|
|
description: string;
|
|
children: ReactNode;
|
|
footer: ReactNode;
|
|
};
|
|
|
|
export default function AuthTempoCard({
|
|
badge,
|
|
title,
|
|
description,
|
|
children,
|
|
footer,
|
|
}: Props) {
|
|
return (
|
|
<div className="w-full overflow-hidden rounded-3xl bg-slate-50 shadow-2xl ring-1 ring-black/5">
|
|
<div className="p-5 sm:p-8 lg:p-10">
|
|
<img
|
|
src="/images/logo/logo-vermelho.png"
|
|
alt="Tempo"
|
|
width="1787"
|
|
height="564"
|
|
className="mx-auto mb-4 h-14 w-auto"
|
|
/>
|
|
|
|
<div className="mx-auto mb-8 max-w-2xl text-center">
|
|
<span className="mb-3 inline-flex rounded-full bg-red-100 px-3 py-1 text-xs font-bold tracking-wide text-[#b51219] uppercase">
|
|
{badge}
|
|
</span>
|
|
<h2 className="text-2xl font-bold text-slate-950 sm:text-3xl">
|
|
{title}
|
|
</h2>
|
|
<p className="mt-3 text-sm leading-6 text-slate-600">
|
|
{description}
|
|
</p>
|
|
</div>
|
|
|
|
{children}
|
|
</div>
|
|
|
|
<div className="border-t border-slate-200 bg-white p-5 text-center text-sm text-slate-600">
|
|
{footer}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|