diff options
-rw-r--r-- | web/react/components/posts_view.jsx | 17 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_post.scss | 22 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_responsive.scss | 118 |
3 files changed, 101 insertions, 56 deletions
diff --git a/web/react/components/posts_view.jsx b/web/react/components/posts_view.jsx index 087ca1df2..ec8223203 100644 --- a/web/react/components/posts_view.jsx +++ b/web/react/components/posts_view.jsx @@ -83,9 +83,14 @@ export default class PostsView extends React.Component { let hideProfilePic = false; if (prevPost) { - sameUser = prevPost.user_id === post.user_id && post.create_at - prevPost.create_at <= 1000 * 60 * 5; + const postIsComment = Utils.isComment(post); + const prevPostIsComment = Utils.isComment(prevPost); + const postFromWebhook = Boolean(post.props && post.props.from_webhook); + const prevPostFromWebhook = Boolean(prevPost.props && prevPost.props.from_webhook); - sameRoot = Utils.isComment(post) && (prevPost.id === post.root_id || prevPost.root_id === post.root_id); + sameUser = prevPost.user_id === post.user_id && postFromWebhook === prevPostFromWebhook && + post.create_at - prevPost.create_at <= 1000 * 60 * 5; + sameRoot = (postIsComment && (prevPost.id === post.root_id || prevPost.root_id === post.root_id)) || (!postIsComment && !prevPostIsComment && sameUser); // hide the profile pic if: // the previous post was made by the same user as the current post, @@ -94,10 +99,10 @@ export default class PostsView extends React.Component { // the current post is not from a webhook // and the previous post is not from a webhook if ((prevPost.user_id === post.user_id) && - !Utils.isComment(prevPost) && - !Utils.isComment(post) && - (!post.props || !post.props.from_webhook) && - (!prevPost.props || !prevPost.props.from_webhook)) { + !prevPostIsComment && + !postIsComment && + !postFromWebhook && + !prevPostFromWebhook) { hideProfilePic = true; } } diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index e2981e914..5a7d79afe 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -393,6 +393,15 @@ body.ios { .post-body { @include border-radius(0 4px 4px 0); } + .post-body { + border-left: 4px solid #EEE; + width: 570px; + margin-left: 30px; + padding-left: 10px; + .post-link { + display: none; + } + } } } &.same--root { @@ -408,13 +417,12 @@ body.ios { .post__content { padding: 0; } - .post-body { - border-left: 4px solid #EEE; - width: 570px; - margin-left: 30px; - padding-left: 10px; - .post-link { - display: none; + &.same--user { + .post__content { + padding-left: 46px; + } + .post-header-post { + visibility: hidden; } } } diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss index a4bdc3e92..aad991035 100644 --- a/web/sass-files/sass/partials/_responsive.scss +++ b/web/sass-files/sass/partials/_responsive.scss @@ -9,25 +9,26 @@ } } .post { - &.same--root { - margin-left: 60px; - padding-left: 10px; - border-left: 4px solid #EEE; - div.post-profile-img__container { - .post-profile-img { - display: none; - } - } - .post__content { - width: 825px; - } - .post-body { - width: 736px; - border: none; - margin: 3px 0 0; - } - } &.post--comment { + &.same--root { + margin-left: 104px; + padding-left: 10px; + border-left: 4px solid #EEE; + div.post-profile-img__container { + .post-profile-img { + display: none; + } + } + .post__content { + width: 825px; + margin-left: 0; + } + .post-body { + width: 736px; + border: none; + margin: 3px 0 0; + } + } &.other--root { .post-comment { margin-left: 0; @@ -105,34 +106,61 @@ } } .post { - &.same--root { - margin-left: 60px; - padding-left: 10px; - border-left: 4px solid #EEE; - div.post-profile-img__container { - .post-profile-img { - display: none; - } - } - .post__content { - width: 825px; - } - .post-body { - width: 736px; - border: none; - margin: 3px 0 0; - } - } + &.same--root.same--user { + .post-header-post { + visibility: hidden; + width: 100%; + position: relative; + top: -5px; + .post-header-col.post-header__name { + display: none; + } + } + .post-body { + top: -15px; + margin-bottom: -10px; + } + &:hover .post-header-post { + visibility: visible; + } + } + &.post--comment { &.other--root { .post-comment { margin-left: 0; } } - &.same--root { - margin-top: 5px; - margin-bottom: 5px; - } + &.same--root { + margin-top: 5px; + margin-bottom: 5px; + margin-left: 104px; + padding-left: 10px; + border-left: 4px solid #EEE; + div.post-profile-img__container { + .post-profile-img { + display: none; + } + } + .post-body { + margin-left: 0; + border-left: 0; + } + &.same--user { + .post__content { + margin-left: 0; + padding-left: 0; + } + } + } + .post__content { + width: 810px; + } + .post-body { + width: 736px; + border: none; + margin: 3px 0 0; + } } .post__content { width: 880px; @@ -358,9 +386,6 @@ } } .post { - &.same--root { - margin-left: 25px; - } &:hover { background: none; .post-header .post-header-col.post-header__reply { @@ -370,7 +395,11 @@ } } &.post--comment { + &.same--root { + margin-left: 25px; + } &.other--root { + margin-left: 0; &:hover { background: none; } @@ -381,6 +410,9 @@ content: '...'; } } + &.same--root.same--user .post__content{ + padding-left: 0; + } } .signup-team__container { padding: 30px 0; |