import propTypes from 'prop-types';

const api_url = process.env.REACT_APP_API_URL;

export default function Card(props) {
  return (
    <div className="card mb-8 lg:mb-0 lg:mr-8" key={props.key}>
      <img src={api_url + props.image} className="ml-auto mr-auto block w-2/5 bg-baby-blue text-dark-gray rounded-full p-4" />
      <h3 className="mt-6 font-semibold text-2xl">{props.heading}</h3>
      <p className="mt-6 text-sm">
        {props.paragraph}
      </p>
    </div>
  );
}

Card.propTypes = {
  key: propTypes.number,
  image: propTypes.string,
  heading: propTypes.string,
  paragraph: propTypes.string,
};
