Web: Files: VersionHistoryPanel: Deleted body scroll? fixed styles.
# Conflicts: # packages/asc-web-common/components/PageLayout/sub-components/section-body.js
This commit is contained in:
parent
77271fabe3
commit
76b4251559
@ -210,6 +210,7 @@ class PageLayout extends React.Component {
|
|||||||
isBackdropVisible,
|
isBackdropVisible,
|
||||||
isArticlePinned,
|
isArticlePinned,
|
||||||
isDesktop,
|
isDesktop,
|
||||||
|
isLoadingContent,
|
||||||
} = this.props;
|
} = this.props;
|
||||||
let articleHeaderContent = null;
|
let articleHeaderContent = null;
|
||||||
let articleMainButtonContent = null;
|
let articleMainButtonContent = null;
|
||||||
@ -377,6 +378,7 @@ class PageLayout extends React.Component {
|
|||||||
autoFocus={isMobile || isTabletView ? false : true}
|
autoFocus={isMobile || isTabletView ? false : true}
|
||||||
pinned={isArticlePinned}
|
pinned={isArticlePinned}
|
||||||
viewAs={viewAs}
|
viewAs={viewAs}
|
||||||
|
isLoadingContent={isLoadingContent}
|
||||||
>
|
>
|
||||||
{isSectionFilterAvailable && (
|
{isSectionFilterAvailable && (
|
||||||
<SubSectionFilter className="section-body_filter">
|
<SubSectionFilter className="section-body_filter">
|
||||||
|
@ -27,16 +27,31 @@ const commonStyles = css`
|
|||||||
` height: 100%;
|
` height: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
`}
|
`}
|
||||||
flex: 1 0 auto;
|
|
||||||
padding: 17px 7px 16px 24px;
|
padding: 17px 7px 16px 24px;
|
||||||
outline: none;
|
|
||||||
${(props) =>
|
${(props) =>
|
||||||
|
!props.isLoadingContent &&
|
||||||
|
css`
|
||||||
|
flex: 1 0 auto;
|
||||||
|
|
||||||
|
outline: none;
|
||||||
|
${(props) =>
|
||||||
props.viewAs == "tile" &&
|
props.viewAs == "tile" &&
|
||||||
css`
|
css`
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
padding-left: 20px;
|
padding-left: 20px;
|
||||||
`}
|
`}
|
||||||
|
|
||||||
|
.section-wrapper {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.people-row-container,
|
||||||
|
.files-row-container {
|
||||||
|
margin-top: -22px;
|
||||||
|
}
|
||||||
|
`}
|
||||||
@media ${tablet} {
|
@media ${tablet} {
|
||||||
padding: 16px 0 16px 24px;
|
padding: 16px 0 16px 24px;
|
||||||
}
|
}
|
||||||
@ -132,8 +147,9 @@ class SectionBody extends React.Component {
|
|||||||
viewAs,
|
viewAs,
|
||||||
withScroll,
|
withScroll,
|
||||||
isLoaded,
|
isLoaded,
|
||||||
|
isLoadingContent,
|
||||||
} = this.props;
|
} = this.props;
|
||||||
|
console.log("isLoaded", isLoaded);
|
||||||
const focusProps = autoFocus
|
const focusProps = autoFocus
|
||||||
? {
|
? {
|
||||||
ref: this.focusRef,
|
ref: this.focusRef,
|
||||||
@ -172,7 +188,7 @@ class SectionBody extends React.Component {
|
|||||||
) : (
|
) : (
|
||||||
<div className="section-wrapper">
|
<div className="section-wrapper">
|
||||||
{children}
|
{children}
|
||||||
{/* <StyledSpacer pinned={pinned} /> */}
|
<StyledSpacer pinned={pinned} />
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</StyledDropZoneBody>
|
</StyledDropZoneBody>
|
||||||
@ -182,6 +198,7 @@ class SectionBody extends React.Component {
|
|||||||
withScroll={withScroll}
|
withScroll={withScroll}
|
||||||
pinned={pinned}
|
pinned={pinned}
|
||||||
isLoaded={isLoaded}
|
isLoaded={isLoaded}
|
||||||
|
isLoadingContent={isLoadingContent}
|
||||||
>
|
>
|
||||||
{withScroll ? (
|
{withScroll ? (
|
||||||
!isMobile ? (
|
!isMobile ? (
|
||||||
@ -203,7 +220,7 @@ class SectionBody extends React.Component {
|
|||||||
)
|
)
|
||||||
) : (
|
) : (
|
||||||
<div className="section-wrapper">
|
<div className="section-wrapper">
|
||||||
{children}
|
<div className="section-wrapper-content">{children}</div>
|
||||||
{/* <StyledSpacer pinned={pinned} /> */}
|
{/* <StyledSpacer pinned={pinned} /> */}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
@ -227,6 +244,7 @@ SectionBody.propTypes = {
|
|||||||
]),
|
]),
|
||||||
viewAs: PropTypes.string,
|
viewAs: PropTypes.string,
|
||||||
isLoaded: PropTypes.bool,
|
isLoaded: PropTypes.bool,
|
||||||
|
isLoadingContent: PropTypes.bool,
|
||||||
};
|
};
|
||||||
|
|
||||||
SectionBody.defaultProps = {
|
SectionBody.defaultProps = {
|
||||||
@ -234,6 +252,7 @@ SectionBody.defaultProps = {
|
|||||||
pinned: false,
|
pinned: false,
|
||||||
uploadFiles: false,
|
uploadFiles: false,
|
||||||
withScroll: true,
|
withScroll: true,
|
||||||
|
isLoadingContent: false,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default inject(({ auth }) => {
|
export default inject(({ auth }) => {
|
||||||
|
@ -109,9 +109,12 @@ const StyledVersionHistoryPanel = styled.div`
|
|||||||
}
|
}
|
||||||
.version-history-panel-body {
|
.version-history-panel-body {
|
||||||
padding: ${(props) => (props.isLoading ? "16px 0" : null)};
|
padding: ${(props) => (props.isLoading ? "16px 0" : null)};
|
||||||
margin: 0 16px;
|
margin-left: 16px;
|
||||||
border-top: 1px solid #eceef1;
|
border-top: 1px solid #eceef1;
|
||||||
|
|
||||||
|
height: calc(100% - 53px);
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
.version-comment-wrapper {
|
.version-comment-wrapper {
|
||||||
margin-left: 79px;
|
margin-left: 79px;
|
||||||
}
|
}
|
||||||
@ -170,8 +173,11 @@ const StyledContent = styled.div`
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
|
||||||
|
.version-history-panel-body {
|
||||||
|
}
|
||||||
.header_aside-panel-header {
|
.header_aside-panel-header {
|
||||||
max-width: 500px;
|
max-width: 500px;
|
||||||
margin: 0 0 0 16px;
|
margin: 0 0 0 16px;
|
||||||
|
@ -51,7 +51,7 @@ class PureVersionHistoryPanel extends React.Component {
|
|||||||
zIndex={zIndex}
|
zIndex={zIndex}
|
||||||
isAside={true}
|
isAside={true}
|
||||||
/>
|
/>
|
||||||
<Aside className="version-history-aside-panel">
|
<Aside className="version-history-aside-panel" withoutBodyScroll>
|
||||||
<StyledContent>
|
<StyledContent>
|
||||||
<StyledHeaderContent className="version-history-panel-header">
|
<StyledHeaderContent className="version-history-panel-header">
|
||||||
{versions && !isLoading ? (
|
{versions && !isLoading ? (
|
||||||
|
Loading…
Reference in New Issue
Block a user