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

Client: RoomLogoCoverDialog: fixed style

Browse Source
This commit is contained in:
Dmitry Sychugov 2024-08-23 23:15:13 +05:00
parent 5688118cb1
commit 79cfadb32d
3 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/client/src/components/dialogs/RoomLogoCoverDialog/sub-components/SelectColor/SelectColor.styled.tsx
View File

@ -86,7 +86,8 @@ const StyledColorItem = styled.div<ColorItemProps>`
${(props) =>
props.isSelected &&
css`
background-color: #f3f4f4;
background-color: ${(props) =>
props.theme.logoCover.selectColor.backgroundColor};
`}
&:hover {

3
packages/client/src/components/dialogs/RoomLogoCoverDialog/sub-components/SelectColor/SelectColor.tsx
View File

@ -25,9 +25,8 @@
// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
import React, { useState, useRef } from "react";
import styled, { css } from "styled-components";
import { mobile, tablet, isMobile } from "@docspace/shared/utils";
import { isMobile } from "@docspace/shared/utils";
import {
ModalDialog,

15
packages/client/src/components/dialogs/RoomLogoCoverDialog/sub-components/SelectIcon.tsx
View File

@ -27,6 +27,7 @@
import React from "react";
import styled, { css } from "styled-components";
import hexRgb from "hex-rgb";
import { mobile, tablet } from "@docspace/shared/utils";
import { ColorTheme, ThemeId } from "@docspace/shared/components/color-theme";
@ -47,19 +48,20 @@ const StyledWithoutIcon = styled.div<WithoutIconProps>`
font-weight: 600;
line-height: 20px;
user-select: none;
padding: 4px 16px;
color: #657077;
background-color: #eceef1;
border: 1px solid rgb(236, 238, 241);
padding: 3px 15px;
color: ${(props) => props.theme.logoCover.textColor};
background-color: ${(props) => props.theme.logoCover.selectedBackgroundColor};
border: 1px solid ${(props) => props.theme.logoCover.selectedBorderColor};
border-radius: 16px;
&:hover {
cursor: pointer;
}
${(props) =>
props.isSelected &&
!props.isSelected &&
css`
background-color: #fff;
background-color: ${(props) => props.theme.logoCover.backgroundColor};
border: 1px solid ${(props) => props.theme.logoCover.borderColor};
`}
`;
@ -111,6 +113,7 @@ export const SelectIcon = ({
className="cover-icon"
size={20}
alt="cover-icon"
color={"#657077"}
/>
</StyledIconContainer>
))}