[NEW] Option to select unread count style

packages/rocketchat-i18n/i18n/en.i18n.json

@@ -420,6 +420,7 @@
   "Desktop_Notifications_Duration": "Desktop Notifications Duration",
   "Desktop_Notifications_Duration_Description": "Seconds to display desktop notification. This may affect OS X Notification Center. Enter 0 to use default browser settings and not affect OS X Notification Center.",
   "Desktop_Notifications_Enabled": "Desktop Notifications are Enabled",
+  "Different_Style_For_User_Mentions": "Different style for user mentions",
   "Direct_message_someone": "Direct message someone",
   "Direct_Messages": "Direct Messages",
   "Disable_Notifications": "Disable Notifications",
@@ -1454,6 +1455,7 @@
   "Rooms": "Rooms",
   "Running_Instances": "Running Instances",
   "S_new_messages_since_s": "%s new messages since %s",
+  "Same_Style_For_Mentions": "Same style for mentions",
   "SAML": "SAML",
   "SAML_Custom_Cert": "Custom Certificate",
   "SAML_Custom_Entry_point": "Custom Entry Point",
@@ -1712,6 +1714,7 @@
   "Type_your_new_password": "Type your new password",
   "UI_DisplayRoles": "Display Roles",
   "UI_Merge_Channels_Groups": "Merge private groups with channels",
+  "UI_Unread_Counter_Style": "Unread counter style",
   "UI_Use_Name_Avatar": "Use full name initials to generate default avatar",
   "UI_Use_Real_Name": "Use Real Name",
   "Unarchive": "Unarchive",

packages/rocketchat-lib/server/startup/settings.js

@@ -1040,6 +1040,19 @@ RocketChat.settings.addGroup('Layout', function() {
 			type: 'boolean',
 			'public': true
 		});
+		this.add('UI_Unread_Counter_Style', 'Different_Style_For_User_Mentions', {
+			type: 'select',
+			values: [
+				{
+					key: 'Same_Style_For_Mentions',
+					i18nLabel: 'Same_Style_For_Mentions'
+				}, {
+					key: 'Different_Style_For_User_Mentions',
+					i18nLabel: 'Different_Style_For_User_Mentions'
+				}
+			],
+			'public': true
+		});
 	});
 });
 

packages/rocketchat-theme/client/imports/base.css

@@ -1351,7 +1351,7 @@ label.required::after {
 		right: 6px;
 		font-size: 11px;
 		top: 6px;
-		line-height: 16px;
+		line-height: 14px;
 		font-weight: 800;
 	}
 

packages/rocketchat-theme/server/colors.less

@@ -667,6 +667,7 @@ a:hover {
 
 	.unread {
 		color: @success-color;
+		border: 1px solid @success-color;
 	}
 
 	.unread.unread-mention {

packages/rocketchat-ui-sidenav/client/chatRoomItem.js

@@ -15,11 +15,15 @@ Template.chatRoomItem.helpers({
 	},
 
 	unreadClass() {
+		if (RocketChat.settings.get('UI_Unread_Counter_Style') === 'Same_Style_For_Mentions') {
+			return 'unread unread-mention';
+		}
+
 		if (Match.test(this.userMentions, Number) && this.userMentions > 0) {
 			return 'unread unread-mention';
-		} else {
-			return 'unread';
 		}
+
+		return 'unread';
 	},
 
 	userStatus() {