Fixing various issues with markdown spacing (#5203)

webapp/components/post_view/components/post_body.jsx

@@ -4,6 +4,7 @@
 import UserStore from 'stores/user_store.jsx';
 import * as Utils from 'utils/utils.jsx';
 import * as GlobalActions from 'actions/global_actions.jsx';
+import * as PostUtils from 'utils/post_utils.jsx';
 import Constants from 'utils/constants.jsx';
 import CommentedOnFilesMessageContainer from './commented_on_files_message_container.jsx';
 import FileAttachmentListContainer from 'components/file_attachment_list_container.jsx';
@@ -141,6 +142,10 @@ export default class PostBody extends React.Component {
             );
         }
 
+        if (PostUtils.isEdited(this.props.post)) {
+            postClass += ' post--edited';
+        }
+
         let fileAttachmentHolder = null;
         if (((post.file_ids && post.file_ids.length > 0) || (post.filenames && post.filenames.length > 0)) && this.props.post.state !== Constants.POST_DELETED) {
             fileAttachmentHolder = (

webapp/sass/layout/_post.scss

@@ -440,7 +440,7 @@
 
             &.btn-file__disabled {
                 @include opacity(.1);
-                
+
                 &:hover,
                 &:active {
                     @include opacity(.1);
@@ -613,10 +613,12 @@
 
             p + p {
                 margin: 1em 0;
+
                 &:last-of-type {
                     margin-bottom: 0;
                 }
             }
+
             span {
                 > p:first-child {
                     margin-bottom: 1em;
@@ -706,6 +708,14 @@
         position: relative;
     }
 
+    .post--edited {
+        p {
+            &:last-child {
+                display: inline;
+            }
+        }
+    }
+
     p {
         font-size: .97em;
         line-height: 1.6em;
@@ -1005,27 +1015,13 @@
         }
 
         p + p {
-            margin: 1.4em 0;
+            margin: 1.2em 0;
+
             &:last-of-type {
                 margin-bottom: 0;
             }
         }
 
-        span {
-            > p:last-child {
-                display: inline;
-            }
-            > p:first-child {
-                margin-bottom: 1.4em;
-            }
-        }
-
-        li {
-            > p {
-                margin-top: 10px;
-            }
-        }
-
         img {
             max-height: 400px;
         }
@@ -1083,6 +1079,11 @@
             }
         }
 
+        ul + p,
+        ol + p {
+            margin-top: 1.2em;
+        }
+
         .pending-post-actions {
             background: alpha-property($black, .7);
             color: $white;
@@ -1098,10 +1099,11 @@
             }
         }
 
-        span.edited {
+        span {
-            color: #A3A3A3;
+            &.edited {
-            font-size: 0.87em;
+                @include opacity(.6);
-            opacity: 0.6;
+                font-size: .87em;
+            }
         }
     }