Shadcn Registry 1

1export interface ShadcnRegistry1Props {
2  name: string;
3  url: string;
4  description: string;
5  logo?: string;
6  items?: string[];
7}
8 
9export const ShadcnRegistry1 = ({
10  name,
11  url,
12  description,
13  logo = "",
14  items = [],
15}: ShadcnRegistry1Props) => (
16  <div
17    style={{
18      backgroundColor: "#09090b",
19      backgroundImage:
20        "radial-gradient(ellipse at 70% 80%, rgba(120,50,60,0.15), transparent 60%), radial-gradient(ellipse at 20% 20%, rgba(60,60,80,0.1), transparent 50%)",
21      color: "#fafafa",
22      display: "flex",
23      flexDirection: "column",
24      height: "100%",
25      justifyContent: "space-between",
26      padding: "72px",
27      position: "relative",
28      width: "100%",
29    }}
30  >
31    <div
32      style={{
33        alignItems: "center",
34        display: "flex",
35        justifyContent: "space-between",
36        width: "100%",
37      }}
38    >
39      <div style={{ alignItems: "center", display: "flex", gap: "16px" }}>
40        {logo ? (
41          <img
42            alt=""
43            height={48}
44            src={logo}
45            width={48}
46            style={{
47              borderRadius: "12px",
48              objectFit: "contain",
49            }}
50          />
51        ) : (
52          <div
53            style={{
54              backgroundColor: "#22d3ee",
55              borderRadius: "999px",
56              display: "flex",
57              height: "48px",
58              width: "48px",
59            }}
60          />
61        )}
62        <div
63          style={{
64            fontSize: "32px",
65            fontWeight: 600,
66            letterSpacing: "-0.01em",
67          }}
68        >
69          {name}
70        </div>
71      </div>
72      <div
73        style={{
74          color: "#71717a",
75          fontSize: "28px",
76          fontWeight: 500,
77        }}
78      >
79        {url}
80      </div>
81    </div>
82 
83    <div
84      style={{
85        display: "flex",
86        flexDirection: "column",
87        gap: "24px",
88        marginTop: "-40px",
89      }}
90    >
91      <div
92        style={{
93          display: "flex",
94          fontSize: url.length > 20 ? 96 : 120,
95          fontWeight: 700,
96          letterSpacing: "-0.04em",
97          lineHeight: 1,
98          textWrap: "balance" as const,
99        }}
100      >
101        {url}
102      </div>
103      <div
104        style={{
105          color: "#a1a1aa",
106          display: "flex",
107          fontSize: "36px",
108          fontWeight: 400,
109          lineHeight: 1.3,
110          maxWidth: "800px",
111          textWrap: "balance" as const,
112        }}
113      >
114// … truncated