mirror of
https://github.com/LemmyNet/lemmy-ui.git
synced 2024-12-23 11:21:26 +00:00
Merge pull request #1455 from jsit/feat/add-post-body-preview-to-desktop
feat: Add post body preview to desktop
This commit is contained in:
commit
7bfa837938
1 changed files with 39 additions and 47 deletions
|
@ -381,10 +381,8 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
createdLine() {
|
createdLine() {
|
||||||
const post_view = this.postView;
|
const post_view = this.postView;
|
||||||
return (
|
return (
|
||||||
<ul className="list-inline mb-1 text-muted small mt-2">
|
<span className="small">
|
||||||
<li className="list-inline-item">
|
|
||||||
<PersonListing person={post_view.creator} />
|
<PersonListing person={post_view.creator} />
|
||||||
|
|
||||||
{this.creatorIsMod_ && (
|
{this.creatorIsMod_ && (
|
||||||
<span className="mx-1 badge text-bg-light">
|
<span className="mx-1 badge text-bg-light">
|
||||||
{I18NextService.i18n.t("mod")}
|
{I18NextService.i18n.t("mod")}
|
||||||
|
@ -407,7 +405,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
<CommunityLink community={post_view.community} />
|
<CommunityLink community={post_view.community} />
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</li>
|
|
||||||
{post_view.post.language_id !== 0 && (
|
{post_view.post.language_id !== 0 && (
|
||||||
<span className="mx-1 badge text-bg-light">
|
<span className="mx-1 badge text-bg-light">
|
||||||
{
|
{
|
||||||
|
@ -416,17 +413,13 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
)?.name
|
)?.name
|
||||||
}
|
}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}{" "}
|
||||||
<li className="list-inline-item">•</li>
|
•{" "}
|
||||||
<li className="list-inline-item">
|
|
||||||
<span>
|
|
||||||
<MomentTime
|
<MomentTime
|
||||||
published={post_view.post.published}
|
published={post_view.post.published}
|
||||||
updated={post_view.post.updated}
|
updated={post_view.post.updated}
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -767,10 +760,8 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
to={`/post/${post_view.post.id}?scrollToComments=true`}
|
to={`/post/${post_view.post.id}?scrollToComments=true`}
|
||||||
data-tippy-content={title}
|
data-tippy-content={title}
|
||||||
>
|
>
|
||||||
<span className="me-1">
|
|
||||||
<Icon icon="message-square" classes="me-1" inline />
|
<Icon icon="message-square" classes="me-1" inline />
|
||||||
{post_view.counts.comments}
|
{post_view.counts.comments}
|
||||||
</span>
|
|
||||||
{this.unreadCount && (
|
{this.unreadCount && (
|
||||||
<span className="text-muted fst-italic">
|
<span className="text-muted fst-italic">
|
||||||
({this.unreadCount} {I18NextService.i18n.t("new")})
|
({this.unreadCount} {I18NextService.i18n.t("new")})
|
||||||
|
@ -1104,7 +1095,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
const post_view = this.postView;
|
const post_view = this.postView;
|
||||||
return (
|
return (
|
||||||
this.state.showAdvanced && (
|
this.state.showAdvanced && (
|
||||||
<>
|
<div className="mt-3">
|
||||||
{this.canMod_ && (
|
{this.canMod_ && (
|
||||||
<>
|
<>
|
||||||
{!this.creatorIsMod_ &&
|
{!this.creatorIsMod_ &&
|
||||||
|
@ -1265,7 +1256,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</>
|
</div>
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -1460,11 +1451,11 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
showMobilePreview() {
|
showBodyPreview() {
|
||||||
const { body, id } = this.postView.post;
|
const { body, id } = this.postView.post;
|
||||||
|
|
||||||
return !this.showBody && body ? (
|
return !this.showBody && body ? (
|
||||||
<Link className="text-body" to={`/post/${id}`}>
|
<Link className="text-body mt-2 d-block" to={`/post/${id}`}>
|
||||||
<div className="md-div mb-1 preview-lines">{body}</div>
|
<div className="md-div mb-1 preview-lines">{body}</div>
|
||||||
</Link>
|
</Link>
|
||||||
) : (
|
) : (
|
||||||
|
@ -1485,7 +1476,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
{this.mobileThumbnail()}
|
{this.mobileThumbnail()}
|
||||||
|
|
||||||
{/* Show a preview of the post body */}
|
{/* Show a preview of the post body */}
|
||||||
{this.showMobilePreview()}
|
{this.showBodyPreview()}
|
||||||
|
|
||||||
{this.commentsLine(true)}
|
{this.commentsLine(true)}
|
||||||
{this.userActionsLine()}
|
{this.userActionsLine()}
|
||||||
|
@ -1507,6 +1498,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
<div className="col-12">
|
<div className="col-12">
|
||||||
{this.postTitleLine()}
|
{this.postTitleLine()}
|
||||||
{this.createdLine()}
|
{this.createdLine()}
|
||||||
|
{this.showBodyPreview()}
|
||||||
{this.commentsLine()}
|
{this.commentsLine()}
|
||||||
{this.duplicatesLine()}
|
{this.duplicatesLine()}
|
||||||
{this.userActionsLine()}
|
{this.userActionsLine()}
|
||||||
|
|
Loading…
Reference in a new issue