AspectRatio
ბლოკი ფიქსირებული პროპორციით CSS aspect-ratio-ით; პირდაპირი შვილები მთლიანად ავსებენ, img/video — object-cover-ით. სერვერ-კომპონენტია.
მაგალითი
16 : 9
1 : 1
import { AspectRatio } from "@llc-conciergia/ui/aspect-ratio";
<AspectRatio ratio={16 / 9} className="rounded-lg">
<img src="/rooms/deluxe.jpg" alt="დელუქს ნომერი" />
</AspectRatio>ინსტალაცია
pnpm add @llc-conciergia/uiimport { AspectRatio } from "@llc-conciergia/ui/aspect-ratio";npx @llc-conciergia/cli add aspect-rationpx shadcn@latest add https://ui.conciergia.co/r/aspect-ratio.jsonProps
| Prop | ტიპი | ნაგულისხმევი | აღწერა |
|---|---|---|---|
| ratio | number | 1 | სიგანე / სიმაღლე, მაგ. 16 / 9. |
| className / style | string / CSSProperties | — | სიგანე, მომრგვალება, ფონი. |