@@ -8,7 +8,7 @@ function Input({
|
||||
id, label, name, value, placeholder,
|
||||
required, type, onChange, forwardRef,
|
||||
resizable, minHeight, onResize, state,
|
||||
onKeyDown,
|
||||
onKeyDown, disabled,
|
||||
}) {
|
||||
return (
|
||||
<div className="input-container">
|
||||
@@ -29,6 +29,7 @@ function Input({
|
||||
onChange={onChange}
|
||||
onResize={onResize}
|
||||
onKeyDown={onKeyDown}
|
||||
disabled={disabled}
|
||||
/>
|
||||
) : (
|
||||
<input
|
||||
@@ -43,6 +44,7 @@ function Input({
|
||||
autoComplete="off"
|
||||
onChange={onChange}
|
||||
onKeyDown={onKeyDown}
|
||||
disabled={disabled}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
@@ -64,6 +66,7 @@ Input.defaultProps = {
|
||||
onResize: null,
|
||||
state: 'normal',
|
||||
onKeyDown: null,
|
||||
disabled: false,
|
||||
};
|
||||
|
||||
Input.propTypes = {
|
||||
@@ -81,6 +84,7 @@ Input.propTypes = {
|
||||
onResize: PropTypes.func,
|
||||
state: PropTypes.oneOf(['normal', 'success', 'error']),
|
||||
onKeyDown: PropTypes.func,
|
||||
disabled: PropTypes.bool,
|
||||
};
|
||||
|
||||
export default Input;
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
@use '../../atoms/scroll/scrollbar';
|
||||
|
||||
.input {
|
||||
display: block;
|
||||
width: 100%;
|
||||
@@ -13,6 +15,11 @@
|
||||
letter-spacing: var(--ls-b2);
|
||||
line-height: var(--lh-b2);
|
||||
|
||||
:disabled {
|
||||
opacity: 0.4;
|
||||
cursor: no-drop;
|
||||
}
|
||||
|
||||
&__label {
|
||||
display: inline-block;
|
||||
margin-bottom: var(--sp-ultra-tight);
|
||||
@@ -21,6 +28,10 @@
|
||||
|
||||
&--resizable {
|
||||
resize: vertical !important;
|
||||
overflow-y: auto !important;
|
||||
@include scrollbar.scroll;
|
||||
@include scrollbar.scroll__v;
|
||||
@include scrollbar.scroll--auto-hide;
|
||||
}
|
||||
&--success {
|
||||
border: 1px solid var(--bg-positive);
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
.ReactModal__Overlay {
|
||||
opacity: 0;
|
||||
transition: opacity 200ms cubic-bezier(0.13, 0.56, 0.25, 0.99);
|
||||
transition: opacity 200ms var(--fluid-slide-up);
|
||||
}
|
||||
.ReactModal__Overlay--after-open{
|
||||
opacity: 1;
|
||||
@@ -11,7 +11,7 @@
|
||||
|
||||
.ReactModal__Content {
|
||||
transform: translateY(100%);
|
||||
transition: transform 200ms cubic-bezier(0.13, 0.56, 0.25, 0.99);
|
||||
transition: transform 200ms var(--fluid-slide-up);
|
||||
}
|
||||
|
||||
.ReactModal__Content--after-open{
|
||||
|
||||
Reference in New Issue
Block a user