import React, { ReactNode } from 'react'
import { containerMaxW } from '../config'
import Logo from './Logo'

type Props = {
  children?: ReactNode
}

export default function FooterBar({ children }: Props) {
  const year = new Date().getFullYear()

  return (
    <footer className={`py-2 px-6 ${containerMaxW}`}>
      <div className="block md:flex items-center justify-between">
        <div className="text-center md:text-left mb-6 md:mb-0">
          <b>
            &copy;{year},{` `}
            <a href="https://flatlogic.com/" rel="noreferrer" target="_blank">
              Flatlogic
            </a>
            .
          </b>
          {` `}
          {children}
        </div>

          <div className="flex item-center md:py-2 gap-4">
              <a href="https://flatlogic.com/" rel="noreferrer" target="_blank">
                  <Logo className="w-auto h-8 md:h-6 mx-auto" />
              </a>
          </div>
      </div>
    </footer>
  )
}