import React from 'react'
import { css } from '@emotion/css'

type FooterProps = {
}

const Footer: React.FC<FooterProps> = ({ children }) => {
    return (
        <div
            className={css({
                display: 'block',
                gridArea: 'footer',
                backgroundColor: '#FAFBFC'
            })}
        >
            <nav
                className={css({
                    paddingLeft: 80,
                    paddingRight: 80,
                    paddingTop: 24,
                    paddingBottom: 24,
                    fontSize: 12,
                    lineHeight: 1.27273,
                    color: 'rgb(94, 108, 132)',
                    'a': {
                        marginLeft: 32,
                        color: '#5E6C84'
                    },
                    'a:hover': {
                        textDecoration: 'underline',
                        color: 'rgb(0, 101, 255)'
                    }
                })}
            >
                &copy; {(new Date().getFullYear())} knk Content Management Solutions GmbH
                <a href="https://knk.de/karriere/" target="_blank">
                    Careers
                </a>
                <a href="https://knk.de/impressum/" target="_blank">
                    Legal Notice
                </a>
            </nav>
        </div>
    )
}

export default Footer
