Skip to content

Commit b085043

Browse files
feat: cnblocks added
1 parent e9bfb53 commit b085043

File tree

214 files changed

+20494
-58
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

214 files changed

+20494
-58
lines changed

integration/cnblocks/.gitignore

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.*
7+
.yarn/*
8+
!.yarn/patches
9+
!.yarn/plugins
10+
!.yarn/releases
11+
!.yarn/versions
12+
13+
# testing
14+
/coverage
15+
16+
# next.js
17+
/.next/
18+
/out/
19+
20+
# production
21+
/build
22+
23+
# misc
24+
.DS_Store
25+
*.pem
26+
27+
# debug
28+
npm-debug.log*
29+
yarn-debug.log*
30+
yarn-error.log*
31+
.pnpm-debug.log*
32+
33+
# env files (can opt-in for committing if needed)
34+
.env*
35+
36+
# vercel
37+
.vercel
38+
39+
# typescript
40+
*.tsbuildinfo
41+
next-env.d.ts

integration/cnblocks/.prettierignore

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# Ignore artifacts:
2+
build
3+
coverage

integration/cnblocks/.prettierrc

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"printWidth": 500,
3+
"semi": false,
4+
"tabWidth": 4,
5+
"parser": "babel",
6+
"singleQuote": true,
7+
"trailingComma": "es5",
8+
"jsxBracketSameLine": true,
9+
"quoteProps": "as-needed",
10+
"jsxSingleQuote": false,
11+
"bracketSpacing": true,
12+
"bracketSameLine": false,
13+
"useTabs": false,
14+
"singleAttributePerLine": true,
15+
"plugins": [
16+
"prettier-plugin-tailwindcss"
17+
],
18+
"tailwindStylesheet": "./app/global.css",
19+
"overrides": [
20+
{
21+
"files": "*.tsx",
22+
"options": {
23+
"parser": "babel-ts"
24+
}
25+
}
26+
]
27+
}

integration/cnblocks/LICENCE.md

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2025 Irung
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

integration/cnblocks/README.md

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
# NSUI
2+
3+
Speed up your workflow with responsive, pre-built shadcn-UI blocks designed for marketing websites.
4+
5+
[NSUI](https://nsui.irung.me)
6+
7+
![NSUI Image](app/opengraph-image.png)
8+
9+
10+
## Getting Started
11+
12+
First, run the development server:
13+
14+
```bash
15+
pnpm dev
16+
```
17+
18+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import CategoryNavigation from '@/components/blocks-nav'
2+
import { SiteFooter } from '@/components/site-footer'
3+
import { SiteHeader } from '@/components/site-header'
4+
import { categories } from '@/data/blocks'
5+
6+
export default function CategoryLayout({
7+
children,
8+
}: Readonly<{
9+
children: React.ReactNode
10+
}>) {
11+
return (
12+
<>
13+
<SiteHeader />
14+
<CategoryNavigation categories={categories} />
15+
<main>{children}</main>
16+
17+
<SiteFooter />
18+
</>
19+
)
20+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import BlockPreview from '@/components/BlockPreview'
2+
import { blocks, categories } from '@/data/blocks'
3+
import { notFound } from 'next/navigation'
4+
5+
interface PageProps {
6+
params: Promise<{ category: string }>
7+
}
8+
9+
export const dynamic = 'force-static'
10+
export const revalidate = 3600
11+
12+
export async function generateStaticParams() {
13+
return categories.map((category) => ({
14+
category: category,
15+
}))
16+
}
17+
18+
export async function generateMetadata({ params }: PageProps) {
19+
const { category } = await params
20+
return {
21+
title: `Shadcn ${category} Blocks`,
22+
}
23+
}
24+
25+
export default async function CategoryPage({ params }: PageProps) {
26+
const { category } = await params
27+
const categoryBlocks = blocks.filter((b) => b.category === category)
28+
29+
if (categoryBlocks.length === 0) {
30+
notFound()
31+
}
32+
33+
return (
34+
<>
35+
<section>
36+
<h1 className="sr-only text-3xl font-bold sm:text-4xl md:text-nowrap">
37+
Shadcn <span className="capitalize">{category}</span> blocks
38+
</h1>
39+
<p className="sr-only text-base md:text-lg">Speed up your workflow with responsive, pre-built UI blocks designed for marketing websites.</p>
40+
<div className="h-6 w-full bg-[repeating-linear-gradient(-45deg,var(--color-border),var(--color-border)_1px,transparent_1px,transparent_6px)] opacity-35"></div>
41+
</section>
42+
43+
{categoryBlocks.map((block, index) => (
44+
<BlockPreview
45+
{...block}
46+
key={index}
47+
/>
48+
))}
49+
</>
50+
)
51+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,193 @@
1+
import { LogoStroke } from '@/components/logo'
2+
import { ChevronRight } from 'lucide-react'
3+
import Link from 'next/link'
4+
import { Button } from '@/components/ui/button'
5+
6+
const members = [
7+
{
8+
name: 'Liam Brown',
9+
role: 'Founder - CEO',
10+
avatar: 'https://alt.tailus.io/images/team/member-one.webp',
11+
link: '#',
12+
},
13+
{
14+
name: 'Elijah Jones',
15+
role: 'Co-Founder - CTO',
16+
avatar: 'https://alt.tailus.io/images/team/member-two.webp',
17+
link: '#',
18+
},
19+
{
20+
name: 'Isabella Garcia',
21+
role: 'Sales Manager',
22+
avatar: 'https://alt.tailus.io/images/team/member-three.webp',
23+
link: '#',
24+
},
25+
{
26+
name: 'Henry Lee',
27+
role: 'UX Engeneer',
28+
avatar: 'https://alt.tailus.io/images/team/member-four.webp',
29+
link: '#',
30+
},
31+
{
32+
name: 'Ava Williams',
33+
role: 'Interaction Designer',
34+
avatar: 'https://alt.tailus.io/images/team/member-five.webp',
35+
link: '#',
36+
},
37+
{
38+
name: 'Olivia Miller',
39+
role: 'Visual Designer',
40+
avatar: 'https://alt.tailus.io/images/team/member-six.webp',
41+
link: '#',
42+
},
43+
]
44+
45+
export default function HeroSection() {
46+
return (
47+
<>
48+
<main>
49+
<section className="pt-16 md:pt-32">
50+
<div aria-hidden>
51+
<div className="bg-linear-to-t from-background -z-9 absolute inset-x-0 top-0 h-2/3 max-h-96 to-transparent"></div>
52+
<div className="absolute top-0 -z-10 h-2/3 max-h-96 w-full bg-[radial-gradient(var(--color-foreground)_1px,transparent_1px)] bg-[size:56px_56px] opacity-45"></div>
53+
</div>
54+
<div className="mx-auto max-w-5xl px-6 pt-32 lg:px-0">
55+
<div className="mx-auto max-w-2xl space-y-6 text-center">
56+
<h1 className="text-balance text-center text-4xl font-medium lg:text-7xl">Building The Next Marketing Platform</h1>
57+
<p>Gemini is evolving to be more than just the models. It supports an entire to the APIs and platforms helping developers and businesses innovate.</p>
58+
</div>
59+
</div>
60+
</section>
61+
<section className="py-16 md:py-32">
62+
<div className="mx-auto max-w-5xl space-y-16 px-6 md:space-y-32">
63+
<img className="rounded-(--radius) grayscale" src="https://images.unsplash.com/photo-1530099486328-e021101a494a?q=80&w=2747&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="team image" height="" width="" loading="lazy" />
64+
65+
<div className="mx-auto grid max-w-lg gap-6 md:gap-12">
66+
<span className="text-muted-foreground text-sm">Our Mission</span>
67+
<h2 className="text-4xl font-medium">The Lyra ecosystem brings together our models, products and platforms.</h2>
68+
<div className="space-y-6">
69+
<p>Lyra is evolving to be more than just the models. It supports an entire ecosystem — from products to the APIs and platforms helping developers and businesses innovate.</p>
70+
71+
<Button asChild variant="secondary" size="sm" className="gap-1 pr-1.5">
72+
<Link href="#">
73+
<span>Learn More</span>
74+
<ChevronRight className="size-2" />
75+
</Link>
76+
</Button>
77+
</div>
78+
</div>
79+
</div>
80+
</section>
81+
82+
<section className="px-6 py-16 md:py-32">
83+
<div className="mx-auto max-w-lg">
84+
<h2 className="mb-8 text-4xl font-medium md:mb-16">Our Story</h2>
85+
<div aria-hidden className="relative -mx-4 mb-8 aspect-video md:mb-16">
86+
<div className="bg-background absolute inset-0 m-auto size-fit p-8">
87+
<LogoStroke className="h-fit w-20 text-blue-500" />
88+
</div>
89+
<div className="absolute inset-0 -z-10 bg-[radial-gradient(var(--color-foreground)_1px,transparent_1px)] bg-[size:40px_40px]"></div>
90+
</div>
91+
92+
<p className="text-accent-foreground">Lyra is evolving to be more than just the models. It supports an entire ecosystem — from products to the APIs and platforms helping developers and businesses innovate.</p>
93+
<p className="mt-4">
94+
Tailus UI. <span className="font-bold">It supports an entire ecosystem</span> — from products innovate. Sit minus, quod debitis autem quia aspernatur delectus impedit modi, neque non id ad dignissimos? Saepe deleniti perferendis beatae.
95+
</p>
96+
</div>
97+
</section>
98+
99+
<section className="py-16 md:py-32">
100+
<div className="mx-auto max-w-lg px-6 lg:px-0">
101+
<h2 className="mb-8 text-4xl font-medium md:mb-16">Our team</h2>
102+
103+
<div>
104+
<h3 className="mb-6 text-lg font-medium">Leadership</h3>
105+
<div className="grid grid-cols-2 gap-4 border-t py-6 md:grid-cols-4">
106+
{members.map((member, index) => (
107+
<div key={index}>
108+
<div className="bg-background size-16 rounded-full border p-0.5 shadow shadow-zinc-950/5">
109+
<img className="aspect-square rounded-full object-cover" src={member.avatar} alt={member.name} height="460" width="460" loading="lazy" />
110+
</div>
111+
<span className="mt-2 block text-sm">{member.name}</span>
112+
<span className="text-muted-foreground block text-xs">{member.role}</span>
113+
</div>
114+
))}
115+
</div>
116+
</div>
117+
118+
<div className="mt-6">
119+
<h3 className="mb-6 text-lg font-medium">Engineering</h3>
120+
<div data-rounded="full" className="grid grid-cols-2 gap-4 border-t py-6 md:grid-cols-4">
121+
{members.map((member, index) => (
122+
<div key={index}>
123+
<div className="bg-background size-16 rounded-full border p-0.5 shadow shadow-zinc-950/5">
124+
<img className="aspect-square rounded-full object-cover" src={member.avatar} alt={member.name} height="460" width="460" loading="lazy" />
125+
</div>
126+
<span className="mt-2 block text-sm">{member.name}</span>
127+
<span className="text-muted-foreground block text-xs">{member.role}</span>
128+
</div>
129+
))}
130+
</div>
131+
</div>
132+
133+
<div className="mt-6">
134+
<h3 className="mb-6 text-lg font-medium">Marketing</h3>
135+
<div data-rounded="full" className="grid grid-cols-2 gap-4 border-t py-6 md:grid-cols-4">
136+
{members.map((member, index) => (
137+
<div key={index}>
138+
<div className="bg-background size-16 rounded-full border p-0.5 shadow shadow-zinc-950/5">
139+
<img className="aspect-square rounded-full object-cover" src={member.avatar} alt={member.name} height="460" width="460" loading="lazy" />
140+
</div>
141+
<span className="mt-2 block text-sm">{member.name}</span>
142+
<span className="text-muted-foreground block text-xs">{member.role}</span>
143+
</div>
144+
))}
145+
</div>
146+
</div>
147+
</div>
148+
</section>
149+
<section className="bg-background py-16">
150+
<div className="mx-auto max-w-5xl px-6">
151+
<h2 className="text-center text-lg font-medium">Your favorite companies are our partners.</h2>
152+
<div className="mx-auto mt-20 flex max-w-4xl flex-wrap items-center justify-center gap-x-12 gap-y-8 sm:gap-x-16 sm:gap-y-12">
153+
<img className="h-5 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/nvidia.svg" alt="Nvidia Logo" height="20" width="auto" />
154+
<img className="h-4 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/column.svg" alt="Column Logo" height="16" width="auto" />
155+
<img className="h-4 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/github.svg" alt="GitHub Logo" height="16" width="auto" />
156+
<img className="h-5 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/nike.svg" alt="Nike Logo" height="20" width="auto" />
157+
<img className="h-4 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/laravel.svg" alt="Laravel Logo" height="16" width="auto" />
158+
<img className="h-7 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/lilly.svg" alt="Lilly Logo" height="28" width="auto" />
159+
<img className="h-5 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/lemonsqueezy.svg" alt="Lemon Squeezy Logo" height="20" width="auto" />
160+
<img className="h-6 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/openai.svg" alt="OpenAI Logo" height="24" width="auto" />
161+
<img className="h-4 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/tailwindcss.svg" alt="Tailwind CSS Logo" height="16" width="auto" />
162+
<img className="h-5 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/vercel.svg" alt="Vercel Logo" height="20" width="auto" />
163+
<img className="h-5 w-fit dark:invert" src="https://html.tailus.io/blocks/customers/zapier.svg" alt="Zapier Logo" height="20" width="auto" />
164+
</div>
165+
</div>
166+
</section>
167+
168+
<section className="py-16 md:py-32">
169+
<div className="mx-auto max-w-5xl px-6">
170+
<div className="text-center">
171+
<h2 className="text-balance text-4xl font-semibold lg:text-5xl">Start Building</h2>
172+
<p className="mt-4">Libero sapiente aliquam quibusdam aspernatur.</p>
173+
174+
<div className="mt-8 flex flex-wrap justify-center gap-4">
175+
<Button asChild size="lg">
176+
<Link href="/">
177+
<span>Get Started</span>
178+
</Link>
179+
</Button>
180+
181+
<Button asChild size="lg" variant="outline">
182+
<Link href="/">
183+
<span>Book Demo</span>
184+
</Link>
185+
</Button>
186+
</div>
187+
</div>
188+
</div>
189+
</section>
190+
</main>
191+
</>
192+
)
193+
}

0 commit comments

Comments
 (0)