From 673dc2215954e806d0c6093a0de422c08cecb03d Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Wed, 19 Sep 2018 17:30:15 +0200
Subject: [PATCH] Update messenger UI

---
 customize.dist/src/less2/include/messenger.less | 10 ++++++++++
 www/contacts/messenger-ui.js                    |  8 +++++---
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/customize.dist/src/less2/include/messenger.less b/customize.dist/src/less2/include/messenger.less
index 7a56af1d5..4570297d7 100644
--- a/customize.dist/src/less2/include/messenger.less
+++ b/customize.dist/src/less2/include/messenger.less
@@ -308,6 +308,7 @@
                         }
                         flex: 1;
                         min-width: 70%;
+                        position: relative;
                     }
                     .cp-app-contacts-date {
                         display: none;
@@ -326,6 +327,15 @@
                         font-size: 0.8em;
                         align-items: center;
                         color: @color;
+                        font-weight: bold;
+                        position: absolute;
+                        right: 0;
+                        top: 0;
+                        bottom: 0;
+                        background: rgba(0,0,0,0.3);
+                        border-top-left-radius: 50%;
+                        border-bottom-left-radius: 50%;
+                        padding: 0 10px;
                     }
                     &:hover {
                         .cp-app-contacts-time {
diff --git a/www/contacts/messenger-ui.js b/www/contacts/messenger-ui.js
index eb96776b8..5872f4780 100644
--- a/www/contacts/messenger-ui.js
+++ b/www/contacts/messenger-ui.js
@@ -137,7 +137,7 @@ define([
 
         $(window).on('resize', onResize);
 
-        var m = function (md) {
+        var m = function (md, hour) {
             var d = h('div.cp-app-contacts-content');
             try {
                 d.innerHTML = Marked(md || '');
@@ -155,6 +155,9 @@ define([
 
                 // activate media-tags
                 $d.find('media-tag').each(function (i, e) { MediaTag(e); });
+
+                var time = h('div.cp-app-contacts-time', hour);
+                $d.append(time);
             } catch (e) {
                 console.error(md);
                 console.error(e);
@@ -180,8 +183,7 @@ define([
                     h('span.cp-app-contacts-sender-name', name),
                     h('span.cp-app-contacts-sender-time', day)
                 ]): undefined,
-                m(msg.text),
-                h('div.cp-app-contacts-time', hour)
+                m(msg.text, hour),
             ]);
         };