diff --git a/app/css/desktop.css b/app/css/desktop.css
index 5476fa37..687fe9bc 100644
--- a/app/css/desktop.css
+++ b/app/css/desktop.css
@@ -383,6 +383,27 @@ a.footer_lang_link.active:active {
min-width: 60px;
}
+.im_emoji_quick_select_area {
+ display: block;
+ height: 30px;
+ overflow: hidden;
+ padding: 0 5px;
+}
+
+.im_emoji_quick_select_area a {
+ display: inline-block;
+ margin: 3px 0;
+ padding: 2px;
+}
+
+.im_emoji_quick_select_area a:hover {
+ background-color: #edf2f5;
+}
+
+.im_emoji_quick_select_area a .label {
+ display: none;
+}
+
.im_message_selected .im_message_date,
.im_message_selected .im_message_document_size,
.im_message_selected .im_message_audio_duration,
@@ -928,4 +949,4 @@ div.im_panel_own_photo {
.changelog_modal_window .modal-dialog {
max-width: 506px;
-}
\ No newline at end of file
+}
diff --git a/app/js/directives.js b/app/js/directives.js
index 72266009..fe7b6520 100644
--- a/app/js/directives.js
+++ b/app/js/directives.js
@@ -882,9 +882,10 @@ angular.module('myApp.directives', ['myApp.filters'])
fileSelects = $('input', element),
dropbox = $('.im_send_dropbox_wrap', element)[0],
emojiButton = $('.im_emoji_btn', element)[0],
+ emojiQuickSelect = !Config.Mobile ? $('.im_emoji_quick_select_area', element)[0] : false,
editorElement = messageField,
dragStarted, dragTimeout,
- emojiArea = $(messageField).emojiarea({button: emojiButton, norealTime: true}),
+ emojiArea = $(messageField).emojiarea({button: emojiButton, norealTime: true, quickSelect: emojiQuickSelect}),
emojiMenu = $('.emoji-menu', element)[0],
submitBtn = $('.im_submit', element)[0],
richTextarea = $('.emoji-wysiwyg-editor', element)[0];
diff --git a/app/partials/desktop/im.html b/app/partials/desktop/im.html
index 90e7b962..1b234c1b 100644
--- a/app/partials/desktop/im.html
+++ b/app/partials/desktop/im.html
@@ -250,9 +250,13 @@
-