2019-06-20 19:37:28 +07:00
|
|
|
import React from 'react';
|
2019-11-23 19:41:14 +07:00
|
|
|
import styled from '@emotion/styled';
|
2019-10-08 03:19:18 +07:00
|
|
|
|
2019-06-20 19:37:28 +07:00
|
|
|
import logo from './img/logo.svg';
|
|
|
|
|
2019-07-10 16:25:12 +07:00
|
|
|
export enum Size {
|
|
|
|
Small = '40px',
|
|
|
|
Big = '90px',
|
|
|
|
}
|
|
|
|
|
2019-07-09 23:45:35 +07:00
|
|
|
interface Props {
|
2019-07-10 16:25:12 +07:00
|
|
|
size?: Size;
|
2019-07-09 23:45:35 +07:00
|
|
|
}
|
|
|
|
|
2019-11-23 19:41:14 +07:00
|
|
|
const StyledLogo = styled('div')<Props>(props => ({
|
|
|
|
display: 'inline-block',
|
|
|
|
verticalAlign: 'middle',
|
|
|
|
boxSizing: 'border-box',
|
|
|
|
backgroundPosition: 'center',
|
|
|
|
backgroundSize: 'contain',
|
|
|
|
backgroundImage: `url(${logo})`,
|
|
|
|
backgroundRepeat: ' no-repeat',
|
|
|
|
width: props.size,
|
|
|
|
height: props.size,
|
|
|
|
}));
|
|
|
|
|
2019-07-10 16:25:12 +07:00
|
|
|
const Logo: React.FC<Props> = ({ size = Size.Small }) => {
|
|
|
|
return <StyledLogo size={size} />;
|
2019-06-20 19:37:28 +07:00
|
|
|
};
|
|
|
|
|
|
|
|
export default Logo;
|