Panel
Panel is a flexible container that lets you quickly build cards and content blocks with consistent padding, borders and optional shadows.
Bordered Panel
This panel demonstrates the default bordered style.
Shadow Panel
This panel uses a drop shadow to elevate it above the page.
Prop | Type | Default value |
---|---|---|
Prop hasBorder | Type boolean | Default value false |
Prop hasShadow | Type boolean | Default value false |
Prop padding | Type 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | Default value 'md' |
Prop gap | Type 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | Default value 'sm' |
Prop orientation | Type 'horizontal' | 'vertical' | Default value 'horizontal' |
Prop alignItems | Type 'start' | 'center' | 'end' | 'stretch' | Default value 'center' |
Prop fillWidth | Type boolean | Default value false |
Prop fillHeight | Type boolean | Default value false |