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

let defaultClasses = 'px-4 py-2 leading-none inline-block text-sm no-underline uppercase'

let standardBtn = 'border hover:bg-teal hover:text-white hover:border-teal'

let filledBtn = 'text-grey-lightest bg-grey-darkest hover:bg-teal'

const Button = ({ ...props }) => (
  <div>
    <Link to={props.url} className={`${props.standard ? standardBtn : ''} ${props.filled ? filledBtn : ''} ${defaultClasses} ${props.classes}`}>{props.text}</Link>
  </div>
)

export default Button