mukeshs/twenty_crm
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Fix layout behavior with Right panel open (#160)

Browse Source
This commit is contained in:
Charles Bochet
2023-05-31 09:52:17 +02:00
committed by GitHub
parent cb259d5cf1
commit 910d49f559
5 changed files with 13 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
front/src/layout/containers/MainContainer.tsx
View File

@ -1,12 +0,0 @@
import styled from '@emotion/styled';
import React from 'react';
const StyledMainContainer = styled.div`
display: flex;
flex-direction: row;
overflow: hidden;
`;
export function MainContainer({ children }: { children: React.ReactNode }) {
return <StyledMainContainer>{children}</StyledMainContainer>;
}

14
front/src/layout/containers/WithTopBarContainer.tsx
View File

@ -19,15 +19,16 @@ const StyledContainer = styled.div`
width: 100%;
`;
const TOPBAR_HEIGHT = '48px';
const MainContainer = styled.div`
display: flex;
flex-direction: row;
height: 100%;
width: calc(100% - 16px);
margin-right: 8px;
margin-bottom: 8px;
gap: 8px;
padding: 4px;
width: calc(100% - ${(props) => props.theme.spacing(3)});
height: calc(100% - ${TOPBAR_HEIGHT} - ${(props) => props.theme.spacing(3)});
background: ${(props) => props.theme.noisyBackground};
padding-right: ${(props) => props.theme.spacing(3)};
padding-bottom: ${(props) => props.theme.spacing(3)};
`;
const RIGHT_DRAWER_WIDTH = '300px';
@ -41,6 +42,7 @@ const LeftContainer = styled.div<LeftContainerProps>`
width: calc(
100% - ${(props) => (props.isRightDrawerOpen ? RIGHT_DRAWER_WIDTH : '0px')}
);
position: relative;
`;
function FullWidthContainer({