mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
Upstream sync from shadcn-ui/ui (1686 commits since last merge base). Key changes: - packages/shadcn upgraded to 4.1.0 (CLI font transformers, scaffold from github, chart colors) - apps/v4 replaces apps/www as the primary docs/registry app - Font system: 25+ heading font registries, font markers utility, @supports override - Chart improvements: recharts v3 compat, radial chart fixes - templates/ updated with monorepo variants (astro, vite, react-router, start) - skills/shadcn AI skill definitions added - deprecated/ removed (auth, auth-firebase, cli, www) Preserved Hanzo-only paths: app/, pkg/, demo/, docs/, template/next/
17 lines
2.5 KiB
JSON
17 lines
2.5 KiB
JSON
{
|
|
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
|
"name": "aspect-ratio-example",
|
|
"title": "Aspect Ratio",
|
|
"registryDependencies": [
|
|
"aspect-ratio",
|
|
"example"
|
|
],
|
|
"files": [
|
|
{
|
|
"path": "registry/base-nova/examples/aspect-ratio-example.tsx",
|
|
"content": "import Image from \"next/image\"\n\nimport {\n Example,\n ExampleWrapper,\n} from \"@/registry/base-nova/components/example\"\nimport { AspectRatio } from \"@/registry/base-nova/ui/aspect-ratio\"\n\nexport default function AspectRatioExample() {\n return (\n <ExampleWrapper className=\"max-w-4xl 2xl:max-w-4xl\">\n <AspectRatio16x9 />\n <AspectRatio21x9 />\n <AspectRatio1x1 />\n <AspectRatio9x16 />\n </ExampleWrapper>\n )\n}\n\nfunction AspectRatio16x9() {\n return (\n <Example title=\"16:9\" className=\"items-center justify-center\">\n <AspectRatio ratio={16 / 9} className=\"rounded-lg bg-muted\">\n <Image\n src=\"https://avatar.vercel.sh/shadcn1\"\n alt=\"Photo\"\n fill\n className=\"h-full w-full rounded-lg object-cover grayscale dark:brightness-20\"\n />\n </AspectRatio>\n </Example>\n )\n}\n\nfunction AspectRatio1x1() {\n return (\n <Example title=\"1:1\" className=\"items-start\">\n <AspectRatio ratio={1 / 1} className=\"rounded-lg bg-muted\">\n <Image\n src=\"https://avatar.vercel.sh/shadcn1\"\n alt=\"Photo\"\n fill\n className=\"h-full w-full rounded-lg object-cover grayscale dark:brightness-20\"\n />\n </AspectRatio>\n </Example>\n )\n}\n\nfunction AspectRatio9x16() {\n return (\n <Example title=\"9:16\" className=\"items-center justify-center\">\n <AspectRatio ratio={9 / 16} className=\"rounded-lg bg-muted\">\n <Image\n src=\"https://avatar.vercel.sh/shadcn1\"\n alt=\"Photo\"\n fill\n className=\"h-full w-full rounded-lg object-cover grayscale dark:brightness-20\"\n />\n </AspectRatio>\n </Example>\n )\n}\n\nfunction AspectRatio21x9() {\n return (\n <Example title=\"21:9\" className=\"items-center justify-center\">\n <AspectRatio ratio={21 / 9} className=\"rounded-lg bg-muted\">\n <Image\n src=\"https://avatar.vercel.sh/shadcn1\"\n alt=\"Photo\"\n fill\n className=\"h-full w-full rounded-lg object-cover grayscale dark:brightness-20\"\n />\n </AspectRatio>\n </Example>\n )\n}\n",
|
|
"type": "registry:example"
|
|
}
|
|
],
|
|
"type": "registry:example"
|
|
} |