import { Link } from 'react-router-dom';
import LogoUrl from '../../../assets/img/logo-white.svg';
import Navi from './Navi';

import styled from 'styled-components';

const LogoWrapper = styled.h1`
	display: flex;
	justify-content: center;
	align-items: center;
	height: 150px;
	background: #333;
`;
const Logo = styled.img`
	display: block;
`;

const Header = () => {
	return (
		<header>
			<LogoWrapper>
				<Link to="/main">
					<Logo src={LogoUrl} alt="" />
				</Link>
			</LogoWrapper>
			<Navi />
		</header>
	);
};

export default Header;
