import React from "react";
import styled from "styled-components";
import { Divider, Row } from "antd";

const Header = styled.div`
  width: 1200px;
  height: 145px;
  background: rgba(255, 255, 255, 1);
  border-radius: 2px;
  padding: 40px;
  margin:0 auto;
  margin-bottom: 20px;
`;
const Job = styled.div`
  font-size: 20px;
  font-family: MicrosoftYaHeiSemibold;
  color: rgba(51, 51, 51, 1);
  margin-bottom:15px;
`;

const Item = styled.span`
  font-size: 14px;
  font-family: MicrosoftYaHei;
  color: rgba(51, 51, 51, 1);
`;

export default ({ jobName, company, city }) => {
  return (
    <Header>
      <Job>{jobName}</Job>
      <div>
        <Item>{company}</Item>
        <Divider type="vertical" />
        <Item>{city}</Item>
      </div>
    </Header>
  );
};
