Files
spsays-training/components/auth/auth-card.tsx
2026-05-30 02:34:22 +05:30

53 lines
1.1 KiB
TypeScript

"use client";
import Link from "next/link";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
/**
* Visual wrapper used by every /(auth) page. Centralises the card chrome
* so the per-page files only deal with form state.
*/
export function AuthCard({
title,
description,
footer,
children,
}: {
title: string;
description?: string;
footer?: React.ReactNode;
children: React.ReactNode;
}) {
return (
<Card>
<CardHeader className="pb-8">
<CardTitle className="text-2xl">{title}</CardTitle>
{description ? <CardDescription>{description}</CardDescription> : null}
</CardHeader>
<CardContent className="space-y-4">{children}</CardContent>
{footer ? (
<div className="px-6 pb-6 text-sm text-muted-foreground">{footer}</div>
) : null}
</Card>
);
}
export function AuthFooterLink({
prefix,
href,
label,
}: {
prefix: string;
href: string;
label: string;
}) {
return (
<p>
{prefix}{" "}
<Link href={href} className="text-primary underline-offset-4 hover:underline">
{label}
</Link>
</p>
);
}