Merge branch 'feature/virtual-rooms-1.2' into feature/redesign-sharing-panel
This commit is contained in:
commit
1f6dc5c8da
@ -105,6 +105,8 @@ const Navigation = ({
|
||||
getContextOptionsFolder={getContextOptionsFolder}
|
||||
getContextOptionsPlus={getContextOptionsPlus}
|
||||
toggleDropBox={toggleDropBox}
|
||||
toggleInfoPanel={toggleInfoPanel}
|
||||
isInfoPanelVisible={isInfoPanelVisible}
|
||||
onClickAvailable={onClickAvailable}
|
||||
/>
|
||||
)}
|
||||
|
@ -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;
|
||||
`}
|
||||
`;
|
||||
|
||||
|
@ -31,7 +31,6 @@ const StyledContainer = styled.div`
|
||||
}
|
||||
|
||||
.option-button {
|
||||
margin-left: auto;
|
||||
margin-right: 15px;
|
||||
min-width: 17px;
|
||||
}
|
||||
@ -46,7 +45,7 @@ const StyledInfoPanelToggleWrapper = styled.div`
|
||||
align-items: center;
|
||||
align-self: center;
|
||||
justify-content: center;
|
||||
margin-left: ${({ isRootFolder }) => (isRootFolder ? "auto" : "none")};
|
||||
margin-left: auto;
|
||||
|
||||
.info-panel-toggle-bg {
|
||||
height: 32px;
|
||||
|
@ -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>
|
||||
|
||||
|
@ -22,7 +22,7 @@ const tabletProps = css`
|
||||
${isMobileOnly &&
|
||||
css`
|
||||
padding: 0 16px;
|
||||
margin: 0 -16px;
|
||||
margin: 0 0 0 -16px;
|
||||
`}
|
||||
}
|
||||
.section-body_filter {
|
||||
|
@ -11,59 +11,42 @@ import Base from "@appserver/components/themes/base";
|
||||
|
||||
const StyledSectionHeader = styled.div`
|
||||
position: relative;
|
||||
height: 53px;
|
||||
min-height: 53px;
|
||||
margin-right: 20px;
|
||||
|
||||
padding-right: 20px;
|
||||
|
||||
box-sizing: border-box;
|
||||
|
||||
${NoUserSelect}
|
||||
|
||||
display: grid;
|
||||
align-items: center;
|
||||
|
||||
/* width: calc(100vw - 296px);
|
||||
max-width: calc(100vw - 296px); */
|
||||
|
||||
width: ${(props) =>
|
||||
props.infoPanelIsVisible ? "calc(100vw - 696px)" : "calc(100vw - 296px)"};
|
||||
max-width: ${(props) =>
|
||||
props.infoPanelIsVisible ? "calc(100vw - 696px)" : "calc(100vw - 296px)"};
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
|
||||
@media ${tablet} {
|
||||
width: ${(props) =>
|
||||
props.showText ? "calc(100vw - 272px)" : "calc(100vw - 84px)"};
|
||||
max-width: ${(props) =>
|
||||
props.showText ? "calc(100vw - 272px)" : "calc(100vw - 84px)"};
|
||||
height: 61px;
|
||||
min-height: 61px;
|
||||
margin-right: 0px !important;
|
||||
padding-right: 16px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
${isMobile &&
|
||||
css`
|
||||
width: ${(props) =>
|
||||
props.showText ? "calc(100vw - 272px)" : "calc(100vw - 84px)"} !important;
|
||||
max-width: ${(props) =>
|
||||
props.showText ? "calc(100vw - 272px)" : "calc(100vw - 84px)"} !important;
|
||||
height: 61px !important;
|
||||
min-height: 61px !important;
|
||||
margin-right: 0px !important;
|
||||
padding-right: 0 !important;
|
||||
margin-right: -16px !important;
|
||||
`}
|
||||
|
||||
@media ${mobile} {
|
||||
width: calc(100vw - 32px) !important;
|
||||
max-width: calc(100vw - 32px) !important;
|
||||
height: 53px;
|
||||
min-height: 53px;
|
||||
margin-right: 0px !important;
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
${isMobileOnly &&
|
||||
css`
|
||||
width: calc(100vw - 32px) !important;
|
||||
max-width: calc(100vw - 32px) !important;
|
||||
height: 53px;
|
||||
min-height: 53px;
|
||||
margin-top: -2px;
|
||||
margin-right: 0px !important;
|
||||
width: 100vw !important;
|
||||
max-width: 100vw !important;
|
||||
|
||||
padding-right: 16px !important;
|
||||
|
||||
margin-top: -2px !important;
|
||||
`}
|
||||
`;
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user