import React from "react";
import styled from "styled-components";
import colors from "@theme/colors";
import HeaderLogo from "./HeaderLogo";

const Header = styled.header`
  background-color: ${colors.darkBlue};
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;

  a {
    flex: 1 0 auto;
    margin: 0.5rem auto;
    max-width: 600px;

    img {
      fill: ${colors.white};
    }
  }
`;

const AdminHeader: React.FC = () => (
  <Header>
    <HeaderLogo />
  </Header>
);

export default AdminHeader;