More entry styling.

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

@@ -69,7 +69,7 @@ div.full-size(
 
 									.rp-entry-metadata
 										p.rp-entry-metadata-line(style="color: hsl({{ users[entry.metadata.user_id].hue }}, 70%, 50%);") {{ users[entry.metadata.user_id].name }} 
-										p.rp-entry-metadata-line {{ entry.metadata.ts }}
+										p.rp-entry-metadata-line {{ entry.metadata.ts | date : 'MMM d, y h:mm a' }}
 									.rp-entry-avatar(style="background-color: hsl({{ users[entry.metadata.user_id].hue }}, 70%, 50%);") {{ users[entry.metadata.user_id].avatar_text }}
 								.rp-entry-body(ng-switch="entry.type")
 										span(ng-switch-when="insert") Added 
@@ -77,8 +77,12 @@ div.full-size(
 										span(ng-switch-when="delete") Deleted
 											span.rp-content-highlight  {{ entry.content }} 
 								.rp-entry-actions
-									a(href, ng-click="acceptChange(entry_id)") Accept
-									a(href, ng-click="rejectChange(entry_id)") Reject
+									a.rp-entry-button(href, ng-click="acceptChange(entry_id)") 
+										i.fa.fa-check
+										|  Accept
+									a.rp-entry-button(href, ng-click="rejectChange(entry_id)") 
+										i.fa.fa-times
+										|  Reject
 
 							div(ng-if="entry.type == 'comment'")
 								div(ng-repeat="comment in entry.thread", class="comment-thread__comment")

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

@@ -89,6 +89,7 @@
 	}
 		.rp-entry-action-icon {
 			font-size: @rp-icon-large-size;
+			padding: 0 5px;
 		}
 
 		.rp-entry-metadata {
@@ -101,11 +102,19 @@
 			}
 
 		.rp-entry-avatar {
-
+			border-radius: 3px;
+			font-weight: @rp-semibold-weight;
+			font-size: @rp-icon-large-size;
+			line-height: 1.2;
+			text-transform: uppercase;
+			color: #FFF;
+			width: 1.3em;
+			height: 1.3em;
+			text-align: center;
 		}
 
 	.rp-entry-body {
-		padding: 0 5px;
+		padding: 10px 5px 5px;
 	}
 		.rp-content-highlight {
 			color: @rp-type-darkgrey;
@@ -113,8 +122,28 @@
 		}
 
 	.rp-entry-actions {
-
+		display: flex;
 	}
+		.rp-entry-button {
+			flex: 1 0 50%;
+			background-color: @rp-highlight-blue;
+			color: #FFF;
+			text-align: center;
+			border-right: solid 1px #FFF;
+			padding: 2px 0;
+
+			&:hover,
+			&:focus {
+				background-color: darken(@rp-highlight-blue, 5%);
+				text-decoration: none;
+				color: #FFF;
+			}
+
+			&:last-child {
+				border-bottom-right-radius: 3px;
+				border-right-width: 0;
+			}
+		}
 
 
 .rp-icon-delete {
@@ -145,23 +174,23 @@
 	}
 	
 	&-insert {
-		border-color: green;
+		border-color: @rp-green;
 		&:after {
-			border-color: green;
+			border-color: @rp-green;
 		}
 	}
 	
 	&-delete {
-		border-color: red;
+		border-color: @rp-red;
 		&:after {
-			border-color: red;
+			border-color: @rp-red;
 		}
 	}
 	
 	&-comment {
-		border-color: orange;
+		border-color: @rp-yellow;
 		&:after {
-			border-color: orange;
+			border-color: @rp-yellow;
 		}
 	}
 }