Entry header layout.

services/web/app/views/project/editor/editor.jade

@@ -56,13 +56,16 @@ div.full-size(
 						ng-style="{'top': top}"
 					)
 						div(ng-if="entry.type == 'insert' || entry.type == 'delete'")
-							div(style="float: right; background-color: hsl({{ users[entry.metadata.user_id].hue }}, 70%, 50%); width: 40px; height: 40px;") {{ users[entry.metadata.user_id].avatar_text }}
-							div.small(style="color: hsl({{ users[entry.metadata.user_id].hue }}, 70%, 50%)") {{ users[entry.metadata.user_id].name }}
-							div.small {{ entry.metadata.ts }}
-							| {{ entry.content }}
+							.review-entry-header
+								.review-entry-header-action-icon
+
+								.review-entry-header-metadata
+									{{ users[entry.metadata.user_id].name }} {{ entry.metadata.ts }}
+								.review-entry-header-avatar(style="background-color: hsl({{ users[entry.metadata.user_id].hue }}, 70%, 50%);") {{ users[entry.metadata.user_id].avatar_text }}
 							.review-entry-body
 								{{ entry.content }}
 							.review-entry-actions
+
 						div(ng-if="entry.type == 'comment'")
 							div(ng-repeat="comment in entry.thread", class="comment-thread__comment")
 								div.small(style="color: hsl({{ users[comment.user_id].hue }}, 70%, 50%)") {{ users[comment.user_id].name }}

services/web/public/stylesheets/app/editor/review-panel.less

@@ -68,7 +68,7 @@
 	border-radius: 3px;
 	margin: 0 6px;
 	background-color: #FFF;
-	max-width: 148px;
+	max-width: 248px;
 	word-wrap: break-word;
 
 	&-insert {
@@ -82,7 +82,7 @@
 	
 	.review-entry-header {
 		display: flex;
-		
+
 		&-action-icon {
 
 		}