// Packages
import React from 'react';
import css from 'next/css';

// Components
import Anchor from '../common/Anchor';

export default () => (
  <header className={headerStyle}>
    <h1 className={titleStyle}>Rômulo Alves</h1>
    <h2 className={subtitleStyle}>
      Web Developer at <Anchor href="https://www.cwi.com.br/" title="CWI Software" color="#FFF">@cwisoftware</Anchor>
    </h2>
  </header>
);

const headerStyle = css({
  background: '#EF5350',
  color: '#FFF',
  left: 0,
  padding: '50px 0',
  right: 0,
  textAlign: 'center',
  top: 0
});

const titleStyle = css({
  fontSize: '25pt'
});

const subtitleStyle = css({
  fontSize: '12pt'
});