27 lines
1.2 KiB
JavaScript
27 lines
1.2 KiB
JavaScript
import React from 'react';
|
|
|
|
const StatsCard = ({ icon, color, title, value, className }) => {
|
|
return (
|
|
<div className={className}>
|
|
<div className="card">
|
|
<div className="card-body px-4 py-4-5">
|
|
<div className="row">
|
|
<div className="col-md-4 col-lg-12 col-xl-12 col-xxl-5 d-flex justify-content-start ">
|
|
{/* Ajuste importante aqui: classes para o ícone e cor de fundo */}
|
|
{/* Use as classes 'stats-icon' e 'bg-' para a cor de fundo, e a classe 'iconly-' para o ícone */}
|
|
<div className={`stats-icon ${color} mb-2`}> {/* A classe de cor (purple, blue, etc.) deve ser bg-purple se o seu CSS usar isso */}
|
|
<i className={`${icon}`}></i> {/* A prop 'icon' já deve vir com o 'iconly-boldShow', 'iconly-boldProfile', etc. */}
|
|
</div>
|
|
</div>
|
|
<div className="col-md-8 col-lg-12 col-xl-12 col-xxl-7">
|
|
<h6 className="text-muted font-semibold">{title}</h6>
|
|
<h6 className="font-extrabold mb-0">{value}</h6>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default StatsCard; |