few fixes

src/components/chatInformation.vue

@@ -9,7 +9,6 @@
           <div class="users">{{getMembers().length}} members</div>
         </div>
         </div>
-        <h2 v-if="getMembers().length !== 0">members:</h2>
         <div v-for="member in getMembers().slice(0,20)" :key="member" class="contentBox" :title="member">
           <userThumbnail
               :mxcURL="getUser(member).avatarUrl"
@@ -68,6 +67,7 @@ export default {
   box-shadow: 6px 6px 20px #111;
   border-radius: 1rem;
   text-align: center;
+  z-index: 30;
 }
 @media (max-width: 30rem) {
   #chatInformation{

src/components/newMessage.vue

@@ -38,7 +38,6 @@ export default {
     async sendMessage(){
       let content = this.msg.content;
       if (!content.body) return;
-      //content.body = content.body.replace(/\n$/gm, '');
       let msgSend = Object.assign({}, this.msg);
       await matrix.sendEvent(msgSend, this.roomId);
       content.body = "";

src/components/throbber.vue

@@ -20,7 +20,7 @@ export default {
     height: 8rem;
     width: 8rem;
     background-color: #1d1d1d;
-    box-shadow: 6px 6px 20px #111;
+    box-shadow: 6px 6px 10px #111;
     border-radius: 2rem;
     .icon{
       position: absolute;

src/components/timeline.vue

@@ -93,7 +93,7 @@ export default {
     .date {
       top: 0.25rem;
       position: sticky;
-      z-index: 100;
+      z-index: 10;
       background-color: #2d2d2d;
       padding: 0.5rem;
       border-radius: 0.5rem;

src/lib/matrixHandler.js

@@ -14,7 +14,7 @@ export class MatrixHandler {
     if (this.client){ console.log('there is already an active session'); return; }
     this.client = new matrix.createClient({
       baseUrl: baseUrl,
-      sessionStore: new matrix.WebStorageSessionStore(window.localStorage)
+      sessionStore: new matrix.WebStorageSessionStore(localStorage)
     });
     this.client.login('m.login.password', {
       user: user,
@@ -45,7 +45,7 @@ export class MatrixHandler {
       baseUrl,
       accessToken,
       userId,
-      sessionStore: new matrix.WebStorageSessionStore(window.localStorage)
+      sessionStore: new matrix.WebStorageSessionStore(localStorage)
     });
     this.user = userId;
     this.baseUrl = baseUrl;
@@ -70,7 +70,7 @@ export class MatrixHandler {
     const msgSend = {
       type: msg.type,
       content: {
-        body: msg.content.body,
+        body: msg.content.body.trim(),
         msgtype: msg.content.msgtype,
       },
     };

src/views/rooms.vue

@@ -79,10 +79,7 @@ export default {
     getPreviewString(room){
       let event = this.getLatestEvent(room);
       if (!event) return '';
-      let text = event.content.body
-        ? event.content.body.length>20?event.content.body.substr(0,19)+'…':event.content.body
-        : 'unknown event';
-      return `${this.calcUserName(event.sender)}: ${text} ${getTime(event.origin_server_ts)}`;
+      return `${this.calcUserName(event.sender)}: ${event.content.body||'unknown event'} ${getTime(event.origin_server_ts)}`;
 
     },
     calcUserName(userId) {
@@ -114,6 +111,7 @@ export default {
   background-color: #222;
   text-align: center;
   overflow-y: auto;
+  z-index: 20;
 }
 .chat{
   position: absolute;
@@ -135,6 +133,10 @@ export default {
   position: absolute;
   left: 4rem;
   top: 0.25rem;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  width: calc(100% - 5rem);
+  text-align: left;
 }
 .preview{
   position: absolute;
@@ -142,6 +144,10 @@ export default {
   left: 4rem;
   font-size: 0.8rem;
   text-align: left;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  width: calc(100% - 4.5rem);
 }
 .roomListSmall{
   position: absolute;
@@ -157,6 +163,7 @@ export default {
   animation: ease;
   animation-duration: 0.2s;
   scrollbar-width: none;
+  z-index: 20;
 }
 .roomListSmall:hover{
   width: 18rem;