Ui improvements (#6198)

* PLT-6306 - Post alignment in compact view

* PLT-6266 - Adjusting spacing for files (compact)

* PLT-6302 - Margins not equal for paragraphs in post

* PLT-6332 - FIxing inline images

* PLT-6134 - Fixing border on emoji picker

* PLT-6323 - Fixing UI for system console user list

* PLT-6375 - Updating emoji picker

* PLT-6327 - Updating more channel/user list

* PLT-6241 - Adding IE detection

* PLT-6332- Fixing inline markdown images

3 files changed, 14 insertions, 1 deletions

diff --git a/webapp/components/channel_view.jsx b/webapp/components/channel_view.jsx
index 9359ff899..d6a931e0b 100644
--- a/webapp/components/channel_view.jsx
+++ b/webapp/components/channel_view.jsx
@@ -4,6 +4,7 @@
 import $ from 'jquery';
 import React from 'react';
 
+import * as UserAgent from 'utils/user_agent.jsx';
 import ChannelHeader from 'components/channel_header.jsx';
 import FileUploadOverlay from 'components/file_upload_overlay.jsx';
 import CreatePost from 'components/create_post.jsx';
@@ -40,6 +41,11 @@ export default class ChannelView extends React.Component {
         ChannelStore.addChangeListener(this.updateState);
 
         $('body').addClass('app__body');
+
+        // IE Detection
+        if (UserAgent.isInternetExplorer()) {
+            $('body').addClass('browser--ie');
+        }
     }
     componentWillUnmount() {
         ChannelStore.removeChangeListener(this.updateState);
diff --git a/webapp/components/searchable_channel_list.jsx b/webapp/components/searchable_channel_list.jsx
index 9c89f8dd4..dd633cf58 100644
--- a/webapp/components/searchable_channel_list.jsx
+++ b/webapp/components/searchable_channel_list.jsx
@@ -7,6 +7,7 @@ import * as UserAgent from 'utils/user_agent.jsx';
 
 import $ from 'jquery';
 import React from 'react';
+import ReactDOM from 'react-dom';
 import {localizeMessage} from 'utils/utils.jsx';
 import {FormattedMessage} from 'react-intl';
 
@@ -99,11 +100,13 @@ export default class SearchableChannelList extends React.Component {
         this.setState({page: this.state.page + 1, nextDisabled: true});
         this.nextTimeoutId = setTimeout(() => this.setState({nextDisabled: false}), NEXT_BUTTON_TIMEOUT_MILLISECONDS);
         this.props.nextPage(this.state.page + 1);
+        $(ReactDOM.findDOMNode(this.refs.channelListScroll)).scrollTop(0);
     }
 
     previousPage(e) {
         e.preventDefault();
         this.setState({page: this.state.page - 1});
+        $(ReactDOM.findDOMNode(this.refs.channelListScroll)).scrollTop(0);
     }
 
     doSearch() {
@@ -186,7 +189,7 @@ export default class SearchableChannelList extends React.Component {
                     ref='channelList'
                     className='more-modal__list'
                 >
-                    <div>
+                    <div ref='channelListScroll'>
                         {listContent}
                     </div>
                 </div>
diff --git a/webapp/components/searchable_user_list/searchable_user_list.jsx b/webapp/components/searchable_user_list/searchable_user_list.jsx
index 5b262bcdf..31db29d6b 100644
--- a/webapp/components/searchable_user_list/searchable_user_list.jsx
+++ b/webapp/components/searchable_user_list/searchable_user_list.jsx
@@ -1,7 +1,9 @@
 // Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
 // See License.txt for license information.
 
+import $ from 'jquery';
 import React from 'react';
+import ReactDOM from 'react-dom';
 import {FormattedMessage} from 'react-intl';
 
 import UserList from 'components/user_list.jsx';
@@ -83,12 +85,14 @@ export default class SearchableUserList extends React.Component {
         this.nextTimeoutId = setTimeout(() => this.setState({nextDisabled: false}), NEXT_BUTTON_TIMEOUT);
 
         this.props.nextPage();
+        $(ReactDOM.findDOMNode(this.refs.channelListScroll)).scrollTop(0);
     }
 
     previousPage(e) {
         e.preventDefault();
 
         this.props.previousPage();
+        $(ReactDOM.findDOMNode(this.refs.channelListScroll)).scrollTop(0);
     }
 
     focusSearchBar() {