IlyaSobolev/DocSpace-buildtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web:Common:Components: fix navigation layouts

Browse Source
This commit is contained in:
Timofey Boyko 2022-04-07 17:28:18 +03:00
parent 2f218e6de2
commit 7bc5c357c8
3 changed files with 14 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/asc-web-common/components/Navigation/Navigation.js
View File

@ -105,6 +105,8 @@ const Navigation = ({
getContextOptionsFolder={getContextOptionsFolder}
getContextOptionsPlus={getContextOptionsPlus}
toggleDropBox={toggleDropBox}
toggleInfoPanel={toggleInfoPanel}
isInfoPanelVisible={isInfoPanelVisible}
onClickAvailable={onClickAvailable}
/>
)}

11
packages/asc-web-common/components/Navigation/StyledNavigation.js
View File

@ -9,6 +9,8 @@ const StyledContainer = styled.div`
grid-template-columns: ${(props) =>
props.isRootFolder ? "auto 1fr" : "29px auto 1fr"};
padding: ${(props) => (props.isDropBox ? "10px 0 5px" : "10px 0 11px")};
.arrow-button {
width: 17px;
min-width: 17px;
@ -16,24 +18,25 @@ const StyledContainer = styled.div`
@media ${tablet} {
width: 100%;
padding: ${(props) => (props.isDropBox ? "16px 0 5px" : "16px 0 0px")};
padding: ${(props) => (props.isDropBox ? "14px 0 5px" : "14px 0 15px")};
}
${isMobile &&
css`
width: 100%;
padding: ${(props) =>
props.isDropBox ? "16px 0 5px" : " 16px 0 0px"} !important;
props.isDropBox ? "12px 0 5px" : " 12px 0 13px"} !important;
`}
@media ${mobile} {
height: 53px;
padding: ${(props) =>
props.isDropBox ? "10px 0 5px" : "10px 0 11px"} !important;
}
${isMobileOnly &&
css`
width: 100% !important;
padding: ${(props) =>
props.isDropBox ? "18px 0 5px" : "18px 0 0"} !important;
props.isDropBox ? "10px 0 5px" : "10px 0 11px"} !important;
`}
`;

6
packages/asc-web-common/components/Navigation/sub-components/drop-box.js
View File

@ -26,7 +26,7 @@ const StyledBox = styled.div`
top: 0px;
left: ${isMobile ? "-16px" : "-20px"};
padding: ${isMobile ? "0 16px 0 16px" : "0 20px"};
padding: ${isMobile ? "0 16px " : "0 20px"};
width: ${(props) => props.dropBoxWidth}px;
@ -85,7 +85,9 @@ const DropBox = React.forwardRef(
getContextOptionsFolder,
getContextOptionsPlus,
toggleDropBox,
toggleInfoPanel,
onClickAvailable,
isInfoPanelVisible,
},
ref
) => {
@ -141,6 +143,8 @@ const DropBox = React.forwardRef(
canCreate={canCreate}
getContextOptionsFolder={getContextOptionsFolder}
getContextOptionsPlus={getContextOptionsPlus}
toggleInfoPanel={toggleInfoPanel}
isInfoPanelVisible={isInfoPanelVisible}
/>
</StyledContainer>