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

Client: use colors from theme

Browse Source
This commit is contained in:
Viktor Fomin 2024-06-28 14:12:37 +03:00
parent c6946feaab
commit 73c1ea02c8
20 changed files with 37 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/client/src/components/Article/MainButton/index.js
View File

@ -70,6 +70,7 @@ import { getCorrectFourValuesStyle } from "@docspace/shared/utils";
import { ArticleButtonLoader } from "@docspace/shared/skeletons/article";
import { isMobile, isTablet } from "react-device-detect";
import { PRODUCT_NAME } from "@docspace/shared/constants";
import { globalColors } from "@docspace/shared/themes";
const StyledButton = styled(Button)`
font-weight: 700;
@ -121,7 +122,7 @@ const StyledButton = styled(Button)`
border-radius: 3px;
user-select: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
}
`;

4
packages/client/src/components/NavMenu/sub-components/header-catalog-burger.js
View File

@ -30,7 +30,7 @@ import PropTypes from "prop-types";
import MenuIcon from "PUBLIC_DIR/images/menu.react.svg";
import { mobile } from "@docspace/shared/utils";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
const StyledIconBox = styled.div`
display: none;
@ -45,7 +45,7 @@ const StyledIconBox = styled.div`
theme.interfaceDirection === "rtl"
? `padding-right: 16px;`
: `padding-left: 16px;`}
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
`;
const StyledMenuIcon = styled(MenuIcon)`

3
packages/client/src/components/NavMenu/sub-components/header-nav.js
View File

@ -35,6 +35,7 @@ import {
getCorrectFourValuesStyle,
} from "@docspace/shared/utils";
import { inject, observer } from "mobx-react";
import { globalColors } from "@docspace/shared/themes";
const StyledNav = styled.nav`
display: flex;
@ -62,7 +63,7 @@ const StyledNav = styled.nav`
}
.icon-profile-menu {
cursor: pointer;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
}
`;
const HeaderNav = ({

4
packages/client/src/components/NavMenu/sub-components/header-unauth.js
View File

@ -29,7 +29,7 @@ import PropTypes from "prop-types";
import styled from "styled-components";
import { Box } from "@docspace/shared/components/box";
import { inject, observer } from "mobx-react";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
import { mobile, getLogoUrl } from "@docspace/shared/utils";
import { WhiteLabelLogoType } from "@docspace/shared/enums";
import { LanguageCombobox } from "@docspace/shared/components/language-combobox";
@ -58,7 +58,7 @@ const Header = styled.header`
}
.header-logo-wrapper {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
}
.header-logo-min_icon {

4
packages/client/src/components/NavMenu/sub-components/header.js
View File

@ -42,7 +42,7 @@ import {
import { WhiteLabelLogoType } from "@docspace/shared/enums";
import { combineUrl } from "@docspace/shared/utils/combineUrl";
import HeaderCatalogBurger from "./header-catalog-burger";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
const Header = styled.header`
display: flex;
@ -59,7 +59,7 @@ const Header = styled.header`
display: flex;
align-items: center;
justify-items: center;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
${NoUserSelect}
}

3
packages/client/src/components/NavMenu/sub-components/nav-logo-item.js
View File

@ -31,6 +31,7 @@ import styled from "styled-components";
import { inject, observer } from "mobx-react";
import { NoUserSelect, getLogoUrl } from "@docspace/shared/utils";
import { WhiteLabelLogoType } from "@docspace/shared/enums";
import { globalColors } from "@docspace/shared/themes";
const LogoItem = styled.div`
display: flex;
@ -41,7 +42,7 @@ const LogoItem = styled.div`
cursor: pointer;
.nav-logo-wrapper {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
${NoUserSelect}
}

4
packages/client/src/components/NavMenu/sub-components/nav.js
View File

@ -29,7 +29,7 @@ import PropTypes from "prop-types";
import styled from "styled-components";
import { Scrollbar } from "@docspace/shared/components/scrollbar";
import { isMobileOnly, isMobile } from "react-device-detect";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
const StyledNav = styled.nav`
background-color: ${(props) => props.theme.nav.backgroundColor};
@ -44,7 +44,7 @@ const StyledNav = styled.nav`
transition: width 0.3s ease-in-out;
width: ${(props) => (props.opened ? "240px" : "0")};
z-index: 200;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
.version-box {
position: absolute;

3
packages/client/src/components/panels/EmbeddingPanel/StyledEmbeddingPanel.js
View File

@ -26,6 +26,7 @@
import styled, { css } from "styled-components";
import { ModalDialog } from "@docspace/shared/components/modal-dialog";
import { globalColors } from "@docspace/shared/themes";
const StyledModalDialog = styled(ModalDialog)`
.modal-header {
@ -118,7 +119,7 @@ const StyledBody = styled.div`
.embedding-panel_code-container {
margin-top: 16px;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
}
.embedding-panel_text {

8
packages/client/src/components/panels/StyledPanels.js
View File

@ -29,7 +29,7 @@ import { Scrollbar } from "@docspace/shared/components/scrollbar";
import { Link } from "@docspace/shared/components/link";
import { desktop, mobile, tablet } from "@docspace/shared/utils";
import { isMobile } from "react-device-detect";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
const PanelStyles = css`
.panel_combo-box {
@ -507,7 +507,7 @@ const StyledLinkRow = styled.div`
.row_content {
display: grid;
grid-template-columns: 1fr 28px;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
}
.combo-button {
@ -596,7 +596,7 @@ const StyledModalRowContainer = styled.div`
}
.embedding-panel_code-container {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
}
.embedding-panel_text {
@ -654,7 +654,7 @@ const StyledModalRowContainer = styled.div`
}
.embedding-panel_code-container {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
}
.embedding-panel_text {

5
packages/client/src/pages/FormGallery/TilesView/StyledTileView.js
View File

@ -25,7 +25,7 @@
// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
import styled, { css } from "styled-components";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
import TileContent from "./sub-components/TileContent";
import { ContextMenu } from "@docspace/shared/components/context-menu";
@ -36,7 +36,6 @@ import {
mobileMore,
getCorrectFourValuesStyle,
} from "@docspace/shared/utils";
import { globalColors } from "@docspace/shared/themes";
const FlexBoxStyles = css`
display: flex;
@ -60,7 +59,7 @@ const StyledTile = styled.div`
border-radius: 6px;
${(props) =>
props.showHotkeyBorder && `border-color: ${globalColors.lightSecondMain}`};
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
${(props) => props.isSelected && checkedStyle}

4
packages/client/src/pages/Home/InfoPanel/Body/styles/gallery.js
View File

@ -26,14 +26,14 @@
import styled from "styled-components";
import { isMobileOnly } from "react-device-detect";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
const StyledGalleryThumbnail = styled.div`
box-sizing: border-box;
width: 100%;
overflow: hidden;
border-radius: 6px;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
height: ${isMobileOnly ? "335px" : "346px"};
border: ${(props) =>
`solid 1px ${props.theme.infoPanel.gallery.borderColor}`};

4
packages/client/src/pages/Home/Section/AccountsBody/Groups/RowView/index.styled.js
View File

@ -28,7 +28,7 @@ import styled, { css } from "styled-components";
import { RowContainer } from "@docspace/shared/components/row-container";
import { isMobile, isTablet } from "react-device-detect";
import { Row } from "@docspace/shared/components/row";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
import { mobile, tablet } from "@docspace/shared/utils/device";
import { RowContent } from "@docspace/shared/components/row-content";
@ -142,7 +142,7 @@ export const GroupsRow = styled(Row)`
position: unset;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
.styled-element {
height: 32px;
margin-inline-end: 12px;

4
packages/client/src/pages/Home/Section/AccountsBody/InsideGroup/RowView/SimpleUserRow.js
View File

@ -29,7 +29,7 @@ import styled, { css } from "styled-components";
import { isMobile } from "react-device-detect";
import { Row } from "@docspace/shared/components/row";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
import withContent from "SRC_DIR/HOCs/withPeopleContent";
@ -112,7 +112,7 @@ const StyledSimpleUserRow = styled(Row)`
`}
position: unset;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
.styled-element {
height: 32px;

5
packages/client/src/pages/Home/Section/AccountsBody/People/RowView/SimpleUserRow.js
View File

@ -29,7 +29,7 @@ import styled, { css } from "styled-components";
import { isMobile } from "react-device-detect";
import { Row } from "@docspace/shared/components/row";
import { Base } from "@docspace/shared/themes";
import { Base, globalColors } from "@docspace/shared/themes";
import withContent from "SRC_DIR/HOCs/withPeopleContent";
@ -112,8 +112,7 @@ const StyledSimpleUserRow = styled(Row)`
`}
position: unset;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
.styled-element {
height: 32px;
margin-inline-end: 12px;

2
packages/client/src/pages/Home/Section/Body/RowsView/SimpleFilesRow.js
View File

@ -145,7 +145,7 @@ const StyledSimpleFilesRow = styled(Row)`
}
`}
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
.styled-element {
height: 32px;

2
packages/client/src/pages/Home/Section/Body/TableView/StyledTable.js
View File

@ -478,7 +478,7 @@ const StyledQuickButtonsContainer = styled.div`
fill: ${(props) =>
props.theme.filesSection.tableView.row.shareHoverColor};
}
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
}
`;

2
packages/client/src/pages/Home/Section/Body/TilesView/sub-components/Tile.js
View File

@ -158,7 +158,7 @@ const StyledTile = styled.div`
props.showHotkeyBorder && `border-color: ${globalColors.lightSecondMain}`};
${(props) =>
props.isFolder && !props.isRooms && "border-top-left-radius: 6px;"}
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
${(props) => props.isFolder && (props.isRoom ? roomsStyles : FlexBoxStyles)};
${(props) => (props.isFolder ? FolderStyles : FileStyles)};

3
packages/client/src/pages/Home/Section/Header/index.js
View File

@ -50,6 +50,7 @@ import {
getCategoryUrl,
} from "SRC_DIR/helpers/utils";
import TariffBar from "SRC_DIR/components/TariffBar";
import { globalColors } from "@docspace/shared/themes";
const StyledContainer = styled.div`
width: 100%;
@ -64,7 +65,7 @@ const StyledContainer = styled.div`
: css`
margin: 0 0 0 -20px;
`}
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
width: calc(100% + 40px);
height: 68px;

2
packages/client/src/pages/PortalSettings/categories/data-management/backup/StyledBackup.js
View File

@ -125,7 +125,7 @@ const commonStyles = css`
max-width: fit-content;
font-size: 12px;
line-height: 15px;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
}
`;

2
packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/WebhookHistory/sub-components/HistoryHeader.js
View File

@ -103,7 +103,7 @@ const HeaderContainer = styled.div`
margin-block: 0;
margin-inline: -20px 0;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: ${globalColors.tapHighlight};
flex: 0 0 auto;