admin/manage/users styling

public/less/admin/manage/users.less

@@ -1,10 +1,9 @@
 .users {
 	#users-container {
 		border: 1px solid #eee;
-		padding: 0px 20px 20px
+		padding: 0px 20px 20px;
-	}
 
-	.users-box{
+		.users-box {
 			display: inline-block;
 			margin-top: 20px;
 			text-align: center;
@@ -22,6 +21,26 @@
 
 			a {
 				margin-bottom:5px;
+				font-size: 12px;
+			}
+
+			.user-image {
+				position: relative;
+
+				.labels {
+					position: absolute;
+					bottom: 0px;
+					width: 100%;
+
+					span {
+						width: 100%;
+						opacity: 0.9;
+						font-size: 10px;
+						display: block;
+						border-radius: 0;
+					}
+				}
+			}
 		}
 	}
 }

src/views/admin/manage/users.tpl

@@ -38,24 +38,15 @@
 				<ul id="users-container">
 					<!-- BEGIN users -->
 					<div class="users-box" data-uid="{users.uid}" data-username="{users.username}">
-
+						<div class="user-image">
 							<img src="{users.picture}" class="img-thumbnail user-selectable"/>
-						<br/>
+							<div class="labels">
-						
-						<a href="{relative_path}/user/{users.userslug}" target="_blank">{users.username}</a>
-						<br/>
-
-						<div title="uid">
-							<i class='fa fa-user'></i>
-							<span>{users.uid}</span>
-						</div>
-
 								<span class="administrator label label-primary <!-- IF !users.administrator -->hide<!-- ENDIF !users.administrator -->">Admin</span>
-
-						<br/>
-
 								<span class="ban label label-danger <!-- IF !users.banned -->hide<!-- ENDIF !users.banned -->">Banned</span>
+							</div>
+						</div>
 						
+						<a href="{relative_path}/user/{users.userslug}" target="_blank">{users.username} ({users.uid})</a>
 					</div>
 					<!-- END users -->
 				</ul>