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

let headlineDark = 'text-white'
let headlineLight = 'text-indigo'

const IntroDefault = ({ ...props }) => (
  <div className={`${props.classes}`}>
    <h3
      className={`
      ${
        props.light ? headlineDark : headlineLight
      } opacity-50 text-sm font-light uppercase pt-2 pb-1`}
    >
      {props.intro}
    </h3>
    <h1
      className={`${props.light ? headlineDark : ''}
     font-light pt-1 pb-2`}
    >
      {props.headline}
    </h1>
    <p
      className={`${props.light ? headlineDark : ''} 
    font-light leading-normal opacity-75`}
    >
      {props.text}
    </p>
  </div>
)

export default IntroDefault