Web: Components : Input, Textarea : Fixed placeholder color

This commit is contained in:
Ilya Oleshko 2020-11-30 15:02:56 +03:00
parent 22d8111191
commit 292dc42d52
2 changed files with 22 additions and 12 deletions

View File

@ -5,8 +5,7 @@ import commonInputStyle from "../text-input/common-input-styles";
import MaskedInput from "react-text-mask";
import isEqual from "lodash/isEqual";
/* eslint-disable no-unused-vars */
/* eslint-disable react/prop-types */
/* eslint-disable no-unused-vars, react/prop-types */
const Input = ({
isAutoFocussed,
isDisabled,
@ -25,8 +24,7 @@ const Input = ({
) : (
<input {...props} />
);
/* eslint-enable react/prop-types */
/* eslint-enable no-unused-vars */
/* eslint-enable react/prop-types, no-unused-vars */
const StyledInput = styled(Input).attrs((props) => ({
id: props.id,
@ -77,25 +75,31 @@ const StyledInput = styled(Input).attrs((props) => ({
transition: all 0.2s ease 0s;
::-webkit-input-placeholder {
color: ${(props) => (props.isDisabled ? "#A3A9AE" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
:-moz-placeholder {
color: ${(props) => (props.isDisabled ? "#A3A9AE" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
::-moz-placeholder {
color: ${(props) => (props.isDisabled ? "#A3A9AE" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
:-ms-input-placeholder {
color: ${(props) => (props.isDisabled ? "#A3A9AE" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
::placeholder {
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}

View File

@ -56,25 +56,31 @@ const StyledTextarea = styled(ClearTextareaAutosize)`
}
::-webkit-input-placeholder {
color: ${(props) => (props.isDisabled ? "#D0D5DA" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
:-moz-placeholder {
color: ${(props) => (props.isDisabled ? "#D0D5DA" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
::-moz-placeholder {
color: ${(props) => (props.isDisabled ? "#D0D5DA" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
:-ms-input-placeholder {
color: ${(props) => (props.isDisabled ? "#D0D5DA" : "#D0D5DA")};
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}
::placeholder {
color: "#A3A9AE";
font-family: "Open Sans", sans-serif;
user-select: none;
}