Simple card components with minimal styling.
No data
<BaseCard
variant="primary"
fields={[{ id: 'handler-1', label: 'Handler', value: 'No data' }]}
/>Cards with the primary styling variant.
Lorem ipsum dolor sit amet
Consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
$199.99
<BaseCard
variant="primary"
fields={[{ id: 'handler-1', label: 'Handler', value: 'No data' }]}
/>Cards with the secondary styling variant.
Ut enim ad minim veniam
Quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
$249.99
<BaseCard
variant="secondary"
fields={[{ id: 'handler-1', label: 'Handler', value: 'No data' }]}
/>Multiple cards arranged in a responsive grid layout.
Duis aute irure dolor
$799.99
Excepteur sint occaecat
$1299.99
Lorem ipsum dolor sit amet
$199.99
Ut enim ad minim veniam
$249.99
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
<BaseCard variant="primary" fields={[{ id: 'handler-1', label: 'Handler', value: 'No data' }]} />
<BaseCard variant="secondary" fields={[{ id: 'handler-1', label: 'Handler', value: 'No data' }]} />
<BaseCard variant="primary" fields={[{ id: 'handler-1', label: 'Handler', value: 'No data' }]} />
<BaseCard variant="secondary" fields={[{ id: 'handler-1', label: 'Handler', value: 'No data' }]} />
</div>