Gallery mosaic
Mosaic grid previews of images and other files, laid out by item count
The singleImagefit input is used to specify how a single image in the modern structure should be rendered and fit. The concept is similar to the Picture's object fitgallery specific behaviors.
'contain'
This forces the whole image to be fit inside the whole width of the container. The height of the image will be scaled proportionally.
'cover'
This forces the image to fit in a
Image optimization caveat
NOTE: The whole image will still be downloaded while only the cropped portion will be shown. This may lead performance issues due to larger than necessary file sizes; Follow image optimization best practices to for the best image file size and visual quality.
Inputs in Single image fit
imageSizes ?: string
maxWidth ?: number
singleImageFit ?: SingleImageFit = 'cover'
How a single image should fit in the container.
usingFastlyIO ?: boolean = false
Also set in this example
galleryItems : readonly GalleryItem[]
Outputs
openItem ?: any = new EventEmitter<number>()