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

Web:Files:Components: remove movile view for sharing panel for mobile devices with width more than 500px

Browse Source
This commit is contained in:
Timofey Boyko 2022-04-26 11:27:24 +03:00
parent b35d715eb3
commit 3826ddb5c4
3 changed files with 12 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
products/ASC.Files/Client/src/components/panels/SharingPanel/StyledSharingPanel.js
View File

@ -3,42 +3,6 @@ import styled, { css } from "styled-components";
import { isMobile, isMobileOnly } from "react-device-detect";
const StyledContainer = styled.div`
transition: unset;
transform: translateX(${(props) => (props.visible ? "0" : "480px")});
width: 480px;
height: 100%;
position: fixed;
max-width: 480px;
overflow-y: hidden;
right: 0;
bottom: 0;
background: ${(props) => props.theme.aside.backgroundColor};
z-index: 311;
@media (max-width: 500px) {
position: fixed;
top: unset;
bottom: 0;
right: 0;
width: 100%;
height: calc(100% - 64px);
}
.panel_combo-box {
.optionalBlock {
margin-right: -3px;
}
}
`;
StyledContainer.defaultProps = { theme: Base };
const StyledContent = styled.div`
width: 100%;
height: 100%;
@ -389,7 +353,6 @@ const StyledModalFooter = styled.div`
`;
export {
StyledContainer,
StyledContent,
StyledHeaderContent,
StyledBodyContent,

6
products/ASC.Files/Client/src/components/panels/SharingPanel/index.js
View File

@ -19,11 +19,7 @@ import withLoader from "../../../HOCs/withLoader";
import ModalDialog from "@appserver/components/modal-dialog";
import EmbeddingBody from "../EmbeddingPanel/EmbeddingBody";
import {
StyledContainer,
StyledContent,
StyledModalFooter,
} from "./StyledSharingPanel";
import { StyledContent, StyledModalFooter } from "./StyledSharingPanel";
import Header from "./Header";
import Body from "./Body";

66
products/ASC.Files/Client/src/components/panels/StyledPanels.js
View File

@ -101,24 +101,13 @@ const StyledAsidePanel = styled.div`
@media (max-width: 500px) {
position: fixed;
top: unset;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: calc(100% - 64px);
}
${isMobileOnly &&
css`
position: fixed;
top: 64px;
bottom: 0;
left: 0;
width: 100%;
height: calc(100% - 64px);
`}
}
${PanelStyles}
`;
@ -174,24 +163,13 @@ const StyledAddUsersPanelPanel = styled.div`
@media (max-width: 500px) {
position: fixed;
top: 64px;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: calc(100% - 64px);
}
${isMobileOnly &&
css`
position: fixed;
top: 64px;
bottom: 0;
left: 0;
width: 100%;
height: calc(100% - 64px);
`}
}
${PanelStyles}
.combo-button-label {
@ -209,24 +187,13 @@ const StyledAddGroupsPanel = styled.div`
@media (max-width: 500px) {
position: fixed;
top: 64px;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: calc(100% - 64px);
}
${isMobileOnly &&
css`
position: fixed;
top: 64px;
bottom: 0;
left: 0;
width: 100%;
height: calc(100% - 64px);
`}
}
${PanelStyles}
.combo-button-label {
@ -244,24 +211,13 @@ const StyledEmbeddingPanel = styled.div`
@media (max-width: 500px) {
position: fixed;
top: 64px;
bottom: 0;
left: 0;
width: 100vw;
height: calc(100vh - 64px);
bottom: 0;
right: 0;
width: 100%;
height: calc(100% - 64px);
}
${isMobileOnly &&
css`
position: fixed;
top: 64px;
bottom: 0;
left: 0;
width: 100vw;
height: calc(100vh - 64px);
`}
}
${PanelStyles}
`;