Rafael Lopes
faa03f80cf
Some checks are pending
Deploy Dev / deploy (push) Waiting to run
- Ajustado border Radius de todos componentes de 28 para 20px - Criado modal para quando for criado um novo template
32 lines
942 B
JavaScript
32 lines
942 B
JavaScript
export function MetricGrid({ metrics, minCardWidth = '180px' }) {
|
|
return (
|
|
<section
|
|
style={{
|
|
display: 'grid',
|
|
gridTemplateColumns: `repeat(auto-fit, minmax(${minCardWidth}, 1fr))`,
|
|
gap: '1rem',
|
|
}}
|
|
>
|
|
{metrics.map((item) => (
|
|
<article
|
|
key={item.label}
|
|
style={{
|
|
padding: '1.15rem',
|
|
borderRadius: '16px',
|
|
border: '1px solid var(--color-border)',
|
|
background: '#fff',
|
|
}}
|
|
>
|
|
<span style={{ color: 'var(--color-text-soft)', display: 'block' }}>{item.label}</span>
|
|
<strong style={{ display: 'block', fontSize: '1.4rem', marginTop: '0.45rem' }}>
|
|
{item.value}
|
|
</strong>
|
|
<span style={{ color: 'var(--color-text-soft)', display: 'block', marginTop: '0.45rem' }}>
|
|
{item.detail}
|
|
</span>
|
|
</article>
|
|
))}
|
|
</section>
|
|
);
|
|
}
|