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

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

export default () => (
  <Content>
    <div className="container">
      <Link href="/jobs">
        <h1 className={titleStyle}>
          Jobs
        </h1>
      </Link>
      <ul>
        <li className={listStyle}>
          > from 12/2011 to now - <Anchor href="http://www.cwi.com.br/" title="cwi software">CWI Software</Anchor>
          <br />
          Web developer
        </li>
        <li className={listStyle}>
          > from 10/2011 to 12/2012 - <Anchor href="http://www.brivia.com.br/" title="brivia">Brivia</Anchor>
          <br />
          Web developer
        </li>
        <li className={listStyle}>
          > from 02/2011 to 10/2011 - <Anchor href="http://www.brivia.com.br/" title="brivia">Brivia</Anchor>
          <br />
          Intern web developer
        </li>
      </ul>
    </div>
  </Content>
);

const titleStyle = css({
  color: '#000',
  marginBottom: '10px'
});

const listStyle = css({
  fontSize: '10pt',
  listStyle: 'none',
  marginBottom: '20px',
  textAlign: 'left'
});