From 2fdf939ca996afbe70d8e5aec965fb197e3a15ae Mon Sep 17 00:00:00 2001
From: Matthew Hodgson <matthew@matrix.org>
Date: Tue, 11 Nov 2014 05:02:24 +0000
Subject: [PATCH] fix weird shaped message table rows

---
 syweb/webclient/app.css        | 12 +++++-------
 syweb/webclient/room/room.html |  4 ++--
 2 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/syweb/webclient/app.css b/syweb/webclient/app.css
index 8da293a72b..134b1d2912 100755
--- a/syweb/webclient/app.css
+++ b/syweb/webclient/app.css
@@ -601,11 +601,11 @@ textarea, input {
         
 #messageTable td {
     padding: 0px;
-/*  border: 1px solid #888; */
+/*    border: 1px solid #888; */
 }
 
 .leftBlock {
-    width: 6em;
+    width: 7em;
     word-wrap: break-word;
     vertical-align: top;
     background-color: #fff;
@@ -649,7 +649,7 @@ textarea, input {
 .avatar {
     width: 48px;
     text-align: right;
-    vertical-align: bottom;
+    vertical-align: top;
     line-height: 0;
 }
 
@@ -709,11 +709,9 @@ textarea, input {
     max-height: auto;
 }
 
-/*
-.differentUser td {
-    padding-bottom: 5px ! important;
+.differentUser .msg {
+    padding-top: 14px ! important;
 }
-*/
 
 .mine {
     text-align: right;
diff --git a/syweb/webclient/room/room.html b/syweb/webclient/room/room.html
index 018d66f4fb..d1d1589e25 100644
--- a/syweb/webclient/room/room.html
+++ b/syweb/webclient/room/room.html
@@ -152,7 +152,7 @@
          keep-scroll>
         <table id="messageTable" infinite-scroll="paginateMore()">
             <tr ng-repeat="msg in room.events"
-                ng-class="(room.events[$index + 1].user_id !== msg.user_id ? 'differentUser' : '') + (msg.user_id === state.user_id ? ' mine' : '')" scroll-item>
+                ng-class="(room.events[$index - 1].user_id !== msg.user_id ? 'differentUser' : '') + (msg.user_id === state.user_id ? ' mine' : '')" scroll-item>
                 <td class="leftBlock" ng-mouseover="state.showTs = 1" ng-mouseout="state.showTs = 0">
                     <div class="timestamp"
                          ng-style="{ 'opacity': state.showTs ? 1.0 : 0.0 }"
@@ -166,7 +166,7 @@
                     <img class="avatarImage" ng-src="{{ msg.__room_member.cnt.avatar_url || msg.__room_member.avatar_url || 'img/default-profile.png' }}" width="32" height="32" title="{{msg.user_id}}"
                          ng-hide="room.events[$index - 1].user_id === msg.user_id || msg.user_id === state.user_id"/>
                 </td>
-                <td style="vertical-align: bottom" ng-class="(!msg.content.membership && ('m.room.topic' !== msg.type && 'm.room.name' !== msg.type))? (msg.content.msgtype === 'm.emote' ? 'emote text' : 'text') : 'membership text'">
+                <td class="msg" ng-class="(!msg.content.membership && ('m.room.topic' !== msg.type && 'm.room.name' !== msg.type))? (msg.content.msgtype === 'm.emote' ? 'emote text' : 'text') : 'membership text'">
                     <div class="bubble" ng-dblclick="openJson(msg)">
                         <span ng-if="'join' === msg.content.membership && msg.changedKey === 'membership'">
                             {{ msg.content.displayname || members[msg.state_key].displayname || msg.state_key }} joined