Skip to content

Commit da0d6f4

Browse files
MeschacirungMeschacirung
committed
chore : build new registries
1 parent 776d103 commit da0d6f4

25 files changed

+134
-24
lines changed

‎public/r/features-10.json

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
3+
"name": "features-10",
4+
"type": "registry:block",
5+
"title": "Features Block 10",
6+
"description": "Shadcn/ui website features block with cards and circular UI elements",
7+
"registryDependencies": [
8+
"card"
9+
],
10+
"files": [
11+
{
12+
"path": "app/preview/features/ten/page.tsx",
13+
"content": "import { Card, CardContent, CardHeader } from '@/components/ui/card'\nimport { cn } from '@/lib/utils'\nimport { Calendar, LucideIcon, MapIcon } from 'lucide-react'\nimport Image from 'next/image'\nimport { ReactNode } from 'react'\n\nexport default function Features() {\n return (\n <section className=\"bg-zinc-50 py-16 md:py-32 dark:bg-transparent\">\n <div className=\"mx-auto max-w-2xl px-6 lg:max-w-5xl\">\n <div className=\"mx-auto grid gap-4 lg:grid-cols-2\">\n <FeatureCard>\n <CardHeader className=\"pb-3\">\n <CardHeading\n icon={MapIcon}\n title=\"Real time location tracking\"\n description=\"Advanced tracking system, Instantly locate all your assets.\"\n />\n </CardHeader>\n\n <div className=\"relative mb-6 border-t border-dashed sm:mb-0\">\n <div className=\"absolute inset-0 [background:radial-gradient(125%_125%_at_50%_0%,transparent_40%,var(--color-blue-600),var(--color-white)_100%)]\"></div>\n <div className=\"aspect-76/59 p-1 px-6\">\n <DualModeImage\n darkSrc=\"/payments.png\"\n lightSrc=\"/payments-light.png\"\n alt=\"payments illustration\"\n width={1207}\n height={929}\n />\n </div>\n </div>\n </FeatureCard>\n\n <FeatureCard>\n <CardHeader className=\"pb-3\">\n <CardHeading\n icon={Calendar}\n title=\"Advanced Scheduling\"\n description=\"Scheduling system, Instantly locate all your assets.\"\n />\n </CardHeader>\n\n <CardContent>\n <div className=\"relative mb-6 sm:mb-0\">\n <div className=\"absolute -inset-6 [background:radial-gradient(50%_50%_at_75%_50%,transparent,var(--color-background)_100%)]\"></div>\n <div className=\"aspect-76/59 border\">\n <DualModeImage\n darkSrc=\"/origin-cal-dark.png\"\n lightSrc=\"/origin-cal.png\"\n alt=\"calendar illustration\"\n width={1207}\n height={929}\n />\n </div>\n </div>\n </CardContent>\n </FeatureCard>\n\n <FeatureCard className=\"p-6 lg:col-span-2\">\n <p className=\"mx-auto my-6 max-w-md text-balance text-center text-2xl font-semibold\">Smart scheduling with automated reminders for maintenance.</p>\n\n <div className=\"flex justify-center gap-6 overflow-hidden\">\n <CircularUI\n label=\"Inclusion\"\n circles={[{ pattern: 'border' }, { pattern: 'border' }]}\n />\n\n <CircularUI\n label=\"Inclusion\"\n circles={[{ pattern: 'none' }, { pattern: 'primary' }]}\n />\n\n <CircularUI\n label=\"Join\"\n circles={[{ pattern: 'blue' }, { pattern: 'none' }]}\n />\n\n <CircularUI\n label=\"Exclusion\"\n circles={[{ pattern: 'primary' }, { pattern: 'none' }]}\n className=\"hidden sm:block\"\n />\n </div>\n </FeatureCard>\n </div>\n </div>\n </section>\n )\n}\n\ninterface FeatureCardProps {\n children: ReactNode\n className?: string\n}\n\nconst FeatureCard = ({ children, className }: FeatureCardProps) => (\n <Card className={cn('group relative rounded-none shadow-zinc-950/5', className)}>\n <CardDecorator />\n {children}\n </Card>\n)\n\nconst CardDecorator = () => (\n <>\n <span className=\"border-primary absolute -left-px -top-px block size-2 border-l-2 border-t-2\"></span>\n <span className=\"border-primary absolute -right-px -top-px block size-2 border-r-2 border-t-2\"></span>\n <span className=\"border-primary absolute -bottom-px -left-px block size-2 border-b-2 border-l-2\"></span>\n <span className=\"border-primary absolute -bottom-px -right-px block size-2 border-b-2 border-r-2\"></span>\n </>\n)\n\ninterface CardHeadingProps {\n icon: LucideIcon\n title: string\n description: string\n}\n\nconst CardHeading = ({ icon: Icon, title, description }: CardHeadingProps) => (\n <div className=\"p-6\">\n <span className=\"text-muted-foreground flex items-center gap-2\">\n <Icon className=\"size-4\" />\n {title}\n </span>\n <p className=\"mt-8 text-2xl font-semibold\">{description}</p>\n </div>\n)\n\ninterface DualModeImageProps {\n darkSrc: string\n lightSrc: string\n alt: string\n width: number\n height: number\n className?: string\n}\n\nconst DualModeImage = ({ darkSrc, lightSrc, alt, width, height, className }: DualModeImageProps) => (\n <>\n <Image\n src={darkSrc}\n className={cn('hidden dark:block', className)}\n alt={`${alt} dark`}\n width={width}\n height={height}\n />\n <Image\n src={lightSrc}\n className={cn('shadow dark:hidden', className)}\n alt={`${alt} light`}\n width={width}\n height={height}\n />\n </>\n)\n\ninterface CircleConfig {\n pattern: 'none' | 'border' | 'primary' | 'blue'\n}\n\ninterface CircularUIProps {\n label: string\n circles: CircleConfig[]\n className?: string\n}\n\nconst CircularUI = ({ label, circles, className }: CircularUIProps) => (\n <div className={className}>\n <div className=\"bg-linear-to-b from-border size-fit rounded-2xl to-transparent p-px\">\n <div className=\"bg-linear-to-b from-background to-muted/25 relative flex aspect-square w-fit items-center -space-x-4 rounded-[15px] p-4\">\n {circles.map((circle, i) => (\n <div\n key={i}\n className={cn('size-7 rounded-full border sm:size-8', {\n 'border-primary': circle.pattern === 'none',\n 'border-primary bg-[repeating-linear-gradient(-45deg,var(--color-border),var(--color-border)_1px,transparent_1px,transparent_4px)]': circle.pattern === 'border',\n 'border-primary bg-background bg-[repeating-linear-gradient(-45deg,var(--color-primary),var(--color-primary)_1px,transparent_1px,transparent_4px)]': circle.pattern === 'primary',\n 'bg-background z-1 border-blue-500 bg-[repeating-linear-gradient(-45deg,var(--color-blue-500),var(--color-blue-500)_1px,transparent_1px,transparent_4px)]': circle.pattern === 'blue',\n })}></div>\n ))}\n </div>\n </div>\n <span className=\"text-muted-foreground mt-1.5 block text-center text-sm\">{label}</span>\n </div>\n)\n",
14+
"type": "registry:component",
15+
"target": "components/features-10.tsx"
16+
}
17+
]
18+
}

