old-v2-frontend/src/components/Card.js

import React from 'react'
import Link from 'gatsby-link'

import ImgSprint from '../images/wow-we-did-design-sprint-remotely.png'

const Card = ({ ...props }) => (
  <article className="h-full w-full rounded overflow-hidden shadow bg-white border-bottom-saburly hover:shadow-md">
    <div className="relative hover:opacity-50">
      {props.image && <img className="w-full" src={props.image.src} />}
      {props.teamMember && <img className="w-full" src={props.teamMember} />}
      <div
        className={`px-6 py-4 ${
          props.team ? 'absolute pin-b' : ''
        } text-center w-full bg-white-opacity`}
      >
        <h3 className="text-black text-center text-xl">{props.title}</h3>
        {props.subtitle && (
          <span className="text-sm font-medium text-black pt-1 opacity-70">
            {props.subtitle}
          </span>
        )}
      </div>
    </div>
    {props.team && <div className="px-6 py-4">{props.children}</div>}
  </article>
)

export default Card