Merge pull request #2100 from asaadmahmoodspin/ui-improvements

Multiple UI Improvements

web/react/components/user_settings/manage_command_hooks.jsx

@@ -530,17 +530,19 @@ export default class ManageCommandCmds extends React.Component {
                             />
                         </label>
                         <div className='padding-top'>
-                            <label>
-                                <input
-                                    type='checkbox'
-                                    checked={this.state.cmd.auto_complete}
-                                    onChange={this.updateAutoComplete}
-                                />
-                                <FormattedMessage
-                                    id='user.settings.cmds.auto_complete_help'
-                                    defaultMessage='Show this command in autocomplete list'
-                                />
-                            </label>
+                            <div className='checkbox'>
+                                <label>
+                                    <input
+                                        type='checkbox'
+                                        checked={this.state.cmd.auto_complete}
+                                        onChange={this.updateAutoComplete}
+                                    />
+                                    <FormattedMessage
+                                        id='user.settings.cmds.auto_complete_help'
+                                        defaultMessage=' Show this command in autocomplete list'
+                                    />
+                                </label>
+                            </div>
                         </div>
                     </div>
                     <div className='padding-top x2'>
@@ -637,7 +639,7 @@ export default class ManageCommandCmds extends React.Component {
                         </div>
                         {addError}
                     </div>
-                    <div className='padding-top padding-bottom'>
+                    <div className='padding-top x2 padding-bottom'>
                         <a
                             className={'btn btn-sm btn-primary'}
                             href='#'

web/sass-files/sass/partials/_base.scss

@@ -25,6 +25,10 @@ body {
     }
 }
 
+b, strong {
+    font-weight: 600;
+}
+
 .inner__wrap {
     height: 100%;
     > .row.main {

web/sass-files/sass/partials/_post.scss

@@ -485,8 +485,9 @@ body.ios {
 				-webkit-font-smoothing: antialiased;
 				-moz-osx-font-smoothing: grayscale;
 				position: absolute;
-				top: -3px;
-				left: -1.0em;
+				top: -2px;
+				left: -7px;
+			    font-size: 11px;
 				line-height: 37px;
 				@include opacity(0);
 			}
@@ -570,11 +571,20 @@ body.ios {
 
 		li {
 			display: inline-block;
+			vertical-align: top;
 		}
 
 		.col__name {
 			margin-right: 7px;
 			font-weight: 600;
+
+			.user-popover {
+				max-width: 200px;
+				@include clearfix;
+				text-overflow: ellipsis;
+				white-space: nowrap;
+			}
+
 		}
 
 		.col__reply {

web/sass-files/sass/partials/_responsive.scss

@@ -160,6 +160,11 @@
 
             .col__name {
                 pointer-events: none;
+
+                .user-popover {
+                    max-width: 130px;
+                }
+
             }
 
         }

web/sass-files/sass/partials/_sidebar--right.scss

@@ -16,6 +16,22 @@
 
     }
 
+    .post {
+
+        .post__header {
+
+            .col__name {
+
+                .user-popover {
+                    max-width: 130px;
+                }
+
+            }
+
+        }
+
+    }
+
     .sidebar--right__content {
         height: 100%;
         @include display-flex;