save

src/app/pages/chat/messages/messages.page.html

@@ -3,9 +3,9 @@
     <div class="main-header">
       <div class="header-top">
         <app-btn-modal-dismiss></app-btn-modal-dismiss>
-        <div class="middle">
-          <ion-label class="title" *ngFor="let users of dmUsers">{{users.name}}</ion-label>
-          <span *ngIf="userPresence =='online'"><ion-icon class="user-status-online" name="ellipse"></ion-icon></span>
+        <div class="middle" *ngFor="let users of dmUsers">
+          <ion-label class="title">{{users.name}}</ion-label>
+          <span><ion-icon class="{{users.status}}" name="ellipse"></ion-icon></span>
         </div>
         <div class="right">
           <ion-icon  (click)="openMessagesOptions()" src="assets/images/icons-menu.svg"></ion-icon>

src/app/pages/chat/messages/messages.page.scss

@@ -175,6 +175,7 @@
       align-self: center;
     }
   }
+  
  }
 
  .text-color-blue{
@@ -189,4 +190,34 @@
     color:#99e47b;
     padding-left: 10px;
  }
+ .online{
+  display: block;
+  float: left;
+  color:#99e47b;
+  padding-left: 10px;
+}
+.offline{
+ color:#cbced1;
+ display: block;
+ float: left;
+ padding-left: 10px;
+}
+.away{
+color:#ffd21f;
+display: block;
+ float: left;
+ padding-left: 10px;
+}
+.invisible{
+  color:#cbced1;
+  display: block;
+ float: left;
+ padding-left: 10px;
+}
+.busy{
+  color:#f5455c;
+  display: block;
+ float: left;
+ padding-left: 10px;
+}