Ui improvements (#5948)

* PLT-5849 - Code block wrap on IOS

* PLT-5972 - Comment has first line indented

* PLT-6048 - Adjusting UI for link previews

* PLT-5733 - Adding error text theme option

webapp/utils/constants.jsx

@@ -449,6 +449,7 @@ export const Constants = {
             linkColor: '#2f81b7',
             buttonBg: '#1dacfc',
             buttonColor: '#FFFFFF',
+            errorTextColor: '#a94442',
             mentionHighlightBg: '#f3e197',
             mentionHighlightLink: '#2f81b7',
             codeTheme: 'github',
@@ -474,6 +475,7 @@ export const Constants = {
             linkColor: '#2389d7',
             buttonBg: '#23A2FF',
             buttonColor: '#FFFFFF',
+            errorTextColor: '#a94442',
             mentionHighlightBg: '#f3e197',
             mentionHighlightLink: '#2f81b7',
             codeTheme: 'github',
@@ -499,6 +501,7 @@ export const Constants = {
             linkColor: '#A4FFEB',
             buttonBg: '#4CBBA4',
             buttonColor: '#FFFFFF',
+            errorTextColor: '#ff6461',
             mentionHighlightBg: '#984063',
             mentionHighlightLink: '#A4FFEB',
             codeTheme: 'solarized-dark',
@@ -524,6 +527,7 @@ export const Constants = {
             linkColor: '#0D93FF',
             buttonBg: '#0177e7',
             buttonColor: '#FFFFFF',
+            errorTextColor: '#ff6461',
             mentionHighlightBg: '#784098',
             mentionHighlightLink: '#A4FFEB',
             codeTheme: 'monokai',
@@ -606,6 +610,11 @@ export const Constants = {
             id: 'newMessageSeparator',
             uiName: 'New Message Separator'
         },
+        {
+            group: 'centerChannelElements',
+            id: 'errorTextColor',
+            uiName: 'Error Text Color'
+        },
         {
             group: 'centerChannelElements',
             id: 'mentionHighlightBg',

webapp/utils/utils.jsx

@@ -707,6 +707,10 @@ export function applyTheme(theme) {
         changeCss('.app__body .btn.btn-primary, .app__body .post__pinned-badge', 'color:' + theme.buttonColor);
     }
 
+    if (theme.errorTextColor) {
+        changeCss('.app__body .has-error .help-block, .app__body .has-error .control-label, .app__body .has-error .radio, .app__body .has-error .checkbox, .app__body .has-error .radio-inline, .app__body .has-error .checkbox-inline, .app__body .has-error.radio label, .app__body .has-error.checkbox label, .app__body .has-error.radio-inline label, .app__body .has-error.checkbox-inline label', 'color:' + theme.errorTextColor);
+    }
+
     if (theme.mentionHighlightBg) {
         changeCss('.app__body .mention--highlight, .app__body .search-highlight', 'background:' + theme.mentionHighlightBg);
         changeCss('.app__body .post.post--comment .post__body.mention-comment', 'border-color:' + theme.mentionHighlightBg);