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">
    <Link
      to={props.url}
      className="pointer no-underline saburly-transition hover:opacity-50"
    >
      {props.image ? (
        <img className="w-full" src={props.image.src} />
      ) : (
        <img className="w-full" src={ImgSprint} alt="Sprint Work" />
      )}
      <div className="px-6 py-4">
        <h3 className="text-black font-bold text-3xl mb-2">{props.title}</h3>
        <p
          className="text-black-light text-base"
          dangerouslySetInnerHTML={{ __html: props.excerpt }}
        />
      </div>
    </Link>
  </article>
)

export default Card