chat dropdown

less/header.less

@@ -91,8 +91,15 @@
 					left: -26px;
 				}
 
-				img {
+				.user-icon+i {
+					left: 22px;
+				}
+
+				img, .user-icon {
 					width: 32px;
+					height: 32px;
+					line-height: 32px;
+					font-size: 1.6rem;
 					margin-right: 1em;
 					border-radius: 50%;
 				}

less/users.less

@@ -73,6 +73,8 @@
 		border-radius: 50%;
 		width: 20px;
 		height: 20px;
+		line-height: 20px;
+		font-size: 1rem;
 		vertical-align: middle;
 	}
 

templates/search.tpl

@@ -158,7 +158,13 @@
 
 					<small>
 						<span class="pull-right post-preview-footer">
-							<a href="{config.relative_path}/user/{posts.user.userslug}"><img class="user-img" title="{posts.user.username}" src="{posts.user.picture}"/></a>
+							<a href="{config.relative_path}/user/{posts.user.userslug}">
+								<!-- IF posts.user.picture -->
+								<img class="user-img" title="{posts.user.username}" src="{posts.user.picture}"/>
+								<!-- ELSE -->
+								<div class="user-icon user-img" style="background-color: {posts.user.icon:bgColor};">{posts.user.icon:text}</div>
+								<!-- ENDIF posts.user.picture -->
+							</a>
 							[[global:posted_in_ago, <a href="{config.relative_path}/category/{posts.category.slug}"><i class="fa {posts.category.icon}"></i> {posts.category.name}</a>, <span class="timeago" title="{posts.relativeTime}"></span>]]
 						</span>
 					</small>

templates/usersMap.tpl

@@ -24,7 +24,13 @@
 		<li>
 			<a href="{config.relative_path}{rooms.link}"><!-- IF rooms.core -->[[users:{rooms.room}]]<!-- ELSE -->{rooms.room}<!-- ENDIF rooms.core --></a><br/>
 			<!-- BEGIN rooms.users -->
-				<a href="{config.relative_path}/user/{rooms.users.userslug}"><img class="user-img" src="{rooms.users.picture}" title="{rooms.users.username}"/></a>
+				<a href="{config.relative_path}/user/{rooms.users.userslug}">
+					<!-- IF rooms.users.picture -->
+					<img class="user-img" src="{rooms.users.picture}" title="{rooms.users.username}"/>
+					<!-- ELSE -->
+					<div class="user-icon user-img" style="background-color: {rooms.users.icon:bgColor};">{rooms.users.icon:text}</div>
+					<!-- ENDIF rooms.users.picture -->
+				</a>
 			<!-- END rooms.users -->
 		</li>
 		<!-- ENDIF rooms.total -->