sigit.io/src/components/Landing/CardComponent/CardComponent.tsx

import { Box } from '@mui/material'
import { ReactElement } from 'react'

import styles from './style.module.scss'

interface CardComponentProps {
  icon: ReactElement
  title: ReactElement
  description: ReactElement
  actions?: ReactElement
}

export const CardComponent = ({
  icon,
  title,
  description,
  actions
}: CardComponentProps) => {
  return (
    <div className={styles.card}>
      <h3 className={styles.title}>
        <div className={styles.icon}>{icon}</div>
        {title}
      </h3>
      <p className={styles.description}>{description}</p>
      <Box mt={'auto'} textAlign={'right'}>
        {actions}
      </Box>
    </div>
  )
}