updated chat dropdown as well

less/chats.less

@@ -2,11 +2,17 @@
 	margin-top: 10px;
 }
 
+.chat-list {
+	margin-top: -6px;
+    margin-left: -1px;
+}
+
 .chats-list {
 	padding: 0;
 	overflow-x: hidden;
 	overflow-y: auto;
 	border-top: 1px solid @gray-lighter;
+	max-width: 360px;
 
 	> li {
 		position: relative;

templates/partials/chats/dropdown.tpl

@@ -1,26 +1,32 @@
 <!-- IF rooms.length -->
 <!-- BEGIN rooms -->
 <li class="<!-- IF ../unread -->unread<!-- ENDIF ../unread -->" data-roomid="{rooms.roomId}">
-	<a data-ajaxify="false"><!-- IF rooms.roomName -->{rooms.roomName}<!-- ELSE -->{rooms.usernames}<!-- ENDIF rooms.roomName --></a>
+	<strong class="room-name">
+		<!-- IF !rooms.lastUser.uid -->
+		<span>[[modules:chat.no-users-in-room]]</span>
+		<!-- ELSE -->
+		<!-- IF rooms.roomName -->{rooms.roomName}<!-- ELSE -->{rooms.usernames}<!-- ENDIF rooms.roomName -->
+		<!-- ENDIF !rooms.lastUser.uid -->
+	</strong>
+	<div class="avatar-placeholder"></div>
+	<!-- BEGIN rooms.users -->
+	<!-- IF @first -->
+	<div class="main-avatar">
+		<!-- IMPORT partials/chats/user.tpl -->
+	</div>
+	<!-- ENDIF @first -->
+	<!-- END rooms.users -->
 
 	<ul class="members">
 		<!-- BEGIN rooms.users -->
 		<li>
-			<a href="{config.relative_path}/user/{rooms.users.userslug}" class="user-link">
-				<!-- IF rooms.users.picture -->
-				<img class="user-img avatar avatar-sm avatar-rounded" src="{rooms.users.picture}" title="{rooms.users.username}">
-				<!-- ELSE -->
-				<div class="user-img avatar avatar-sm avatar-rounded" title="{rooms.users.username}" style="background-color: {rooms.users.icon:bgColor};">{rooms.users.icon:text}</div>
-				<!-- ENDIF rooms.users.picture -->
-			</a>
+			<!-- IMPORT partials/chats/user.tpl -->
 		</li>
 		<!-- END rooms.users -->
-		<!-- IF !rooms.lastUser.uid -->
-		<li>[[modules:chat.no-users-in-room]]</li>
-		<!-- ENDIF !rooms.lastUser.uid -->
 	</ul>
 
-
+	<span class="teaser-content">{rooms.teaser.content}</span>
+	<span class="teaser-timestamp timeago pull-right" title="{rooms.teaser.timestampISO}"></span>
 </li>
 <!-- END rooms -->
 <!-- ELSE -->

templates/partials/menu.tpl

@@ -49,7 +49,7 @@
 						</a>
 						<ul class="dropdown-menu" aria-labelledby="chat_dropdown">
 							<li>
-								<ul component="chat/list" class="chat-list">
+								<ul component="chat/list" class="chat-list chats-list">
 									<li>
 										<i class="fa fa-refresh fa-spin"></i> [[global:chats.loading]]
 									</li>