Multiple UI Improvements

web/react/components/admin_console/user_item.jsx

@@ -353,7 +353,7 @@ export default class UserItem extends React.Component {
 
         return (
             <tr>
-                <td className='row member-div'>
+                <td className='row member-div padding--equal'>
                     <img
                         className='post-profile-img pull-left'
                         src={`/api/v1/users/${user.id}/image?time=${user.update_at}&${Utils.getSessionIndex()}`}

web/react/components/channel_info_modal.jsx

@@ -56,7 +56,7 @@ class ChannelInfoModal extends React.Component {
                         </div>
                         <div className='col-sm-9'>{channelURL}</div>
                     </div>
-                    <div className='row'>
+                    <div className='row form-group'>
                         <div className='col-sm-3 info__label'>
                             <FormattedMessage
                                 id='channel_info.id'

web/react/components/navbar.jsx

@@ -28,6 +28,7 @@ import {FormattedMessage} from 'mm-intl';
 
 const Popover = ReactBootstrap.Popover;
 const OverlayTrigger = ReactBootstrap.OverlayTrigger;
+const attachFastClick = require('fastclick');
 
 export default class Navbar extends React.Component {
     constructor(props) {
@@ -59,6 +60,7 @@ export default class Navbar extends React.Component {
         ChannelStore.addChangeListener(this.onChange);
         ChannelStore.addExtraInfoChangeListener(this.onChange);
         $('.inner__wrap').click(this.hideSidebars);
+        attachFastClick(document.body);
     }
     componentWillUnmount() {
         ChannelStore.removeChangeListener(this.onChange);

web/react/components/team_general_tab.jsx

@@ -486,13 +486,9 @@ class GeneralTab extends React.Component {
             inputs.push(
                 <div key='teamInviteSetting'>
                     <div className='row'>
-                        <label className='col-sm-5 control-label'>
-                            <FormattedMessage
-                                id='general_tab.codeTitle'
-                                defaultMessage='Invite Code'
-                            />
+                        <label className='col-sm-5 control-label visible-xs-block'>
                         </label>
-                        <div className='col-sm-7'>
+                        <div className='col-sm-12'>
                             <input
                                 className='form-control'
                                 type='text'

web/react/components/user_settings/manage_incoming_hooks.jsx

@@ -183,7 +183,7 @@ export default class ManageIncomingHooks extends React.Component {
             <div key='addIncomingHook'>
                 <FormattedHTMLMessage
                     id='user.settings.hooks_in.description'
-                    defaultMessage='Create webhook URLs for use in external integrations. Please see<a href="http://mattermost.org/webhooks" target="_blank">http://mattermost.org/webhooks</a> to learn more.'
+                    defaultMessage='Create webhook URLs for use in external integrations. Please see <a href="http://mattermost.org/webhooks" target="_blank">http://mattermost.org/webhooks</a> to learn more.'
                 />
                 <div><label className='control-label padding-top x2'>
                     <FormattedMessage

web/react/package.json

@@ -4,6 +4,7 @@
   "private": true,
   "dependencies": {
     "autolinker": "0.22.0",
+    "fastclick": "^1.0.6",
     "flux": "2.1.1",
     "highlight.js": "8.9.1",
     "keymirror": "0.1.1",

web/react/utils/markdown.jsx

@@ -222,7 +222,7 @@ class MattermostMarkdownRenderer extends marked.Renderer {
     }
 
     table(header, body) {
-        return `<table class="markdown__table"><thead>${header}</thead><tbody>${body}</tbody></table>`;
+        return `<div class="table-responsive"><table class="markdown__table"><thead>${header}</thead><tbody>${body}</tbody></table></div>`;
     }
 
     listitem(text) {