diff options
author | bonespiked <dngreene@gmail.com> | 2017-03-24 09:09:51 -0400 |
---|---|---|
committer | Jason Blais <jason@spinpunch.com> | 2017-03-24 09:09:51 -0400 |
commit | 28ad645153b206ba84ddc4935280eaed94bb0138 (patch) | |
tree | a5ddcc228b5cfdbd479078873a1bfede9f11cb1f /webapp/sass/responsive | |
parent | d0af931e6e57b78432d5527b6e7b0be36c538144 (diff) | |
download | chat-28ad645153b206ba84ddc4935280eaed94bb0138.tar.gz chat-28ad645153b206ba84ddc4935280eaed94bb0138.tar.bz2 chat-28ad645153b206ba84ddc4935280eaed94bb0138.zip |
Ticket 4665 - Emoji Picker (#5157)
* #4665 Added EmojiPicker
Work primarily by @broernr-de and @harrison on pre-release.mattermost.com
* Final fixes to handle custom emojis from internal review and single merge error
* ESLint fixes
* CSS changes and other code to support emoji picker in reply window
* Fix for file upload and emoji picker icon positions on post and comment.
RHS emoji picker appearing see-through at this time.
* Fix for two ESLint issues.
* covered most of feedback:
RHS emoji picker looks correct color-wise
RHS emoji picker dynamically positions against height of thread size (post + reply messages)
escape closes emoji window
search box focused on open
ESLint fixes against other files
oversized emoji preview fixes
* Adding in 'outside click' eventing to dismiss the emoji window
* Changing some formatting to fix mismatch between my local eslant rules and jenkins.
* adding alternative import method due to downstream testing errors
* yet another attempt to retain functionality and pass tests - skipping import of browser store
* fix for feedback items 5 and 7:
* move search to float on top with stylistic changes
* whitespace in the header (+1 squashed commit)
Squashed commits:
[6a26d32] changes that address items
1, 2, 6, 8, and 9 of latest feedback
* Fix for attachment preview location on mobile
* Fix for latest rounds of feedback
* fixing eslint issue
* making emojipicker sprite based, fixing alignments
* Fix for emoji quality, fixing some behavior (hover background and cursor settings)
undoing config changes
* Preview feature for emojis
* Adjustments to config file, and changing layout/design of attachment and emoji icon.
* manual revert from master branch for config.json
* reverting paperclip and fixing alignments. Additionally fixing inadvertent display of picker on mobile.
* CSS changes to try to fix the hover behavior - currently working for emoji picker (when enabled), but hover for attachment isn't working
* Made suggested changes by jwilander except for jQuery removal
* Adding hover for both icons
* removal of some usages of jQuery
* Fix for two layout issues on IE11/Edge
* UI improvements for emoji picker
* Fix for many minor display issues
* fix for additional appearance items
* fix to two minor UI items
* A little extra padding for IE11
* fix for IE11 scroll issue, and removing align attribute on img tag which was throwing js error
* fixes some display issues on firefox
* fix for uneven sides of emojis
* fix for eslint issues that I didn't introduce
* fix for missing bottom edge of RHS emojipicker. also fixing text overlapping icons on text area (including RHS)
* Update "emoji selector" to "emoji picker"
* changes for code review
- removal of ..getDOMNode
- use sprite imagery for emoji preview
- remove lastBlurAt from state as it wasn't used
* fixes for:
- fake custom emoji preview in picker
- RHS scrollbar on preview
* fix for minor alignment of preview emoji
Diffstat (limited to 'webapp/sass/responsive')
-rw-r--r-- | webapp/sass/responsive/_mobile.scss | 16 | ||||
-rw-r--r-- | webapp/sass/responsive/_tablet.scss | 35 |
2 files changed, 46 insertions, 5 deletions
diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss index 4fbec082a..e6cf0ed7d 100644 --- a/webapp/sass/responsive/_mobile.scss +++ b/webapp/sass/responsive/_mobile.scss @@ -31,6 +31,15 @@ } } + .post-create__container{ + .post-create-body { + .icon__postcontent_picker { + display:none; + top: -7px; + } + } + } + .suggestion-list__content { max-height: 145px; } @@ -1098,6 +1107,13 @@ padding: .5em 1em; } + .emoji-rhs { + position: relative; + display: none; + top: 1px; + right: -1px; + } + .msg-typing:empty { display: none; } diff --git a/webapp/sass/responsive/_tablet.scss b/webapp/sass/responsive/_tablet.scss index 3bafc38d4..6924786b9 100644 --- a/webapp/sass/responsive/_tablet.scss +++ b/webapp/sass/responsive/_tablet.scss @@ -19,14 +19,23 @@ width: 300px; } } - + .post-right__scroll{ + .post-create__container{ + .post-create-body { + .icon__emoji_picker { + display:none; + top: -7px; + } + } + } + } .post-create__container { form { padding: .5em 0 0; } .post-create-footer { - padding: 0 45px; + padding: 0 45px 0 8px; .post-error { position: relative; @@ -46,6 +55,7 @@ display: table-cell; padding-left: 45px; + .sidebar--right & { padding-left: 0; } @@ -54,15 +64,30 @@ .app__content & { .btn-file { bottom: -2px; - left: 0; + left: 10px; line-height: 36px; padding: 0; top: auto; - width: 45px; + width: 25px; } } - .send-button { + .app__content & { + .icon { + position: relative; + top: 3px; + + } + } + + .icon__emoji_picker { + position: relative; + display: none; + top: 1px; + right: -1px; + } + + .send-button { display: table-cell; } } |