mirror of
https://github.com/cinnyapp/cinny.git
synced 2025-11-15 19:50:28 +03:00
Add RoomSettings comp
Signed-off-by: Ajay Bura <ajbura@gmail.com>
This commit is contained in:
parent
8eda0aeab3
commit
5777c1ab27
20 changed files with 306 additions and 25 deletions
|
|
@ -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{
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue