در حال بارگذاری پیشنمایش
import { cn } from "cn"
import { Button } from "@/components/ui/button"
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle,
} from "@/components/ui/card"
import {
Field,
FieldDescription,
FieldGroup,
FieldLabel,
} from "@/components/ui/field"
import { Input } from "@/components/ui/input"
export default function LoginForm({
className,
...props
}: React.ComponentProps<"div">) {
return (
<div
dir="rtl"
lang="fa"
className={cn("flex flex-col gap-6", className)}
{...props}
>
<Card>
<CardHeader>
<CardTitle>ورود به حساب</CardTitle>
<CardDescription>
ایمیل و رمز عبور خود را وارد کنید
</CardDescription>
</CardHeader>
<CardContent>
<form>
<FieldGroup>
<Field>
<FieldLabel htmlFor="email">ایمیل</FieldLabel>
<Input
id="email"
type="email"
placeholder="[email protected]"
dir="ltr"
className="text-start"
required
/>
</Field>
<Field>
<div className="flex items-center">
<FieldLabel htmlFor="password">رمز عبور</FieldLabel>
<a
href="#"
className="ms-auto inline-block text-sm underline-offset-4 hover:underline"
>
فراموشی رمز؟
</a>
</div>
<Input
id="password"
type="password"
dir="ltr"
className="text-start"
required
/>
</Field>
<Field>
<Button type="submit">ورود</Button>
<Button variant="outline" type="button">
ورود با گوگل
</Button>
<FieldDescription className="text-center">
حساب ندارید؟ <a href="#">ثبتنام</a>
</FieldDescription>
</Field>
</FieldGroup>
</form>
</CardContent>
</Card>
</div>
)
}