Commit 1e079457c7164d0bb47bd45aaef501780db0a3eb
1 parent
ac963baa
UI: Json React Form - textarea height fix
Showing
2 changed files
with
18 additions
and
3 deletions
... | ... | @@ -56,8 +56,14 @@ class ThingsboardText extends React.Component<JsonFormFieldProps, ThingsboardTex |
56 | 56 | } |
57 | 57 | |
58 | 58 | const multiline = this.props.form.type === 'textarea'; |
59 | - const rows = multiline ? this.props.form.rows : 1; | |
60 | - const rowsMax = multiline ? this.props.form.rowsMax : 1; | |
59 | + let rows = 1; | |
60 | + let rowsMax = 1; | |
61 | + let minHeight = 48; | |
62 | + if (multiline) { | |
63 | + rows = this.props.form.rows || 2; | |
64 | + rowsMax = this.props.form.rowsMax; | |
65 | + minHeight = 19 * rows + 48; | |
66 | + } | |
61 | 67 | |
62 | 68 | return ( |
63 | 69 | <div> |
... | ... | @@ -77,7 +83,7 @@ class ThingsboardText extends React.Component<JsonFormFieldProps, ThingsboardTex |
77 | 83 | rowsMax={rowsMax} |
78 | 84 | onFocus={this.onFocus} |
79 | 85 | onBlur={this.onBlur} |
80 | - style={this.props.form.style || {width: '100%'}}/> | |
86 | + style={this.props.form.style || {width: '100%', minHeight: minHeight + 'px'}}/> | |
81 | 87 | </div> |
82 | 88 | ); |
83 | 89 | } | ... | ... |
... | ... | @@ -58,6 +58,15 @@ $previewSize: 100px !default; |
58 | 58 | |
59 | 59 | .tb-field { |
60 | 60 | padding-bottom: 18px; |
61 | + | |
62 | + .MuiInputBase-multiline { | |
63 | + flex: 1; | |
64 | + flex-direction: column; | |
65 | + .MuiInputBase-inputMultiline { | |
66 | + flex: 1; | |
67 | + } | |
68 | + } | |
69 | + | |
61 | 70 | &.tb-required { |
62 | 71 | label::after { |
63 | 72 | font-size: 13px; | ... | ... |