Card
A versatile composable container component.
Importing
1
import { Card, CardContent, CardHeader, CardBackdrop } from '@infinityfx/fluid';Usage
Card title
Card title
API reference
Card Props
color?
'front' | 'back' | 'top'
'front'
elevated?
boolean
false
Shows a backdrop shadow.
borderless?
boolean
false
radius?
'xsm' | 'sml' | 'med' | 'lrg'
'med'
pad?
'none' | 'xxs' | 'xsm' | 'sml' | 'med' | 'lrg' | 'xlg'
'med'
CardContent Props
align?
'vertical' | 'horizontal' | 'center'
'vertical'
stretch?
boolean
false
Let every child element fill all available space.
pad?
'none' | 'xxs' | 'xsm' | 'sml' | 'med' | 'lrg' | 'xlg'
'none'
gap?
'none' | 'xsm' | 'sml' | 'med' | 'lrg'
'sml'
CardHeader Props
pad?
'top' | 'bottom'
When set adds spacing below or above the header.
CardBackdrop Props
fade?
'top' | 'bottom'
When set will fade out the backdrop to allow for contrast with overlayed content.
