contacts page style finished

src/app/pages/chat/new-group/contacts/contacts.page.html

@@ -12,8 +12,10 @@
       </div>
     </div>
   </ion-toolbar>
-  <ion-toolbar class="header-search">
-    <ion-searchbar (ionChange)="onChange($event)" placeholder="Pesquisar por cantacto" ></ion-searchbar>
+  <ion-toolbar class="toolbar-search">
+    <div class="search">
+      <ion-searchbar (ionChange)="onChange($event)" placeholder="Pesquisar por cantacto" ></ion-searchbar>
+    </div>
   </ion-toolbar>
 </ion-header>
 
@@ -25,32 +27,29 @@
     </ion-refresher>
   <div class="main-content">
     
-    <ion-list>
-      <!-- <ion-item *ngFor="let user of searchedItem">
+    <!-- <ion-list>
+      <ion-item *ngFor="let user of searchedItem">
         {{user.name}}
-      </ion-item> -->
-      <div class="ion-no-padding item-checkbox no-inner-padding" lines="none">
-        <ion-checkbox color="primary"></ion-checkbox>
-        <p>Tiago Kayaya</p>
+      </ion-item>
+    </ion-list> -->
+
+    <ion-virtual-scroll [items]="users" approxItemHeight="70px" [headerFn]="separateLetter">
+  
+      <div class="item-divider" *virtualHeader="let header">
+        <ion-label>{{header}}</ion-label>
       </div>
-      <div class="ion-no-padding item-checkbox no-inner-padding" lines="none">
+
+      <div *virtualItem="let user" class="item-checkbox">
         <ion-checkbox color="primary"></ion-checkbox>
-        <p>Gilson Manuel</p>
+         <p>{{user.first}} {{user.last}}</p>
         <ion-icon name="ellipse"></ion-icon>
       </div>
-    </ion-list>
-    <!-- <ion-alpha-scroll
-        [listData]="contacts"
-        key="name"
-        [itemTemplate]="alphaScrollItemTemplateRef"
-        [currentPageClass]="currentPageClass"
-        [triggerChange]="triggerAlphaScrollChange">
+      
+    </ion-virtual-scroll>
 
-          <ng-template #alphaScrollItemTemplateRef let-item>
-            <ion-item (click)="currentPageClass.onItemClick(item)">{{item.$t}}</ion-item>
-          </ng-template>
 
-      </ion-alpha-scroll> -->
+
+    
   </div>    
 </ion-content>