Shared: use colors from theme

This commit is contained in:
Viktor Fomin 2024-06-25 12:49:17 +03:00
parent b46c1605fe
commit 495c333940
5 changed files with 10 additions and 10 deletions

View File

@ -118,8 +118,8 @@ describe("DatePicker tests", () => {
// // @ts-expect-error TS(2582): Cannot find name 'it'. Do you need to install type... Remove this comment to see the full error message // // @ts-expect-error TS(2582): Cannot find name 'it'. Do you need to install type... Remove this comment to see the full error message
// it("DatePicker themeColor test", () => { // it("DatePicker themeColor test", () => {
// // @ts-expect-error TS(2322): Type '{ themeColor: string; }' is not assignable t... Remove this comment to see the full error message // // @ts-expect-error TS(2322): Type '{ themeColor: string; }' is not assignable t... Remove this comment to see the full error message
// const wrapper = mount(<DatePicker themeColor={"#fff"} />); // const wrapper = mount(<DatePicker themeColor={""} />);
// expect(wrapper.props().themeColor).toEqual("#fff"); // expect(wrapper.props().themeColor).toEqual("");
// }); // });
// // @ts-expect-error TS(2582): Cannot find name 'it'. Do you need to install type... Remove this comment to see the full error message // // @ts-expect-error TS(2582): Cannot find name 'it'. Do you need to install type... Remove this comment to see the full error message
@ -228,7 +228,6 @@ describe("DatePicker tests", () => {
// isDisabled: false, // isDisabled: false,
// isReadOnly: false, // isReadOnly: false,
// hasError: false, // hasError: false,
// themeColor: "#ED7309",
// locale: "en", // locale: "en",
// }; // };

View File

@ -31,6 +31,7 @@ import { Avatar, AvatarRole, AvatarSize } from "../../avatar";
import { Text } from "../../text"; import { Text } from "../../text";
import { mobile } from "../../../utils"; import { mobile } from "../../../utils";
import { globalColors } from "../../../themes";
const StyledWrapper = styled.div` const StyledWrapper = styled.div`
width: 100%; width: 100%;
@ -54,7 +55,7 @@ const StyledWrapper = styled.div`
gap: 8px; gap: 8px;
align-items: center; align-items: center;
padding: 8px; padding: 8px;
border: 1px solid #eceef1; border: 1px solid ${globalColors.grayLightMid};
border-radius: 6px; border-radius: 6px;
} }
`; `;

View File

@ -267,7 +267,6 @@
// // @ts-expect-error TS(2322): Type '{ children: any; className: string; color: s... Remove this comment to see the full error message // // @ts-expect-error TS(2322): Type '{ children: any; className: string; color: s... Remove this comment to see the full error message
// <Text // <Text
// className="phone-input_error-text" // className="phone-input_error-text"
// color="#f21c0e"
// fontSize="11px" // fontSize="11px"
// lineHeight="14px" // lineHeight="14px"
// > // >

View File

@ -25,7 +25,7 @@
// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
import styled, { css } from "styled-components"; import styled, { css } from "styled-components";
import { Base } from "../../themes"; import { Base, globalColors } from "../../themes";
import { mobileMore, mobile } from "../../utils"; import { mobileMore, mobile } from "../../utils";
const displaySettings = css<{ const displaySettings = css<{
@ -39,7 +39,7 @@ const displaySettings = css<{
align-items: flex-start; align-items: flex-start;
border-top: ${(props) => border-top: ${(props) =>
props.hasScroll && !props.showReminder && !props.hideBorder props.hasScroll && !props.showReminder && !props.hideBorder
? "1px solid #ECEEF1" ? `1px solid ${globalColors.grayLightMid}`
: "none"}; : "none"};
${(props) => ${(props) =>
@ -90,7 +90,7 @@ const displaySettings = css<{
props.hasScroll && props.hasScroll &&
css` css`
.unsaved-changes { .unsaved-changes {
border-top: 1px solid #eceef1; border-top: 1px solid ${globalColors.grayLightMid};
width: calc(100% - 16px); width: calc(100% - 16px);
${props.theme.interfaceDirection === "rtl" ${props.theme.interfaceDirection === "rtl"

View File

@ -34,7 +34,7 @@ const TimeInput = styled.div<{ hasError?: boolean; isFocused?: boolean }>`
padding: 0px 6px; padding: 0px 6px;
direction: ltr; direction: ltr;
border: 1px solid #d0d5da; border: 1px solid ${globalColors.grayStrong};
border-radius: 3px; border-radius: 3px;
transition: "all 0.2s ease 0s"; transition: "all 0.2s ease 0s";
@ -42,7 +42,8 @@ const TimeInput = styled.div<{ hasError?: boolean; isFocused?: boolean }>`
display: flex; display: flex;
align-items: center; align-items: center;
border-color: ${(props) => (props.hasError ? "#f21c0e" : "#d0d5da")}; border-color: ${(props) =>
props.hasError ? globalColors.lightErrorStatus : globalColors.grayStrong};
background-color: ${(props) => props.theme.input.backgroundColor}; background-color: ${(props) => props.theme.input.backgroundColor};