diff --git a/packages/asc-web-common/components/PageLayout/sub-components/article-body.js b/packages/asc-web-common/components/PageLayout/sub-components/article-body.js index 0be5f8e943..c0e9bab7b1 100644 --- a/packages/asc-web-common/components/PageLayout/sub-components/article-body.js +++ b/packages/asc-web-common/components/PageLayout/sub-components/article-body.js @@ -9,8 +9,8 @@ import { isMobile } from "react-device-detect"; const StyledArticleBody = styled.div` ${(props) => props.displayBorder && `outline: 1px dotted;`} flex-grow: 1; - height: 100%; + ${(props) => (props.isDesktop ? "height:auto" : "height:100%")}; .custom-scrollbar { width: calc(100% + 24px) !important; } diff --git a/packages/asc-web-common/components/PageLayout/sub-components/section-body.js b/packages/asc-web-common/components/PageLayout/sub-components/section-body.js index c49ef976c2..7de9619356 100644 --- a/packages/asc-web-common/components/PageLayout/sub-components/section-body.js +++ b/packages/asc-web-common/components/PageLayout/sub-components/section-body.js @@ -12,7 +12,9 @@ import { tablet, desktop } from "@appserver/components/utils/device"; const commonStyles = css` flex-grow: 1; - height: 100%; + + ${(props) => (props.isDesktop ? "height: auto" : "height: 100%")}; + border-left: none; -webkit-user-select: none; @@ -114,6 +116,7 @@ class SectionBody extends React.Component { viewAs, withScroll, isLoaded, + isDesktop, } = this.props; const focusProps = autoFocus @@ -131,6 +134,7 @@ class SectionBody extends React.Component { viewAs={viewAs} pinned={pinned} isLoaded={isLoaded} + isDesktop={isDesktop} className="section-body" > {withScroll ? ( @@ -219,7 +223,10 @@ SectionBody.defaultProps = { }; export default inject(({ auth }) => { + const { settingsStore } = auth; + const { isDesktopClient: isDesktop } = settingsStore; return { isLoaded: auth.isLoaded, + isDesktop, }; })(observer(SectionBody));