diff --git a/plugins/chat/assets/javascripts/discourse/components/chat/thread/participants.hbs b/plugins/chat/assets/javascripts/discourse/components/chat/thread/participants.hbs
index 6670bfb536d..f1c08cca433 100644
--- a/plugins/chat/assets/javascripts/discourse/components/chat/thread/participants.hbs
+++ b/plugins/chat/assets/javascripts/discourse/components/chat/thread/participants.hbs
@@ -11,11 +11,14 @@
@showPresence={{false}}
/>
{{/each}}
- {{#if @thread.preview.otherParticipantCount}}
-
- +{{@thread.preview.otherParticipantCount}}
-
- {{/if}}
+ {{#if @thread.preview.otherParticipantCount}}
+
+ {{i18n
+ "chat.thread.participants_other_count"
+ count=@thread.preview.otherParticipantCount
+ }}
+
+ {{/if}}
{{/if}}
\ No newline at end of file
diff --git a/plugins/chat/assets/stylesheets/common/chat-message-thread-indicator.scss b/plugins/chat/assets/stylesheets/common/chat-message-thread-indicator.scss
index f7d724fc541..7c875ecc1ef 100644
--- a/plugins/chat/assets/stylesheets/common/chat-message-thread-indicator.scss
+++ b/plugins/chat/assets/stylesheets/common/chat-message-thread-indicator.scss
@@ -54,7 +54,6 @@
@include ellipsis;
font-weight: bold;
color: var(--primary-very-high);
- margin-right: 0.25rem;
}
&__last-reply-info {
@@ -66,7 +65,7 @@
&__last-reply-timestamp {
color: var(--primary-high);
- font-size: var(--font-down-2);
+ font-size: var(--font-down-3);
}
&__last-reply-excerpt {
@@ -80,7 +79,7 @@
display: flex;
align-items: center;
justify-content: flex-end;
- gap: 0.5rem;
+ gap: 0.25rem;
}
&__replies-count {
diff --git a/plugins/chat/assets/stylesheets/common/chat-thread-participants.scss b/plugins/chat/assets/stylesheets/common/chat-thread-participants.scss
index de5031bed86..1cd561c32f8 100644
--- a/plugins/chat/assets/stylesheets/common/chat-thread-participants.scss
+++ b/plugins/chat/assets/stylesheets/common/chat-thread-participants.scss
@@ -1,19 +1,8 @@
.chat-thread-participants {
margin-left: 0.5rem;
&__other-count {
- display: flex;
- align-items: center;
- justify-content: center;
- width: 22px;
- height: 22px;
- border: 1px solid rgba(0, 0, 0, 0);
- box-sizing: border-box;
font-size: var(--font-down-2);
- color: var(--primary-very-low);
- background: var(--secondary-high);
- padding: 0.21em 0.42em;
- border-radius: 1em;
- text-align: center;
+ color: var(--primary-high);
white-space: nowrap;
}
@@ -41,11 +30,11 @@
@container (max-width: 400px) {
.chat-thread-participants {
&__avatar-group {
- flex-direction: row-reverse;
+ flex-direction: row;
justify-content: flex-start;
.chat-user-avatar {
- &:not(:first-child) {
- margin-right: -12px;
+ &:not(:last-child) {
+ margin-right: -10px;
}
.avatar {
width: 22px;
@@ -54,12 +43,5 @@
}
}
}
- &__other-count {
- width: 22px;
- height: 22px;
- margin-right: -12px;
- z-index: 1;
- border: 1px solid var(--primary-very-low);
- }
}
}
diff --git a/plugins/chat/config/locales/client.en.yml b/plugins/chat/config/locales/client.en.yml
index 84e144bacc8..2c1e1cf3ffa 100644
--- a/plugins/chat/config/locales/client.en.yml
+++ b/plugins/chat/config/locales/client.en.yml
@@ -584,8 +584,8 @@ en:
title: "Tracking"
description: "A count of new replies for this thread will be shown in the thread list and the channel. You will be notified if someone mentions your @name in this thread."
participants_other_count:
- one: "+%{count} other"
- other: "+%{count} others"
+ one: "+%{count}"
+ other: "+%{count}"
threads:
open: "Open Thread"
list: "Ongoing discussions"