‎public/r/features-11.json

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
3+
"name": "features-11",
4+
"type": "registry:block",
5+
"title": "Features Block 11",
6+
"description": "Shadcn/ui website features block with grid layout and images",
7+
"registryDependencies": [
8+
"card"
9+
],
10+
"files": [
11+
{
12+
"path": "app/preview/features/eleven/page.tsx",
13+
"content": "import { Card, CardContent, CardHeader } from '@/components/ui/card'\nimport { Globe } from 'lucide-react'\nimport Image from 'next/image'\n\nexport default function Features() {\n return (\n <section className=\"dark:bg-muted/25 bg-zinc-50 py-16 md:py-32\">\n <div className=\"mx-auto max-w-5xl px-6\">\n <div className=\"mx-auto grid gap-2 sm:grid-cols-5\">\n <Card className=\"group overflow-hidden shadow-zinc-950/5 sm:col-span-3 sm:rounded-none sm:rounded-tl-xl\">\n <CardHeader>\n <div className=\"md:p-6\">\n <p className=\"font-medium\">Advanced tracking system</p>\n <p className=\"text-muted-foreground mt-3 max-w-sm text-sm\">Quick AI lives a single hotkey away - ready to quickly appear as a floating window above your other apps..</p>\n </div>\n </CardHeader>\n\n <div className=\"relative h-fit pl-6 md:pl-12\">\n <div className=\"absolute -inset-6 [background:radial-gradient(75%_95%_at_50%_0%,transparent,var(--color-background)_100%)]\"></div>\n\n <div className=\"bg-background overflow-hidden rounded-tl-lg border-l border-t pl-2 pt-2 dark:bg-zinc-950\">\n <Image\n src=\"/mail2.png\"\n className=\"hidden dark:block\"\n alt=\"payments illustration dark\"\n width={1207}\n height={929}\n />\n <Image\n src=\"/mail2-light.png\"\n className=\"shadow dark:hidden\"\n alt=\"payments illustration light\"\n width={1207}\n height={929}\n />\n </div>\n </div>\n </Card>\n\n <Card className=\"group overflow-hidden shadow-zinc-950/5 sm:col-span-2 sm:rounded-none sm:rounded-tr-xl\">\n <p className=\"mx-auto my-6 max-w-md text-balance px-6 text-center text-lg font-semibold sm:text-2xl md:p-6\">Advanced UX, Instantly locate all your assets.</p>\n\n <CardContent className=\"mt-auto h-fit\">\n <div className=\"relative mb-6 sm:mb-0\">\n <div className=\"absolute -inset-6 [background:radial-gradient(50%_75%_at_75%_50%,transparent,var(--color-background)_100%)]\"></div>\n <div className=\"aspect-76/59 overflow-hidden rounded-r-lg border\">\n <Image\n src=\"/origin-cal-dark.png\"\n className=\"hidden dark:block\"\n alt=\"payments illustration dark\"\n width={1207}\n height={929}\n />\n <Image\n src=\"/origin-cal.png\"\n className=\"shadow dark:hidden\"\n alt=\"payments illustration light\"\n width={1207}\n height={929}\n />\n </div>\n </div>\n </CardContent>\n </Card>\n <Card className=\"group p-6 shadow-zinc-950/5 sm:col-span-2 sm:rounded-none sm:rounded-bl-xl md:p-12\">\n <p className=\"mx-auto mb-12 max-w-md text-balance text-center text-lg font-semibold sm:text-2xl\">Advanced UX, Instantly locate all your assets.</p>\n\n <div className=\"flex justify-center gap-6\">\n <div className=\"inset-shadow-sm dark:inset-shadow-white/5 bg-muted/35 relative flex aspect-square size-16 items-center rounded-[7px] border p-3 shadow-lg ring dark:shadow-white/5 dark:ring-black\">\n <span className=\"absolute right-2 top-1 block text-sm\">fn</span>\n <Globe className=\"mt-auto size-4\" />\n </div>\n <div className=\"inset-shadow-sm dark:inset-shadow-white/5 bg-muted/35 flex aspect-square size-16 items-center justify-center rounded-[7px] border p-3 shadow-lg ring dark:shadow-white/5 dark:ring-black\">\n <span>K</span>\n </div>\n </div>\n </Card>\n <Card className=\"group relative shadow-zinc-950/5 sm:col-span-3 sm:rounded-none sm:rounded-br-xl\">\n <CardHeader className=\"p-6 md:p-12\">\n <p className=\"font-medium\">Advanced tracking system</p>\n <p className=\"text-muted-foreground mt-2 max-w-sm text-sm\">Quick AI lives a single hotkey away apps..</p>\n </CardHeader>\n <CardContent className=\"relative h-fit px-6 pb-6 md:px-12 md:pb-12\">\n <div className=\"grid grid-cols-4 gap-2 md:grid-cols-6\">\n <div className=\"rounded-(--radius) aspect-square border border-dashed\"></div>\n <div className=\"rounded-(--radius) bg-muted/50 flex aspect-square items-center justify-center border p-4\">\n <img\n className=\"m-auto size-8 invert dark:invert-0\"\n src=\"https://oxymor-ns.tailus.io/logos/linear.svg\"\n alt=\"Linear logo\"\n width=\"32\"\n height=\"32\"\n />\n </div>\n <div className=\"rounded-(--radius) aspect-square border border-dashed\"></div>\n <div className=\"rounded-(--radius) bg-muted/50 flex aspect-square items-center justify-center border p-4\">\n <img\n className=\"m-auto size-8 invert dark:invert-0\"\n src=\"https://oxymor-ns.tailus.io/logos/netlify.svg\"\n alt=\"Netlify logo\"\n width=\"32\"\n height=\"32\"\n />\n </div>\n <div className=\"rounded-(--radius) aspect-square border border-dashed\"></div>\n <div className=\"rounded-(--radius) bg-muted/50 flex aspect-square items-center justify-center border p-4\">\n <img\n className=\"m-auto size-8 invert dark:invert-0\"\n src=\"https://oxymor-ns.tailus.io/logos/github.svg\"\n alt=\"github logo\"\n width=\"32\"\n height=\"32\"\n />\n </div>\n </div>\n </CardContent>\n </Card>\n </div>\n </div>\n </section>\n )\n}\n",
14+
"type": "registry:component",
15+
"target": "components/features-11.tsx"
16+
}
17+
]
18+
}

0 commit comments

Comments
 (0)