view activity date formatting

gui/app/components/document/view-activity.js

@@ -10,7 +10,6 @@
 // https://documize.com
 
 import { inject as service } from '@ember/service';
-
 import Component from '@ember/component';
 
 export default Component.extend({

gui/app/helpers/formatted-date.js

@@ -13,7 +13,10 @@ import { helper } from '@ember/component/helper';
 import dateUtil from '../utils/date';
 
 export function formattedDate(params) {
-    return dateUtil.toIsoDate(params[0], params[1]);
+    let format = params[1];
+    if (is.undefined(format)) format = 'Do MMMM YYYY, HH:mm';
+
+    return moment(params[0]).format(format);
 }
 
 export default helper(formattedDate);

gui/app/styles/view/document/view-activity.scss

@@ -7,7 +7,7 @@
 
 		> .item {
 			margin: 0;
-			padding: 20px 0;
+			padding: 15px 0;
 			width: 100%;
 
 			> .avatar-box {
@@ -24,6 +24,7 @@
 				font-weight: bold;
 				background-color: $color-gray;
 				color: $color-white;
+				vertical-align: middle;
 				
 				margin: 0 20px 0 0;
 			}
@@ -32,14 +33,14 @@
 				display: inline-block;
 
 				> .name {
-					display: block;
+					display: inline-block;
 					font-size: 1.2rem;
 					color: $color-off-black;
 					font-weight: bold;
 				}
 	
 				> .detail {
-					display: block;
+					display: inline-block;
 					font-size: 1rem;
 					color: $color-gray;
 	

gui/app/templates/components/document/view-activity.hbs

@@ -4,8 +4,8 @@
 			<li class="item">
 				<div class="avatar-box">{{user-initials a.firstname a.lastname}}</div>
 				<div class="activity">
-					<div class="name">{{a.firstname}} {{a.lastname}}</div>
+					<div class="name">{{a.firstname}} {{a.lastname}}&nbsp;&nbsp;</div>
-					<div class="detail {{a.activityColor}}">{{a.activityLabel}}, {{time-ago a.created}}</div>
+					<div class="detail {{a.activityColor}}">{{a.activityLabel}} on {{formatted-date a.created}}</div>
 				</div>
 			</li>
 		{{/each}}