Merge pull request #1353 from jsit/fix/fix-post-title-element

fix: Only post title should be inside h5, not the additional metadata icons
This commit is contained in:
SleeplessOne1917 2023-06-18 13:55:35 +00:00 committed by GitHub
commit b17be67836
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -497,7 +497,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
const post = this.postView.post; const post = this.postView.post;
return ( return (
<Link <Link
className={`d-inline-block ${ className={`d-inline ${
!post.featured_community && !post.featured_local !post.featured_community && !post.featured_local
? "text-body" ? "text-body"
: "text-primary" : "text-primary"
@ -505,8 +505,8 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
to={`/post/${post.id}`} to={`/post/${post.id}`}
title={i18n.t("comments")} title={i18n.t("comments")}
> >
<div <span
className="d-inline-block" className="d-inline"
dangerouslySetInnerHTML={mdToHtmlInline(post.name)} dangerouslySetInnerHTML={mdToHtmlInline(post.name)}
/> />
</Link> </Link>
@ -519,88 +519,80 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
return ( return (
<div className="post-title overflow-hidden"> <div className="post-title overflow-hidden">
<h5> <h5 className="d-inline">
{url ? ( {url && this.props.showBody ? (
this.props.showBody ? ( <a
<a className={
className={`d-inline-block ${ !post.featured_community && !post.featured_local
!post.featured_community && !post.featured_local ? "text-body"
? "text-body" : "text-primary"
: "text-primary" }
}`} href={url}
href={url} title={url}
title={url} rel={relTags}
rel={relTags} dangerouslySetInnerHTML={mdToHtmlInline(post.name)}
> ></a>
<div
className="d-inline-block"
dangerouslySetInnerHTML={mdToHtmlInline(post.name)}
/>
</a>
) : (
this.postLink
)
) : ( ) : (
this.postLink this.postLink
)} )}
{(url && isImage(url)) ||
(post.thumbnail_url && (
<button
className="btn btn-link text-monospace text-muted small d-inline-block"
data-tippy-content={i18n.t("expand_here")}
onClick={linkEvent(this, this.handleImageExpandClick)}
>
<Icon
icon={
!this.state.imageExpanded ? "plus-square" : "minus-square"
}
classes="icon-inline"
/>
</button>
))}
{post.removed && (
<small className="ml-2 text-muted font-italic">
{i18n.t("removed")}
</small>
)}
{post.deleted && (
<small
className="unselectable pointer ml-2 text-muted font-italic"
data-tippy-content={i18n.t("deleted")}
>
<Icon icon="trash" classes="icon-inline text-danger" />
</small>
)}
{post.locked && (
<small
className="unselectable pointer ml-2 text-muted font-italic"
data-tippy-content={i18n.t("locked")}
>
<Icon icon="lock" classes="icon-inline text-danger" />
</small>
)}
{post.featured_community && (
<small
className="unselectable pointer ml-2 text-muted font-italic"
data-tippy-content={i18n.t("featured")}
>
<Icon icon="pin" classes="icon-inline text-primary" />
</small>
)}
{post.featured_local && (
<small
className="unselectable pointer ml-2 text-muted font-italic"
data-tippy-content={i18n.t("featured")}
>
<Icon icon="pin" classes="icon-inline text-secondary" />
</small>
)}
{post.nsfw && (
<small className="ml-2 text-muted font-italic">
{i18n.t("nsfw")}
</small>
)}
</h5> </h5>
{(url && isImage(url)) ||
(post.thumbnail_url && (
<button
className="btn btn-link text-monospace text-muted small d-inline-block"
data-tippy-content={i18n.t("expand_here")}
onClick={linkEvent(this, this.handleImageExpandClick)}
>
<Icon
icon={
!this.state.imageExpanded ? "plus-square" : "minus-square"
}
classes="icon-inline"
/>
</button>
))}
{post.removed && (
<small className="ml-2 text-muted font-italic">
{i18n.t("removed")}
</small>
)}
{post.deleted && (
<small
className="unselectable pointer ml-2 text-muted font-italic"
data-tippy-content={i18n.t("deleted")}
>
<Icon icon="trash" classes="icon-inline text-danger" />
</small>
)}
{post.locked && (
<small
className="unselectable pointer ml-2 text-muted font-italic"
data-tippy-content={i18n.t("locked")}
>
<Icon icon="lock" classes="icon-inline text-danger" />
</small>
)}
{post.featured_community && (
<small
className="unselectable pointer ml-2 text-muted font-italic"
data-tippy-content={i18n.t("featured")}
>
<Icon icon="pin" classes="icon-inline text-primary" />
</small>
)}
{post.featured_local && (
<small
className="unselectable pointer ml-2 text-muted font-italic"
data-tippy-content={i18n.t("featured")}
>
<Icon icon="pin" classes="icon-inline text-secondary" />
</small>
)}
{post.nsfw && (
<small className="ml-2 text-muted font-italic">
{i18n.t("nsfw")}
</small>
)}
</div> </div>
); );
} }