From 9fca35cad531fe040155ba460577b0c3eba6b24e Mon Sep 17 00:00:00 2001 From: Reed Garmsen Date: Thu, 2 Jul 2015 11:13:38 -0700 Subject: Added additional class to the markup indicating if the post came from the current user --- web/react/components/post.jsx | 12 +++++++++--- web/react/components/post_right.jsx | 20 +++++++++++++++----- 2 files changed, 24 insertions(+), 8 deletions(-) (limited to 'web') diff --git a/web/react/components/post.jsx b/web/react/components/post.jsx index afe978495..e877a2213 100644 --- a/web/react/components/post.jsx +++ b/web/react/components/post.jsx @@ -6,6 +6,7 @@ var PostBody = require('./post_body.jsx'); var PostInfo = require('./post_info.jsx'); var AppDispatcher = require('../dispatcher/app_dispatcher.jsx'); var Constants = require('../utils/constants.jsx'); +var UserStore = require('../stores/user_store.jsx'); var ActionTypes = Constants.ActionTypes; module.exports = React.createClass({ @@ -56,7 +57,7 @@ module.exports = React.createClass({ var error = this.state.error ?
: null; - if(this.props.sameRoot){ + if (this.props.sameRoot){ rootUser = "same--root"; } else { @@ -64,13 +65,18 @@ module.exports = React.createClass({ } var postType = ""; - if(type != "Post"){ + if (type != "Post"){ postType = "post--comment"; } + var currentUser = ""; + if (UserStore.getCurrentId() === post.user_id) { + currentUser = "current--user"; + } + return (
-
+
{ !this.props.hideProfilePic ?
diff --git a/web/react/components/post_right.jsx b/web/react/components/post_right.jsx index 43be60afa..15a058c5f 100644 --- a/web/react/components/post_right.jsx +++ b/web/react/components/post_right.jsx @@ -68,9 +68,14 @@ RootPost = React.createClass({ var filenames = this.props.post.filenames; var isOwner = UserStore.getCurrentId() == this.props.post.user_id; - var type = "Post" + var type = "Post"; if (this.props.post.root_id.length > 0) { - type = "Comment" + type = "Comment"; + } + + var currentUser = ""; + if (UserStore.getCurrentId() === this.props.post.user_id) { + currentUser = "current--user"; } if (filenames) { @@ -84,7 +89,7 @@ RootPost = React.createClass({ if (fileSplit.length < 2) continue; var ext = fileSplit[fileSplit.length-1]; - fileSplit.splice(fileSplit.length-1,1) + fileSplit.splice(fileSplit.length-1,1); var filePath = fileSplit.join('.'); var filename = filePath.split('/')[filePath.split('/').length-1]; @@ -111,7 +116,7 @@ RootPost = React.createClass({ } return ( -
+
@@ -170,6 +175,11 @@ CommentPost = React.createClass({ var commentClass = "post"; + var currentUser = ""; + if (UserStore.getCurrentId() === this.props.post.user_id) { + currentUser = "current--user"; + } + var postImageModalId = "rhs_comment_view_image_modal_" + this.props.post.id; var filenames = this.props.post.filenames; var isOwner = UserStore.getCurrentId() == this.props.post.user_id; @@ -219,7 +229,7 @@ CommentPost = React.createClass({ var message = utils.textToJsx(this.props.post.message); return ( -
+
-- cgit v1.2.3-1-g7c22 From e46561339f59ff19f68d69596567d1498ed5a857 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Fri, 17 Jul 2015 21:04:33 +0500 Subject: MM-1426 - Updating UI --- web/sass-files/sass/partials/_base.scss | 8 ++++++-- web/sass-files/sass/partials/_modal.scss | 4 ++-- web/sass-files/sass/partials/_post.scss | 14 +++++++++++--- web/sass-files/sass/partials/_responsive.scss | 17 +++++++++++------ web/sass-files/sass/partials/_search.scss | 2 +- web/sass-files/sass/partials/_settings.scss | 4 ++-- web/sass-files/sass/partials/_sidebar--left.scss | 3 ++- web/templates/head.html | 2 +- 8 files changed, 36 insertions(+), 18 deletions(-) (limited to 'web') diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss index 4fb918bd1..cf28e44e8 100644 --- a/web/sass-files/sass/partials/_base.scss +++ b/web/sass-files/sass/partials/_base.scss @@ -3,7 +3,7 @@ html, body { } body { - font-family: 'Lato', sans-serif; + font-family: 'Open Sans', sans-serif; -webkit-font-smoothing: antialiased; background: #e9e9e9; position: relative; @@ -30,6 +30,10 @@ body { } } +b, strong { + font-weight: 600; +} + a { word-break: break-word; } @@ -146,7 +150,7 @@ div.theme { top: 0; color: #FFF; font-size: 20px; - font-weight: bold; + font-weight: 600; text-decoration: none; padding: 0 10px; } diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss index 4427cb7dd..7367b5d1a 100644 --- a/web/sass-files/sass/partials/_modal.scss +++ b/web/sass-files/sass/partials/_modal.scss @@ -8,7 +8,7 @@ } } .info__label { - font-weight: bold; + font-weight: 600; text-align: right; padding-right: 0; } @@ -120,7 +120,7 @@ } .more-channel-name { color: #444; - font-weight: bold; + font-weight: 600; font-size: 0.95em; } tbody { diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index 745d50173..7551d8d58 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -86,10 +86,11 @@ body.ios { background: #FFF; display: inline-block; padding: 0 1em; - font-weight: 900; + font-weight: 700; @include border-radius(50px); position: relative; z-index: 5; + font-size: 13px; } } .new-separator { @@ -212,6 +213,11 @@ body.ios { } } } + &.current--user { + .post-body { + background: #f5f5f5; + } + } &.same--root { .comment-icon__container { @include opacity(0); @@ -269,7 +275,7 @@ body.ios { float: left; .post-profile-img { margin-right: 10px; - @include border-radius(3px); + @include border-radius(50px); } } &.post__content { @@ -290,6 +296,8 @@ body.ios { width: 600px; float: left; word-wrap: break-word; + padding: 0.3em 0 0.1em; + margin: -0.3em 0 0; .post-link { @include clearfix; text-overflow: ellipsis; @@ -359,7 +367,7 @@ body.ios { .embed-title { margin: 3px 0 1px; color: #555; - font-weight: bold; + font-weight: 600; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss index 25533c770..403e84521 100644 --- a/web/sass-files/sass/partials/_responsive.scss +++ b/web/sass-files/sass/partials/_responsive.scss @@ -22,11 +22,17 @@ width: 825px; } .post-body { - padding-left: 0; border: none; margin: 0; } } + .post-body { + float: none; + width: 750px; + padding-left: 0.5em; + padding-right: 0.5em; + margin: 0; + } .post__content { width: 920px; } @@ -63,10 +69,6 @@ } } } - .post-body { - float: none; - width: 750px; - } } } } @@ -89,6 +91,7 @@ margin-left: 60px; padding-left: 10px; border-left: 4px solid #EEE; + margin-bottom: 10px; div.post-profile-img__container { .post-profile-img { display: none; @@ -98,7 +101,6 @@ width: 825px; } .post-body { - padding-left: 0; border: none; margin: 0; } @@ -135,6 +137,9 @@ } } .post-body { + margin: 0; + padding-left: 0.5em; + padding-right: 0.5em; float: none; width: 750px; } diff --git a/web/sass-files/sass/partials/_search.scss b/web/sass-files/sass/partials/_search.scss index ca5d25720..8d51d00c0 100644 --- a/web/sass-files/sass/partials/_search.scss +++ b/web/sass-files/sass/partials/_search.scss @@ -77,7 +77,7 @@ border: none; } .search-channel__name { - font-weight: bold; + font-weight: 600; margin: 0 0 10px 0; } } diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss index dbaab8b58..af759c650 100644 --- a/web/sass-files/sass/partials/_settings.scss +++ b/web/sass-files/sass/partials/_settings.scss @@ -56,7 +56,7 @@ .section-title { margin-bottom: 5px; - font-weight: bold; + font-weight: 600; } .section-edit { @@ -172,7 +172,7 @@ border-top:1px solid lightgrey; } .post-profile-img { - @include border-radius(3px); + @include border-radius(50px); margin-right: 8px; } .member-name { diff --git a/web/sass-files/sass/partials/_sidebar--left.scss b/web/sass-files/sass/partials/_sidebar--left.scss index b1dd470d2..46b328d43 100644 --- a/web/sass-files/sass/partials/_sidebar--left.scss +++ b/web/sass-files/sass/partials/_sidebar--left.scss @@ -59,7 +59,7 @@ color: #999; &.unread-title { color: #333; - font-weight: bold; + font-weight: 600; } &:hover, &:focus { background: #e6f2fa; @@ -70,6 +70,7 @@ color: #111; background-color: #e1e1e1; border-radius: 0; + font-weight: 600; } } } diff --git a/web/templates/head.html b/web/templates/head.html index 5eb7a7333..9c025d1f9 100644 --- a/web/templates/head.html +++ b/web/templates/head.html @@ -14,7 +14,7 @@ - + -- cgit v1.2.3-1-g7c22 From 138d0ea12b6e0f2cd26f658224018c6a76e4d2a8 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Fri, 17 Jul 2015 21:07:53 +0500 Subject: Adding border radius --- web/sass-files/sass/partials/_post.scss | 1 + 1 file changed, 1 insertion(+) (limited to 'web') diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index 7551d8d58..8ce1bf984 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -215,6 +215,7 @@ body.ios { } &.current--user { .post-body { + @include border-radius(4px); background: #f5f5f5; } } -- cgit v1.2.3-1-g7c22 From 30239d255ae8ecbed70bb7b5b10db23039ca649b Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Fri, 17 Jul 2015 22:06:53 +0500 Subject: Improving image modals --- web/sass-files/sass/partials/_headers.scss | 2 +- web/sass-files/sass/partials/_modal.scss | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) (limited to 'web') diff --git a/web/sass-files/sass/partials/_headers.scss b/web/sass-files/sass/partials/_headers.scss index 89bbaef2b..e240d5151 100644 --- a/web/sass-files/sass/partials/_headers.scss +++ b/web/sass-files/sass/partials/_headers.scss @@ -65,7 +65,7 @@ float:left; } .channel-intro-title { - font-weight:bold; + font-weight:600; } .channel-intro-text { margin-top:35px; diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss index 7367b5d1a..b26af1d32 100644 --- a/web/sass-files/sass/partials/_modal.scss +++ b/web/sass-files/sass/partials/_modal.scss @@ -145,6 +145,7 @@ .modal-image { position:relative; width:100%; + height: 100%; margin: 0 auto; .image-wrapper { background: #FFF; -- cgit v1.2.3-1-g7c22 From 665dff3f6d96b5f9736fbae0e87fbb66dc6acb32 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Fri, 17 Jul 2015 22:09:25 +0500 Subject: Improving channel notifications --- web/react/components/channel_notifications.jsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'web') diff --git a/web/react/components/channel_notifications.jsx b/web/react/components/channel_notifications.jsx index fa9ab42ae..638d16576 100644 --- a/web/react/components/channel_notifications.jsx +++ b/web/react/components/channel_notifications.jsx @@ -97,7 +97,7 @@ module.exports = React.createClass({ var inputs = []; inputs.push( -
+