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

Client: PortalSettings: Preview: add border prop

Browse Source
This commit is contained in:
Viktor Fomin 2022-09-13 16:26:18 +03:00
parent 39c1234e81
commit 1089da5812
2 changed files with 22 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
packages/client/src/pages/PortalSettings/categories/common/settingsAppearance/StyledPreview.js
View File

@ -1,4 +1,4 @@
import styled from "styled-components";
import styled, { css } from "styled-components";
import { Base } from "@docspace/components/themes";
const StyledComponent = styled.div`
@ -16,9 +16,13 @@ const StyledComponent = styled.div`
height: 100%;
background: ${(props) =>
props.themePreview === "Light" ? "#f8f9f9" : "#292929"};
border-width: 1px;
border-style: solid;
border-radius: 16px 0px 0px 16px;
${(props) =>
props.withBorder &&
css`
border-width: 1px;
border-style: solid;
border-radius: 16px 0px 0px 16px;
`}
}
.tablet-header {
@ -71,10 +75,14 @@ const StyledComponent = styled.div`
.section {
position: relative;
width: ${(props) => (props.isViewTablet ? "89%" : "56%")};
border-width: 1px;
border-style: solid;
border-left-style: none;
border-radius: 0px 16px 16px 0px;
${(props) =>
props.withBorder &&
css`
border-width: 1px;
border-style: solid;
border-left-style: none;
border-radius: 0px 16px 16px 0px;
`}
background: ${(props) =>
props.themePreview === "Light" ? "#FFFFFF" : "#333333"};
}

7
packages/client/src/pages/PortalSettings/categories/common/settingsAppearance/preview.js
View File

@ -13,7 +13,7 @@ import {
import ButtonPlusIcon from "../../../../../../../../public/images/actions.button.plus.react.svg";
const Preview = (props) => {
const { selectAccentColor, themePreview, selectThemeId } = props;
const { selectAccentColor, themePreview, selectThemeId, withBorder } = props;
const [colorPreview, setColorPreview] = useState(selectAccentColor);
const [isViewTablet, setIsViewTablet] = useState(false);
@ -43,6 +43,7 @@ const Preview = (props) => {
themePreview={themePreview}
selectThemeId={selectThemeId}
isViewTablet={isViewTablet}
withBorder={withBorder}
>
<div className="menu border-color">
{!isViewTablet ? (
@ -399,4 +400,8 @@ const Preview = (props) => {
);
};
Preview.defaultProps = {
withBorder: true,
};
export default Preview;