fix event overflow

src/components/replyEvent.vue

@@ -2,8 +2,8 @@
   <div class="reply">
     <span class="username">{{calcUserName(event.sender)}}</span><br>
     <span v-if="event.type==='m.room.message'">
-      <span v-if="event.content.msgtype==='m.text'" v-html="parseMessage(event.content.body).substr(0,200)"/>
+      <span v-if="event.content.msgtype==='m.text'" v-html="parseMessage(event.content.body)"/>
-      <span v-else-if="event.content.msgtype==='m.notice'" class="italic" v-html="parseMessage(event.content.body).substr(0,200)"/>
+      <span v-else-if="event.content.msgtype==='m.notice'" class="italic" v-html="parseMessage(event.content.body)"/>
       <span v-else>
         <span class="italic">{{event.content.msgtype}}</span><br>
         <span>{{event.content.body}}</span>
@@ -34,6 +34,11 @@ export default {
   border-left:  2px solid #fff;
   padding-left: 0.5rem;
   margin-bottom: 0.5rem;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 6;
+  -webkit-box-orient: vertical;
   .username{
     font-weight: bold;
   }

src/components/timeline.vue

@@ -109,8 +109,13 @@ export default {
         }
       }
       .username{
+        position: relative;
         margin-left: 1rem;
         font-weight: bold;
+        max-width: 100%;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        overflow: hidden;
       }
       .indent{
         margin-left: 2.5rem;

src/lib/eventUtils.js

@@ -19,7 +19,7 @@ export function solveMarkdownLinks(text){
   );
 }
 export function fixHtml(text){
-  return text.replace(/>.*\n/gm, '').trim()
+  return text.replace(/> .*\n/gm, '').trim()
     .replace(/</g, '&lt')
     .replace(/>/g, '&gt');
 }