Merge 3.9 RC5 fixes into master (#6459)

* UI fixes for 3.9 (#6400)

* UI fixes for header icon alignment

* PLT-6569 - Fixing pin icon in header

* PLT-6505 - Updating z-index for emoji picker

* Updating z-index for overlaying sidebar

* PLT-6134 - Fix for emoji picker on comments

* Reverting emoji picker fix

* Fixing alignment for header icons

* Removing channel title changes

* Don't show mention badge for active channel (#6411)

* PLT-6583 - Fixing RHS compact view (#6413)

webapp/components/navbar.jsx

@@ -896,7 +896,7 @@ export default class Navbar extends React.Component {
         const searchButton = (
             <button
                 type='button'
-                className='navbar-toggle pull-right'
+                className='navbar-toggle navbar-search pull-right'
                 onClick={this.showSearch}
             >
                 <span className='fa fa-search icon-search icon--white'/>

webapp/components/rhs_comment.jsx

@@ -379,7 +379,7 @@ export default class RhsComment extends React.Component {
         }
 
         if (this.props.compactDisplay) {
-            className += 'post--compact';
+            className += ' post--compact';
         }
 
         if (post.is_pinned) {

webapp/components/rhs_root_post.jsx

@@ -190,7 +190,7 @@ export default class RhsRootPost extends React.Component {
         }
 
         if (this.props.compactDisplay) {
-            className += 'post--compact';
+            className += ' post--compact';
         }
 
         if (post.is_pinned) {

webapp/components/search_results_item.jsx

@@ -166,7 +166,7 @@ export default class SearchResultsItem extends React.Component {
         let compactClass = '';
         const profilePicContainer = (<div className='post__img'>{profilePic}</div>);
         if (this.props.compactDisplay) {
-            compactClass = 'post--compact';
+            compactClass = ' post--compact';
         }
 
         let fileAttachment = null;

webapp/sass/components/_emoticons.scss

@@ -143,15 +143,16 @@
 }
 
 .emoji-picker {
+    @include user-select(none);
+    border-radius: 3px;
+    border: 1px solid;
     display: flex;
     flex-direction: column;
-    @include user-select(none);
     position: absolute;
+    right: 0;
     top: -361px;
-    right: 0px;
     width: 278px;
-    border: 1px solid;
-    border-radius: 3px;
+    z-index: 8;
 
     .emoji-picker__search-container {
         position: relative;

webapp/sass/layout/_headers.scss

@@ -7,7 +7,7 @@
     line-height: 56px;
     position: relative;
     width: 100%;
-    z-index: 5;
+    z-index: 9;
 
     .member-popover__trigger,
     .pinned-posts-button {

webapp/sass/layout/_navigation.scss

@@ -41,14 +41,6 @@
             width: 43px;
             z-index: 5;
 
-            > span {
-                > svg {
-                    position: relative;
-                    top: 13px;
-                    vertical-align: top;
-                }
-            }
-
             .icon-bar {
                 background: $white;
                 width: 21px;
@@ -57,8 +49,7 @@
             .icon-search {
                 font-size: 17px;
                 position: relative;
-                top: 11px;
-                vertical-align: top;
+                top: -2px;
             }
 
             .icon--white {

webapp/sass/layout/_post-right.scss

@@ -39,10 +39,6 @@
             }
         }
 
-        .post__img {
-            width: 43px;
-        }
-
         .post__body {
             width: 100%;
         }

webapp/sass/layout/_sidebar-right.scss

@@ -48,10 +48,6 @@
             }
         }
 
-        .post__img {
-            width: 43px;
-        }
-
         .post__content {
             padding: 0 10px 0 0;
         }

webapp/sass/responsive/_tablet.scss

@@ -105,7 +105,7 @@
                 right: -1px;
             }
 
-                    .send-button {
+            .send-button {
                 display: table-cell;
             }
         }
@@ -126,6 +126,7 @@
     .sidebar--right {
         @include single-transition(all, .35s, ease);
         @include translateX(100%);
+        z-index: 10;
 
         &.move--left,
         &.webrtc--show {

webapp/stores/channel_store.jsx

@@ -560,7 +560,9 @@ ChannelStore.dispatchToken = AppDispatcher.register((payload) => {
         var markRead = id === ChannelStore.getCurrentId() && window.isActive;
 
         if (TeamStore.getCurrentId() === teamId || teamId === '') {
-            ChannelStore.incrementMentionsIfNeeded(id, action.websocketMessageProps);
+            if (!markRead) {
+                ChannelStore.incrementMentionsIfNeeded(id, action.websocketMessageProps);
+            }
             ChannelStore.incrementMessages(id, markRead);
         }
         break;