From 0231e95f1c5a8c42ba97875f0d2301815f552974 Mon Sep 17 00:00:00 2001
From: Saturnino Abril <saturnino.abril@gmail.com>
Date: Mon, 19 Jun 2017 02:23:17 +0800
Subject: [PATCH] Fix Emoji picker cut off at RHS (#6602)

---
 .../components/emoji_picker/emoji_picker.jsx  | 26 ++++++++++++-------
 webapp/sass/components/_emoticons.scss        |  2 +-
 webapp/sass/layout/_post-right.scss           |  1 -
 3 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/webapp/components/emoji_picker/emoji_picker.jsx b/webapp/components/emoji_picker/emoji_picker.jsx
index cbb388a10f..2a5b84747f 100644
--- a/webapp/components/emoji_picker/emoji_picker.jsx
+++ b/webapp/components/emoji_picker/emoji_picker.jsx
@@ -240,20 +240,26 @@ export default class EmojiPicker extends React.Component {
                 // This is a custom emoji that matches the model on the server
                 name = selected.name;
                 aliases = [selected.name];
-                previewImage = (<img
-                    className='emoji-picker__preview-image'
-                    align='absmiddle'
-                    src={EmojiStore.getEmojiImageUrl(selected)}
-                                />);
+                previewImage = (
+                    <img
+                        className='emoji-picker__preview-image'
+                        align='absmiddle'
+                        src={EmojiStore.getEmojiImageUrl(selected)}
+                    />
+                );
             } else {
                 // This is a system emoji which only has a list of aliases
                 name = selected.aliases[0];
                 aliases = selected.aliases;
-                previewImage = (<span ><img
-                    src='/static/emoji/img_trans.gif'
-                    className={'  emojisprite-preview emoji-' + selected.filename + ' '}
-                    align='absmiddle'
-                                       /></span>);
+                previewImage = (
+                    <span>
+                        <img
+                            src='/static/emoji/img_trans.gif'
+                            className={'  emojisprite-preview emoji-' + selected.filename + ' '}
+                            align='absmiddle'
+                        />
+                    </span>
+                );
             }
 
             return (
diff --git a/webapp/sass/components/_emoticons.scss b/webapp/sass/components/_emoticons.scss
index 24d53eef3e..b91630a470 100644
--- a/webapp/sass/components/_emoticons.scss
+++ b/webapp/sass/components/_emoticons.scss
@@ -103,7 +103,7 @@
 }
 
 .emoji-picker__items {
-    max-height: 262px;
+    max-height: 278px;
     overflow-x: hidden;
     overflow-y: auto;
     padding: 0px 8px 8px 8px;
diff --git a/webapp/sass/layout/_post-right.scss b/webapp/sass/layout/_post-right.scss
index 85dd20f532..e6ee33f85c 100644
--- a/webapp/sass/layout/_post-right.scss
+++ b/webapp/sass/layout/_post-right.scss
@@ -148,7 +148,6 @@
 .post-right__scroll {
     -webkit-overflow-scrolling: touch;
     @include flex(1 1 auto);
-    overflow: auto;
     padding-top: 10px;
     position: relative;