diff --git a/app/assets/stylesheets/junto.scss.erb b/app/assets/stylesheets/junto.scss.erb index dfff7fd8..19588341 100644 --- a/app/assets/stylesheets/junto.scss.erb +++ b/app/assets/stylesheets/junto.scss.erb @@ -279,11 +279,13 @@ } } + $chat_font_size: 16px; + .chat-input { min-height: 80px; - width: 94%; - padding: 8px 3% 8px 3%; - font-size: 13px; + width: 88%; + padding: 8px 9% 8px 3%; + font-size: $chat_font_size; outline: none; resize: none; } @@ -299,8 +301,8 @@ padding: 8px 8px 2px 8px; color: #f5f5f5; font-family: arial, sans-serif; - font-size: 16px; - line-height: 17px; + font-size: $chat_font_size; + line-height: $chat_font_size + 1px; a:link { color: #4fb5c0; @@ -347,4 +349,22 @@ } } } + + .new-message-area { + position: relative; + + .extra-message-options { + height: 20px; + position: absolute; + right: 2px; + bottom: 74px; + + .emoji-picker-button { + font-size: 16px; + line-height: 20px; + cursor: pointer; + padding: 4px; + } + } + } } diff --git a/frontend/src/components/MapChat/NewMessage.js b/frontend/src/components/MapChat/NewMessage.js index 3b7b3304..947ec6c6 100644 --- a/frontend/src/components/MapChat/NewMessage.js +++ b/frontend/src/components/MapChat/NewMessage.js @@ -24,19 +24,25 @@ class NewMessage extends Component { this.props.handleChange({ target: { value: messageText + emoji.colons }}) + + this.setState({ showEmojiPicker: false }) } render = () => { return (
- Emoji - +
+ 🙃 +