From: Jay Sitter <jay@jaysitter.com>
Date: Tue, 20 Jun 2023 23:53:55 +0000 (-0400)
Subject: feat: Hide 'comments' in post listing comments button; icon and title text is clear
X-Git-Url: http://these/git/?a=commitdiff_plain;h=3574212c76dfaebbf6915aea3fa538ba1e05b740;p=lemmy-ui.git

feat: Hide 'comments' in post listing comments button; icon and title text is clear
---

diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx
index 1c58546..5249e8f 100644
--- a/src/shared/components/post/post-listing.tsx
+++ b/src/shared/components/post/post-listing.tsx
@@ -734,24 +734,22 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
 
   get commentsButton() {
     const post_view = this.postView;
+    const title = i18n.t("number_of_comments", {
+      count: Number(post_view.counts.comments),
+      formattedCount: Number(post_view.counts.comments),
+    });
+
     return (
       <Link
-        className="btn btn-link text-muted ps-0 text-muted"
-        title={i18n.t("number_of_comments", {
-          count: Number(post_view.counts.comments),
-          formattedCount: Number(post_view.counts.comments),
-        })}
+        className="btn btn-link btn-sm text-muted ps-0"
+        title={title}
         to={`/post/${post_view.post.id}?scrollToComments=true`}
+        data-tippy-content={title}
       >
         <Icon icon="message-square" classes="me-1" inline />
-        <span className="me-2">
-          {i18n.t("number_of_comments", {
-            count: Number(post_view.counts.comments),
-            formattedCount: numToSI(post_view.counts.comments),
-          })}
-        </span>
+        {post_view.counts.comments}
         {this.unreadCount && (
-          <span className="small text-warning">
+          <span className="badge text-bg-warning">
             ({this.unreadCount} {i18n.t("new")})
           </span>
         )}