coop-cloud-chaos-patchs/outline
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Sidebar on edit mode

Browse Source
This commit is contained in:
Jori Lallo
2017-06-25 00:29:40 -07:00
parent b8d0666c63
commit 7439b9ecf5
2 changed files with 65 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/components/Layout/Layout.js
View File

@ -80,7 +80,7 @@ type Props = {
<Flex auto>
{auth.authenticated &&
user &&
<Sidebar column>
<Sidebar column editMode={ui.editMode}>
<Header justify="space-between">
<Flex align="center">
<LogoLink to="/">Atlas</LogoLink>
@ -119,7 +119,7 @@ type Props = {
</Flex>
</Sidebar>}
<Content auto justify="center">
<Content auto justify="center" editMode={ui.editMode}>
{this.props.children}
</Content>
</Flex>
@ -159,14 +159,17 @@ const Content = styled(Flex)`
top: 0;
bottom: 0;
right: 0;
left: 250px;
left: ${props => (props.editMode ? 0 : '250px')};
transition: left 200ms ease-in-out;
`;
const Sidebar = styled(Flex)`
width: 250px;
margin-left: ${props => (props.editMode ? '-250px' : 0)};
padding: 10px 20px;
background: rgba(250, 251, 252, 0.71);
border-right: 1px solid #eceff3;
transition: margin-left 200ms ease-in-out;
`;
const Header = styled(Flex)`