Adding compact layout (#2991)

* Adding compact layout

* Fixing ESLint error

webapp/utils/constants.jsx

@@ -531,7 +531,11 @@ export default {
         CHANNEL_DISPLAY_MODE: 'channel_display_mode',
         CHANNEL_DISPLAY_MODE_CENTERED: 'centered',
         CHANNEL_DISPLAY_MODE_FULL_SCREEN: 'full',
-        CHANNEL_DISPLAY_MODE_DEFAULT: 'centered'
+        CHANNEL_DISPLAY_MODE_DEFAULT: 'centered',
+        MESSAGE_DISPLAY: 'message_display',
+        MESSAGE_DISPLAY_CLEAN: 'clean',
+        MESSAGE_DISPLAY_COMPACT: 'compact',
+        MESSAGE_DISPLAY_DEFAULT: 'clean'
     },
     TutorialSteps: {
         INTRO_SCREENS: 0,

webapp/utils/utils.jsx

@@ -734,7 +734,7 @@ export function applyTheme(theme) {
         changeCss('.app__body .scrollbar--horizontal, .app__body .scrollbar--vertical', 'background:' + changeOpacity(theme.centerChannelColor, 0.5), 2);
         changeCss('.app__body .post-list__new-messages-below', 'background:' + changeColor(theme.centerChannelColor, 0.5), 2);
         changeCss('.app__body .post.post--comment .post__body', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
-        changeCss('.app__body .post.post--comment.current--user .post__body', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.13), 1);
+        changeCss('.app__body .post.post--comment.current--user .post__body', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
     }
 
     if (theme.newMessageSeparator) {