add generic layout for reuse

This commit is contained in:
Brandon Egger
2023-08-24 13:30:09 -05:00
parent 71a956d28a
commit 2180d798d0
5 changed files with 54 additions and 50 deletions

View File

@ -12,18 +12,20 @@ export const ErrorNotice = ({
return (
<>
{header ? (
<div className="mx-auto w-fit rounded-xl border border-red-300 bg-red-100 px-4 py-4 text-center font-semibold text-red-600">
{icon ? (
<div className="mx-auto grid place-items-center">
<ExclamationTriangleIcon className="h-10 w-10" />
</div>
) : undefined}
<span className="text-lg font-semibold text-red-500">{header}</span>
{body ? (
<p className="mx-8 my-2 text-sm font-normal text-stone-600">
{body}
</p>
) : undefined}
<div className="mx-auto w-fit px-2">
<div className="rounded-xl border border-red-300 bg-red-100 px-4 py-4 text-center font-semibold text-red-600">
{icon ? (
<div className="mx-auto grid place-items-center">
<ExclamationTriangleIcon className="h-10 w-10" />
</div>
) : undefined}
<span className="text-lg font-semibold text-red-500">{header}</span>
{body ? (
<p className="mx-8 my-2 text-sm font-normal text-stone-600">
{body}
</p>
) : undefined}
</div>
</div>
) : undefined}
</>