diligent-next/components/cards/data-card/DataCard.jsx

import { Divider, Paper, Typography } from '@mui/material';

const DataCard = ({ data, t }) => {
  return (
    <Paper sx={{ p: 3, height: '100%' }} elevation={3}>
      <Typography sx={{ fontWeight: 600 }}>{t('Name')}</Typography>
      <Typography display="inline"> {data.name}</Typography>
      <Divider />
      <Typography sx={{ fontWeight: 600 }}>{t('Age')}</Typography>
      <Typography display="inline"> {data.age}</Typography>
      <Divider />
      <Typography sx={{ fontWeight: 600 }}>{t('Gender')}</Typography>
      <Typography display="inline"> {data.gender}</Typography>
      <Divider />
    </Paper>
  );
};

export default DataCard;