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

type Props = {
  children?: ReactNode;
};

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

  return (
    <footer className={`px-5 py-5 lg:px-8 ${containerMaxW}`}>
      <div className='flex flex-col gap-2 border-t border-slate-200 pt-5 text-xs text-slate-500 md:flex-row md:items-center md:justify-between'>
        <div>
          <span className='font-semibold text-slate-700'>
            © {year} B2B Distributor Portal.
          </span>{' '}
          {children}
        </div>
        <a
          href='https://flatlogic.com/'
          rel='noreferrer'
          target='_blank'
          className='font-semibold text-emerald-700'
        >
          Powered by Flatlogic
        </a>
      </div>
    </footer>
  );
}
