43 lines
750 B
JavaScript
43 lines
750 B
JavaScript
import Auth from './Auth';
|
|
import Logo from './Logo';
|
|
import { min } from '@/styles/mq';
|
|
import styled from 'styled-components';
|
|
import { Flex } from 'ui/grid';
|
|
|
|
const HeaderContent = styled(Flex)`
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
|
|
background: linear-gradient(
|
|
90deg,
|
|
var(--color-primary) 0%,
|
|
var(--color-secondary) 50%,
|
|
var(--color-tertiarty) 100%
|
|
);
|
|
|
|
padding: 10px 12px;
|
|
${min('laptop')} {
|
|
padding: 10px 12px;
|
|
padding-left: 20px;
|
|
}
|
|
`;
|
|
|
|
const Wrapper = styled.header`
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 999999;
|
|
`;
|
|
|
|
function Header() {
|
|
return (
|
|
<Wrapper>
|
|
<HeaderContent>
|
|
<Logo />
|
|
<Auth />
|
|
</HeaderContent>
|
|
</Wrapper>
|
|
);
|
|
}
|
|
|
|
export default Header;
|