import React, { ReactNode } from 'react'

type Props = {
  custom?: boolean
  first?: boolean
  last?: boolean
  children: ReactNode
}

const SectionTitle = ({ custom = false, first = false, last = false, children }: Props) => {
  let classAddon = '-my-6'

  if (first) {
    classAddon = '-mb-6'
  } else if (last) {
    classAddon = '-mt-6'
  }

  return (
    <section className={`py-24 px-6 lg:px-0 lg:max-w-2xl lg:mx-auto text-center ${classAddon}`}>
      {custom && children}
      {!custom && <h1 className="text-2xl text-gray-500 dark:text-slate-400">{children}</h1>}
    </section>
  )
}

export default SectionTitle