diff options
author | Asaad Mahmood <asaadmahmood@users.noreply.github.com> | 2017-05-30 20:19:29 +0500 |
---|---|---|
committer | Corey Hulen <corey@hulen.com> | 2017-05-30 08:19:29 -0700 |
commit | b2453735b2109f8039204e59cece98cbac7bc3e7 (patch) | |
tree | c19b4320467d8ba128e75e3c458af963bf22101c | |
parent | 860e5d483cd952ec833c40312a2141bb3e4ef579 (diff) | |
download | chat-b2453735b2109f8039204e59cece98cbac7bc3e7.tar.gz chat-b2453735b2109f8039204e59cece98cbac7bc3e7.tar.bz2 chat-b2453735b2109f8039204e59cece98cbac7bc3e7.zip |
Minor Ui improvements (#6515)
* PLT-6645 - Improving copy pasting behaviour
* PLT-6149 - Fixing edited indicator in search
-rw-r--r-- | webapp/components/post_view/components/post_header.jsx | 12 | ||||
-rw-r--r-- | webapp/components/post_view/components/post_info.jsx | 16 | ||||
-rw-r--r-- | webapp/components/rhs_comment.jsx | 22 | ||||
-rw-r--r-- | webapp/components/rhs_root_post.jsx | 16 | ||||
-rw-r--r-- | webapp/components/search_results_item.jsx | 29 | ||||
-rw-r--r-- | webapp/sass/layout/_post.scss | 3 |
6 files changed, 52 insertions, 46 deletions
diff --git a/webapp/components/post_view/components/post_header.jsx b/webapp/components/post_view/components/post_header.jsx index ce67cd653..570a04f8f 100644 --- a/webapp/components/post_view/components/post_header.jsx +++ b/webapp/components/post_view/components/post_header.jsx @@ -53,7 +53,7 @@ export default class PostHeader extends React.Component { ); } - botIndicator = <li className='bot-indicator'>{Constants.BOT_NAME}</li>; + botIndicator = <div className='bot-indicator'>{Constants.BOT_NAME}</div>; } else if (isSystemMessage) { userProfile = ( <UserProfile @@ -75,10 +75,10 @@ export default class PostHeader extends React.Component { } return ( - <ul className='post__header'> - <li className='col col__name'>{userProfile}{colon}</li> + <div className='post__header'> + <div className='col col__name'>{userProfile}{colon}</div> {botIndicator} - <li className='col'> + <div className='col'> <PostInfo post={post} lastPostCount={this.props.lastPostCount} @@ -92,8 +92,8 @@ export default class PostHeader extends React.Component { useMilitaryTime={this.props.useMilitaryTime} isFlagged={this.props.isFlagged} /> - </li> - </ul> + </div> + </div> ); } } diff --git a/webapp/components/post_view/components/post_info.jsx b/webapp/components/post_view/components/post_info.jsx index 06e7b33fd..74ce32817 100644 --- a/webapp/components/post_view/components/post_info.jsx +++ b/webapp/components/post_view/components/post_info.jsx @@ -388,16 +388,16 @@ export default class PostInfo extends React.Component { let options; if (isEphemeral) { options = ( - <li className='col col__remove'> + <div className='col col__remove'> {this.createRemovePostButton()} - </li> + </div> ); } else if (!isPending) { const dropdown = this.createDropdown(isSystemMessage); if (dropdown) { options = ( - <li className='col col__reply'> + <div className='col col__reply'> <div className='dropdown' ref='dotMenu' @@ -406,7 +406,7 @@ export default class PostInfo extends React.Component { </div> {react} {comments} - </li> + </div> ); } } @@ -424,8 +424,8 @@ export default class PostInfo extends React.Component { } return ( - <ul className='post__header--info'> - <li className='col'> + <div className='post__header--info'> + <div className='col'> <PostTime eventTime={post.create_at} sameUser={this.props.sameUser} @@ -442,9 +442,9 @@ export default class PostInfo extends React.Component { isFlagged={this.props.isFlagged} isEphemeral={isEphemeral} /> - </li> + </div> {options} - </ul> + </div> ); } } diff --git a/webapp/components/rhs_comment.jsx b/webapp/components/rhs_comment.jsx index ce6360c7e..85c2fc1de 100644 --- a/webapp/components/rhs_comment.jsx +++ b/webapp/components/rhs_comment.jsx @@ -436,7 +436,7 @@ export default class RhsComment extends React.Component { ); } - botIndicator = <li className='col col__name bot-indicator'>{'BOT'}</li>; + botIndicator = <div className='col col__name bot-indicator'>{'BOT'}</div>; } else if (isSystemMessage) { userProfile = ( <UserProfile @@ -573,17 +573,17 @@ export default class RhsComment extends React.Component { let options; if (isEphemeral) { options = ( - <li className='col col__remove'> + <div className='col col__remove'> {this.createRemovePostButton()} - </li> + </div> ); } else if (!isSystemMessage) { options = ( - <li className='col col__reply'> + <div className='col col__reply'> {reactOverlay} {this.createDropdown(isSystemMessage)} {react} - </li> + </div> ); } @@ -613,12 +613,12 @@ export default class RhsComment extends React.Component { <div className='post__content'> {profilePicContainer} <div> - <ul className='post__header'> - <li className='col col__name'> + <div className='post__header'> + <div className='col col__name'> <strong>{userProfile}</strong> - </li> + </div> {botIndicator} - <li className='col'> + <div className='col'> {this.renderTimeTag(post, timeOptions)} {pinnedBadge} <PostFlagIcon @@ -628,9 +628,9 @@ export default class RhsComment extends React.Component { isFlagged={this.props.isFlagged} isEphemeral={isEphemeral} /> - </li> + </div> {options} - </ul> + </div> <div className='post__body' > <div className={postClass}> {loading} diff --git a/webapp/components/rhs_root_post.jsx b/webapp/components/rhs_root_post.jsx index 408bce395..f48b4e86a 100644 --- a/webapp/components/rhs_root_post.jsx +++ b/webapp/components/rhs_root_post.jsx @@ -454,7 +454,7 @@ export default class RhsRootPost extends React.Component { ); } - botIndicator = <li className='col col__name bot-indicator'>{'BOT'}</li>; + botIndicator = <div className='col col__name bot-indicator'>{'BOT'}</div>; } else if (isSystemMessage) { userProfile = ( <UserProfile @@ -559,10 +559,10 @@ export default class RhsRootPost extends React.Component { <div className='post__content'> {profilePicContainer} <div> - <ul className='post__header'> - <li className='col__name'>{userProfile}</li> + <div className='post__header'> + <div className='col__name'>{userProfile}</div> {botIndicator} - <li className='col'> + <div className='col'> {this.renderTimeTag(post, timeOptions)} {pinnedBadge} <PostFlagIcon @@ -570,13 +570,13 @@ export default class RhsRootPost extends React.Component { postId={post.id} isFlagged={this.props.isFlagged} /> - </li> - <li className='col col__reply'> + </div> + <div className='col col__reply'> {reactOverlay} {rootOptions} {react} - </li> - </ul> + </div> + </div> <div className='post__body'> <div className={postClass}> <PostBodyAdditionalContent diff --git a/webapp/components/search_results_item.jsx b/webapp/components/search_results_item.jsx index 71240ca48..4eb738065 100644 --- a/webapp/components/search_results_item.jsx +++ b/webapp/components/search_results_item.jsx @@ -150,7 +150,7 @@ export default class SearchResultsItem extends React.Component { let botIndicator; if (post.props && post.props.from_webhook) { - botIndicator = <li className='bot-indicator'>{Constants.BOT_NAME}</li>; + botIndicator = <div className='bot-indicator'>{Constants.BOT_NAME}</div>; } const profilePic = ( @@ -169,6 +169,11 @@ export default class SearchResultsItem extends React.Component { compactClass = ' post--compact'; } + let postClass = ''; + if (PostUtils.isEdited(this.props.post)) { + postClass += ' post--edited'; + } + let fileAttachment = null; if (post.file_ids && post.file_ids.length > 0) { fileAttachment = ( @@ -202,7 +207,7 @@ export default class SearchResultsItem extends React.Component { ); rhsControls = ( - <li className='col__controls'> + <div className='col__controls'> <CommentIcon idPrefix={'searchCommentIcon'} idCount={idCount} @@ -243,7 +248,7 @@ export default class SearchResultsItem extends React.Component { defaultMessage='Jump' /> </a> - </li> + </div> ); message = ( @@ -289,8 +294,8 @@ export default class SearchResultsItem extends React.Component { <div className='post__content'> {profilePicContainer} <div> - <ul className='post__header'> - <li className='col col__name'><strong> + <div className='post__header'> + <div className='col col__name'><strong> <UserProfile user={user} overwriteName={overrideUsername} @@ -298,18 +303,20 @@ export default class SearchResultsItem extends React.Component { status={this.props.status} isBusy={this.props.isBusy} /> - </strong></li> + </strong></div> {botIndicator} - <li className='col'> + <div className='col'> {this.renderTimeTag(post)} {pinnedBadge} {flagContent} - </li> + </div> {rhsControls} - </ul> + </div> <div className='search-item-snippet post__body'> - {message} - {fileAttachment} + <div className={postClass}> + {message} + {fileAttachment} + </div> </div> </div> </div> diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss index 2b84d01f9..85a4bb2cd 100644 --- a/webapp/sass/layout/_post.scss +++ b/webapp/sass/layout/_post.scss @@ -1028,11 +1028,10 @@ } .post__header { - list-style: none; margin-bottom: 2px; padding: 0; - li { + > div { display: inline-block; vertical-align: top; } |