@tohuhono/puck-blocks
Version:
A collection of puck components for building pages in OberonCMS
44 lines (43 loc) • 2.4 kB
JavaScript
"use client";
import { jsxs, jsx } from "react/jsx-runtime";
import { Button } from "@tohuhono/ui/button";
import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from "@tohuhono/ui/card";
import { Input } from "@tohuhono/ui/input";
import { Label } from "@tohuhono/ui/label";
import { Icons } from "@tohuhono/ui/icons";
function CardsCreateAccount() {
return /* @__PURE__ */ jsxs(Card, { children: [
/* @__PURE__ */ jsxs(CardHeader, { className: "space-y-1", children: [
/* @__PURE__ */ jsx(CardTitle, { className: "text-2xl", children: "Create an account" }),
/* @__PURE__ */ jsx(CardDescription, { children: "Enter your email below to create your account" })
] }),
/* @__PURE__ */ jsxs(CardContent, { className: "grid gap-4", children: [
/* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-6", children: [
/* @__PURE__ */ jsxs(Button, { variant: "outline", children: [
/* @__PURE__ */ jsx(Icons.gitHub, { className: "mr-2 size-4" }),
"Github"
] }),
/* @__PURE__ */ jsxs(Button, { variant: "outline", children: [
/* @__PURE__ */ jsx(Icons.google, { className: "mr-2 size-4" }),
"Google"
] })
] }),
/* @__PURE__ */ jsxs("div", { className: "relative", children: [
/* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx("span", { className: "w-full border-t" }) }),
/* @__PURE__ */ jsx("div", { className: "relative flex justify-center text-xs uppercase", children: /* @__PURE__ */ jsx("span", { className: "bg-card px-2 text-muted-foreground", children: "Or continue with" }) })
] }),
/* @__PURE__ */ jsxs("div", { className: "grid gap-2", children: [
/* @__PURE__ */ jsx(Label, { htmlFor: "email", children: "Email" }),
/* @__PURE__ */ jsx(Input, { id: "email", type: "email", placeholder: "m@example.com" })
] }),
/* @__PURE__ */ jsxs("div", { className: "grid gap-2", children: [
/* @__PURE__ */ jsx(Label, { htmlFor: "password", children: "Password" }),
/* @__PURE__ */ jsx(Input, { id: "password", type: "password" })
] })
] }),
/* @__PURE__ */ jsx(CardFooter, { children: /* @__PURE__ */ jsx(Button, { className: "w-full", children: "Create account" }) })
] });
}
export {
CardsCreateAccount
};