form-2

1import { PlusIcon } from "lucide-react";
2import { Button } from "@/components/ui/button";
3import {
4  Field,
5  FieldDescription,
6  FieldGroup,
7  FieldLabel,
8} from "@/components/ui/field";
9import { Input } from "@/components/ui/input";
10import {
11  InputGroup,
12  InputGroupAddon,
13  InputGroupInput,
14} from "@/components/ui/input-group";
15import { Textarea } from "@/components/ui/textarea";
16 
17export function SubmitProjectForm() {
18  return (
19    <div className="relative w-full max-w-md bg-background p-4">
20      <div className="-left-px -inset-y-6 absolute w-px bg-border" />
21      <div className="-right-px -inset-y-6 absolute w-px bg-border" />
22      <div className="-top-px -inset-x-6 absolute h-px bg-border" />
23      <div className="-bottom-px -inset-x-6 absolute h-px bg-border" />
24      <PlusIcon
25        className="-left-[12.5px] -top-[12.5px] absolute size-6"
26        strokeWidth={0.5}
27      />
28      <PlusIcon
29        className="-right-[12.5px] -bottom-[12.5px] absolute size-6"
30        strokeWidth={0.5}
31      />
32 
33      <div className="rounded-md border border-border/60 p-[2px]">
34        <div className="items-left flex flex-col justify-center gap-1 rounded-md border bg-card p-4 shadow-xs">
35          <h2 className="font-medium text-xl">Submit Project</h2>
36          <p className="text-muted-foreground text-sm">
37            Submit your open source project for review.
38          </p>
39        </div>
40      </div>
41      <FieldGroup className="p-4">
42        <Field className="gap-2">
43          <FieldLabel htmlFor="name">Project Name</FieldLabel>
44          <Input autoComplete="off" id="name" placeholder="e.g., shadcn/ui" />
45          <FieldDescription>
46            This is your public display name. Must be between 3 and 10
47            characters. Must only contain letters, numbers, and underscores.
48          </FieldDescription>
49        </Field>
50        <Field className="gap-2">
51          <FieldLabel htmlFor="github">GitHub Repository URL</FieldLabel>
52          <InputGroup>
53            <InputGroupAddon>
54              <GithubIcon />
55            </InputGroupAddon>
56            <InputGroupInput
57              id="github"
58              placeholder="e.g., https://github.com/shadcn/ui"
59            />
60          </InputGroup>
61          <FieldDescription>
62            The URL of your GitHub repository.
63          </FieldDescription>
64        </Field>
65        <Field className="gap-2">
66          <FieldLabel htmlFor="description">Project Description</FieldLabel>
67          <Textarea
68// … truncated