Introduction Foundations Components Patterns Directives Pipes Motion Brand

Ai

Cards

Controls

Freelancer domain

Modals

Structure

Text & links

Showcase card

Tags: Cards

Contents

Default Aspect ratio Carousel Clickable Expandable content Not image Scale on hover Showcase card variant
PDF FILE

This is how Pdf files will be shown

MP4

This is how mp4 files will be shown

DOC

This is how doc files will be shown

MP3

This is how mp3 files will be shown

Inputs
fileAlt : string
fileSrc : string
iconActionName : string
labelIconAction : string
titlePrice : number
aspectRatioValue ?: AspectRatioValue

Set the aspect ratio of the image on the showcase card

borderRadiusBottom ?: boolean = false
carousel ?: boolean = false
fullWidth ?: boolean = true
imageDesktopSmallHeight ?: string
imageHeight ?: string
imageIntrinsicWidth ?: number
imageLargeHeight ?: string
imageMobileHeight ?: string = '100%'
imageMobileLargeHeight ?: string
imageTabletHeight ?: string
imageXLargeHeight ?: string
imageXXLargeHeight ?: string
imageXXXLargeHeight ?: string
imageXXXXLargeHeight ?: string

Set the height of the image for showcase variant in order to keep the masonry style on showcase work

keepHoverStateShown ?: boolean = false
link ?: string
newTab ?: boolean = false
pictureMetadata ?: PictureMetadata
scaleOnHover ?: boolean = false
showIconAction ?: boolean = false
showLikeAction ?: boolean = false

Shows action icons on the top-right side of the card

variant ?: ShowcaseCardVariant = ShowcaseCardVariant.LANDING_PAGE
Outputs
onClickAction ?: any = new EventEmitter<void>()
onClickLike ?: any = new EventEmitter<void>()