https://github.com/NodeBB/NodeBB/issues/8043

less/chats.less

@@ -231,6 +231,13 @@
 			overflow: hidden;
 			text-overflow: ellipsis;
 			display: block;
+			[component="chat/title"] {
+				overflow: hidden;
+    			white-space: nowrap;
+    			text-overflow: ellipsis;
+    			max-width: 350px;
+    			display: inline-block;
+			}
 		}
 
 		.teaser-content, .room-name {

templates/chat.tpl

@@ -9,15 +9,6 @@
 				<div class="dropdown pull-right">
 					<button class="close" data-toggle="dropdown" component="chat/controlsToggle"><i class="fa fa-gear"></i></button>
 					<ul class="dropdown-menu dropdown-menu-right pull-right" component="chat/controls">
-						<!-- IF users.length -->
-						<li class="dropdown-header">[[modules:chat.in-room]]</li>
-						{{{each users}}}
-						<li>
-							<a href="{config.relative_path}/uid/{../uid}">{buildAvatar(users, "sm", true)} {../username}</a>
-						</li>
-						{{{end}}}
-						<li role="separator" class="divider"></li>
-						<!-- END -->
 						<li class="dropdown-header">[[modules:chat.options]]</li>
 						<li>
 							<a href="#" data-action="members"><i class="fa fa-fw fa-cog"></i> [[modules:chat.manage-room]]</a>
@@ -28,6 +19,15 @@
 						<li>
 							<a href="#" data-action="leave"><i class="fa fa-fw fa-sign-out"></i> [[modules:chat.leave]]</a>
 						</li>
+						<!-- IF users.length -->
+						<li role="separator" class="divider"></li>
+						<li class="dropdown-header">[[modules:chat.in-room]]</li>
+						{{{each users}}}
+						<li>
+							<a href="{config.relative_path}/uid/{../uid}">{buildAvatar(users, "sm", true)} {../username}</a>
+						</li>
+						{{{end}}}
+						<!-- END -->
 					</ul>
 				</div>
 

templates/partials/chats/message-window.tpl

@@ -7,15 +7,6 @@
 		<div class="dropdown pull-right">
 			<button class="close" data-toggle="dropdown" component="chat/controlsToggle"><i class="fa fa-gear"></i></button>
 			<ul class="dropdown-menu dropdown-menu-right pull-right" component="chat/controls">
-				<!-- IF users.length -->
-				<li class="dropdown-header">[[modules:chat.in-room]]</li>
-				{{{each users}}}
-				<li>
-					<a href="{config.relative_path}/uid/{../uid}">{buildAvatar(users, "sm", true)} {../username}</a>
-				</li>
-				{{{end}}}
-				<li role="separator" class="divider"></li>
-				<!-- END -->
 				<li class="dropdown-header">[[modules:chat.options]]</li>
 				<li>
 					<a href="#" data-action="members"><i class="fa fa-fw fa-cog"></i> [[modules:chat.manage-room]]</a>
@@ -26,6 +17,15 @@
 				<li>
 					<a href="#" data-action="leave"><i class="fa fa-fw fa-sign-out"></i> [[modules:chat.leave]]</a>
 				</li>
+				<!-- IF users.length -->
+				<li role="separator" class="divider"></li>
+				<li class="dropdown-header">[[modules:chat.in-room]]</li>
+				{{{each users}}}
+				<li>
+					<a href="{config.relative_path}/uid/{../uid}">{buildAvatar(users, "sm", true)} {../username}</a>
+				</li>
+				{{{end}}}
+				<!-- END -->
 			</ul>
 		</div>
 		<span class="members">