import React from "react";
import Image from "next/image";
import styled from "styled-components";
import { Link } from "@components/index";

const TitleImage = "/img/SIK_RGB_W_side.png";

const Logo = styled(Link)`
  position: relative;
  min-width: 200px;
  min-height: 100px;
  margin: 1rem 0 !important;
  flex: 1 0 auto;
`;

const HeaderLogo: React.FC = () => (
  <Logo to="/">
    <Image
      src={TitleImage}
      alt="logo"
      layout="fill"
      objectFit="scale-down"
    />
  </Logo>
);

export default HeaderLogo;
