2019-02-03 17:23:33 +07:00
|
|
|
import styled, { css } from 'react-emotion';
|
2019-10-08 03:19:18 +07:00
|
|
|
|
2019-08-09 03:58:15 +07:00
|
|
|
import colors from '../../utils/styles/colors';
|
2019-02-03 17:23:33 +07:00
|
|
|
|
2019-07-15 16:57:32 +07:00
|
|
|
export const Content = styled('div')({
|
|
|
|
'&&': {
|
2019-08-09 03:58:15 +07:00
|
|
|
backgroundColor: colors.white,
|
2019-07-15 16:57:32 +07:00
|
|
|
flex: 1,
|
|
|
|
display: 'flex',
|
|
|
|
position: 'relative',
|
|
|
|
flexDirection: 'column',
|
|
|
|
},
|
|
|
|
});
|
2019-02-03 17:23:33 +07:00
|
|
|
|
2019-10-03 18:22:36 +07:00
|
|
|
interface ContainerProps {
|
|
|
|
isLoading: boolean;
|
|
|
|
}
|
|
|
|
|
2019-06-20 19:37:28 +07:00
|
|
|
export const Container = styled('div')`
|
2019-02-03 17:23:33 +07:00
|
|
|
&& {
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
min-height: 100vh;
|
|
|
|
overflow: hidden;
|
2019-10-03 18:22:36 +07:00
|
|
|
${({ isLoading }: ContainerProps) =>
|
|
|
|
isLoading &&
|
2019-02-03 17:23:33 +07:00
|
|
|
css`
|
|
|
|
${Content} {
|
|
|
|
background-color: #f5f6f8;
|
|
|
|
}
|
|
|
|
`}
|
|
|
|
`;
|