Merge pull request #143 from ONLYOFFICE/bugfix/new-files-panel-fix
Bugfix/new files panel fix
This commit is contained in:
commit
0f1c50a765
@ -1686,7 +1686,11 @@ class SectionBodyContent extends React.Component {
|
||||
) : (
|
||||
<Consumer>
|
||||
{(context) => (
|
||||
<RowContainer draggable useReactWindow={false}>
|
||||
<RowContainer
|
||||
className="files-row-container"
|
||||
draggable
|
||||
useReactWindow={false}
|
||||
>
|
||||
{items.map((item) => {
|
||||
const { checked, isFolder, value, contextOptions } = item;
|
||||
const sectionWidth = context.sectionWidth;
|
||||
|
@ -236,13 +236,17 @@ class NewFilesPanelComponent extends React.Component {
|
||||
<Backdrop onClick={onClose} visible={visible} zIndex={zIndex} />
|
||||
<Aside className="header_aside-panel" visible={visible}>
|
||||
<StyledContent>
|
||||
<StyledHeaderContent className="files-operations-panel">
|
||||
<Heading size="medium" truncate>
|
||||
<StyledHeaderContent>
|
||||
<Heading
|
||||
className="files-operations-header"
|
||||
size="medium"
|
||||
truncate
|
||||
>
|
||||
{t("NewFiles")}
|
||||
</Heading>
|
||||
</StyledHeaderContent>
|
||||
<StyledBody className="files-operations-body">
|
||||
<RowContainer useReactWindow manualHeight="83vh">
|
||||
<RowContainer useReactWindow manualHeight="87vh">
|
||||
{files.map((file) => {
|
||||
const element = this.getItemIcon(file);
|
||||
return (
|
||||
|
@ -23,7 +23,7 @@ import {
|
||||
StyledAsidePanel,
|
||||
StyledContent,
|
||||
StyledFooter,
|
||||
StyledSharingHeaderContent,
|
||||
StyledHeaderContent,
|
||||
StyledSharingBody,
|
||||
} from "../StyledPanels";
|
||||
import { AddUsersPanel, AddGroupsPanel, EmbeddingPanel } from "../index";
|
||||
@ -593,7 +593,7 @@ class SharingPanelComponent extends React.Component {
|
||||
<Backdrop onClick={this.onClose} visible={visible} zIndex={zIndex} />
|
||||
<Aside className="header_aside-panel" visible={visible}>
|
||||
<StyledContent>
|
||||
<StyledSharingHeaderContent>
|
||||
<StyledHeaderContent>
|
||||
<Heading className="sharing_panel-header" size="medium" truncate>
|
||||
{t("SharingSettingsTitle")}
|
||||
</Heading>
|
||||
@ -631,12 +631,8 @@ class SharingPanelComponent extends React.Component {
|
||||
onClick={this.onKeyClick}
|
||||
/>*/}
|
||||
</div>
|
||||
</StyledSharingHeaderContent>
|
||||
<StyledSharingBody
|
||||
ref={this.scrollRef}
|
||||
stype="mediumBlack"
|
||||
style={{ height: `calc(100vh - 157px)` }}
|
||||
>
|
||||
</StyledHeaderContent>
|
||||
<StyledSharingBody ref={this.scrollRef} stype="mediumBlack">
|
||||
{shareDataItems.map((item, index) => (
|
||||
<SharingRow
|
||||
key={index}
|
||||
|
@ -29,10 +29,7 @@ const PanelStyles = css`
|
||||
|
||||
const StyledAsidePanel = styled.div`
|
||||
z-index: 310;
|
||||
.sharing_panel-header {
|
||||
font-weight: 700;
|
||||
margin: 14px 0;
|
||||
}
|
||||
|
||||
.modal-dialog-aside {
|
||||
padding: 0;
|
||||
transform: translateX(${(props) => (props.visible ? "0" : "500px")});
|
||||
@ -110,10 +107,6 @@ const StyledContent = styled.div`
|
||||
background-color: #fff;
|
||||
padding: 0 16px;
|
||||
|
||||
.files-operations-panel {
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header_aside-panel-header {
|
||||
max-width: 500px;
|
||||
margin: 0 0 0 16px;
|
||||
@ -129,6 +122,28 @@ const StyledContent = styled.div`
|
||||
const StyledHeaderContent = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.sharing_panel-icons-container {
|
||||
display: flex;
|
||||
margin-left: auto;
|
||||
|
||||
.sharing_panel-drop-down-wrapper {
|
||||
position: relative;
|
||||
|
||||
.sharing_panel-drop-down {
|
||||
padding: 4px 0;
|
||||
}
|
||||
.sharing_panel-plus-icon {
|
||||
//margin-right: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.files-operations-header,
|
||||
.sharing_panel-header {
|
||||
font-weight: 700;
|
||||
margin: 14px 0;
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledBody = styled.div`
|
||||
@ -212,31 +227,10 @@ const StyledBody = styled.div`
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledSharingHeaderContent = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
|
||||
.sharing_panel-icons-container {
|
||||
display: flex;
|
||||
margin-left: auto;
|
||||
|
||||
.sharing_panel-drop-down-wrapper {
|
||||
position: relative;
|
||||
|
||||
.sharing_panel-drop-down {
|
||||
padding: 4px 0;
|
||||
}
|
||||
.sharing_panel-plus-icon {
|
||||
//margin-right: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledSharingBody = styled(Scrollbar)`
|
||||
position: relative;
|
||||
padding: 16px 0;
|
||||
height: calc(100vh - 157px) !important;
|
||||
|
||||
.row_content {
|
||||
overflow: visible;
|
||||
@ -366,7 +360,6 @@ export {
|
||||
StyledContent,
|
||||
StyledHeaderContent,
|
||||
StyledBody,
|
||||
StyledSharingHeaderContent,
|
||||
StyledSharingBody,
|
||||
StyledFooter,
|
||||
};
|
||||
|
@ -392,7 +392,10 @@ class SectionBodyContent extends React.PureComponent {
|
||||
<>
|
||||
<Consumer>
|
||||
{(context) => (
|
||||
<RowContainer className="people-row" useReactWindow={false}>
|
||||
<RowContainer
|
||||
className="people-row-container"
|
||||
useReactWindow={false}
|
||||
>
|
||||
{peopleList.map((man) => {
|
||||
const {
|
||||
checked,
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "asc-web-common",
|
||||
"version": "1.0.281",
|
||||
"version": "1.0.282",
|
||||
"description": "Ascensio System SIA common components and solutions library",
|
||||
"license": "AGPL-3.0",
|
||||
"files": [
|
||||
|
@ -26,6 +26,11 @@ const commonStyles = css`
|
||||
flex-direction: column;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.people-row-container,
|
||||
.files-row-container {
|
||||
margin-top: -22px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "asc-web-components",
|
||||
"version": "1.0.488",
|
||||
"version": "1.0.489",
|
||||
"description": "Ascensio System SIA component library",
|
||||
"license": "AGPL-3.0",
|
||||
"main": "dist/asc-web-components.js",
|
||||
|
@ -15,7 +15,6 @@ const StyledRowContainer = styled.div`
|
||||
: "100%"
|
||||
: "auto"};
|
||||
position: relative;
|
||||
margin-top:-18px;
|
||||
`;
|
||||
|
||||
class RowContainer extends React.PureComponent {
|
||||
|
Loading…
Reference in New Issue
Block a user