diff options
| author | geta6 <getakura@gmail.com> | 2017-04-19 22:39:46 +0900 |
|---|---|---|
| committer | Eugen <eugen@zeonfederated.com> | 2017-04-19 15:39:46 +0200 |
| commit | 15a4fc5dcc8e7a6b51ba5c33e921f0e9b70a0c6e (patch) | |
| tree | 17ac0d650edd88b1513835fd6357a028a49eb153 /app | |
| parent | a8e1afc30a1f843943bb29e7385b8611ea3c29f4 (diff) | |
Automatically change the size of textarea (#2128)
Diffstat (limited to 'app')
| -rw-r--r-- | app/assets/javascripts/components/components/autosuggest_textarea.jsx | 4 | ||||
| -rw-r--r-- | app/assets/stylesheets/components.scss | 9 |
2 files changed, 11 insertions, 2 deletions
diff --git a/app/assets/javascripts/components/components/autosuggest_textarea.jsx b/app/assets/javascripts/components/components/autosuggest_textarea.jsx index 04328aae8..7c068955a 100644 --- a/app/assets/javascripts/components/components/autosuggest_textarea.jsx +++ b/app/assets/javascripts/components/components/autosuggest_textarea.jsx @@ -63,6 +63,10 @@ const AutosuggestTextarea = React.createClass({ this.props.onSuggestionsClearRequested(); } + // auto-resize textarea + e.target.style.height = 'auto'; + e.target.style.height = `${e.target.scrollHeight}px`; + this.props.onChange(e); }, diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss index 76a67d8e7..765b43f93 100644 --- a/app/assets/stylesheets/components.scss +++ b/app/assets/stylesheets/components.scss @@ -1196,7 +1196,6 @@ a.status__content__spoiler-link { display: block; box-sizing: border-box; width: 100%; - resize: none; margin: 0; color: $color1; padding: 10px; @@ -1220,11 +1219,17 @@ a.status__content__spoiler-link { } .autosuggest-textarea__textarea { - height: 100px; + min-height: 100px; background: $color5; border-radius: 4px 4px 0 0; padding-bottom: 0; padding-right: 10px + 22px; + resize: none; + + @media screen and (max-width: 600px) { + height: 100px !important; // prevent auto-resize textarea + resize: vertical; + } } .autosuggest-textarea__suggestions { |