Improve responsiveness

src/app/shared/chat/group-messages/group-contacts/group-contacts.page.ts

@@ -239,7 +239,7 @@ export class GroupContactsPage implements OnInit {
           name:this.groupName,
           duration:'',
         },
-        cssClass: 'new-group',
+        cssClass: 'new-group modal-desktop',
         backdropDismiss: false,
       });
       await modal.present();
@@ -299,7 +299,7 @@ export class GroupContactsPage implements OnInit {
     this.close();
     const modal = await this.modalController.create({
       component: NewGroupPage,
-      cssClass: 'new-group',
+      cssClass: 'new-group modal-desktop',
       backdropDismiss: false,
     });
     await modal.present();

src/app/shared/chat/group-messages/group-messages.page.ts

@@ -240,7 +240,7 @@ export class GroupMessagesPage implements OnInit, OnChanges {
   async openOptions(ev: any) {
     const popover = await this.popoverController.create({
       component: ChatPopoverPage,
-      cssClass: 'chat-popover',
+      cssClass: 'chat-popover modal-desktop',
       event: ev,
       componentProps: {
         room: this.room,

src/app/shared/header/header.page.html

@@ -58,10 +58,10 @@
 
       <div class="d-flex">
         <div class="mr-10 d-flex align-center">
-          <button (click)="openSearch()" *ngIf="!showSearch" class="btn-no-color" (click)="showSearch=true">
+          <button (click)="openSearch();showSearch=true" *ngIf="!showSearch" class="btn-no-color">
             <ion-icon class="font-45"   src='assets/images/icons-search.svg'></ion-icon>
           </button>
-          <button class="btn-no-color" (click)="closeSearch()" *ngIf="showSearch" (click)="showSearch=false">
+          <button class="btn-no-color" (click)="closeSearch();showSearch=false" *ngIf="showSearch" >
             <ion-icon class="font-40" name="restaurant-outline" src="assets/images/icons-search-close.svg"></ion-icon>
           </button>
           

src/app/shared/header/header.page.ts

@@ -13,7 +13,7 @@ export class HeaderPage implements OnInit {
 
   profile: string = 'mdgpr';
   searchSubject: string = '';
-  showSearch:false;
+  showSearch=false;
 
   constructor(
     private router: Router,private modalController: ModalController,
@@ -41,9 +41,16 @@ export class HeaderPage implements OnInit {
 
   async openSearch() {
 
+    let classs;
+    if(window.innerWidth < 1366) {
+      classs = 'modal modal-width-100 modal-padding-top'
+    } else {
+      classs = 'modal modal-width-100 modal-padding-top modal-desktop-shadow modal-desktop-remove-background'
+    }
+
     const modal = await this.modalController.create({
       component: SearchPage,
-      cssClass: 'group-messages modal-desktop search-modal search-modal-to-desktop',
+      cssClass: classs,
       componentProps: {
       }
     });