fixed search bar issue, initial userdata issue

src/app/app.component.html

@@ -3,17 +3,14 @@
     <ion-menu>
       <ion-content>
         <div class="side_menu_wrapper">
-<<<<<<< HEAD
-          <ion-menu-toggle>
-            <div class="top_banner" (click)="goToPage('profile')">
-=======
           <ion-menu-toggle *ngIf="userData">
             <div class="top_banner">
->>>>>>> b35f226916e6e5b4feacc30b355445f087230416
-              <div class="top_image"></div>
+              <div class="top_image">
+                <img [src]="userData.profilePhoto" />
+              </div>
               <div class="top_detail">
-                <h4>{{userData.name}}</h4>
-                <p>{{userData.emailId}}</p>
+                <h4>{{ userData.name }}</h4>
+                <p>{{ userData.emailId }}</p>
               </div>
               <div class="clear"></div>
             </div>
@@ -62,7 +59,7 @@
   </ion-split-pane>
 </ion-app>
 
-<div class="common_tab" [hidden]="fetchCase() === true">
+<div class="common_tab" [hidden]="fetchCase() === true" *ngIf="!isSearchOpen">
   <ul>
     <li (click)="goToPage('home')">
       <div
@@ -100,7 +97,8 @@
         class="icon_sec m6_icon"
         [class.m6_icon_act]="sec_active6"
         (click)="setActive6()"
-        menuClose></div>
+        menuClose
+      ></div>
     </li>
   </ul>
 </div>

src/app/app.component.ts

@@ -23,6 +23,8 @@ import { SearchmodalPage } from './searchmodal/searchmodal.page';
   styleUrls: ['app.component.scss']
 })
 export class AppComponent {
+  isSearchOpen = false;
+
   sec_active1 = true;
   sec_active2 = false;
   sec_active3 = false;
@@ -56,7 +58,7 @@ export class AppComponent {
       this.state = loginData;
     });
 
-    this.service.get('userData').then(userData => {
+    this.subjectService.getUserData().subscribe(userData => {
       if (userData) {
         this.userData = JSON.parse(userData);
         console.log(userData);
@@ -109,7 +111,7 @@ export class AppComponent {
   }
 
   setActive1() {
-    this.sec_active1 = !this.sec_active1;
+    this.sec_active1 = true;
     this.sec_active2 = false;
     this.sec_active3 = false;
     this.sec_active4 = false;
@@ -117,7 +119,7 @@ export class AppComponent {
     this.sec_active6 = false;
   }
   setActive2() {
-    this.sec_active2 = !this.sec_active2;
+    this.sec_active2 = true;
     this.sec_active1 = false;
     this.sec_active3 = false;
     this.sec_active4 = false;
@@ -125,7 +127,7 @@ export class AppComponent {
     this.sec_active6 = false;
   }
   setActive3() {
-    this.sec_active3 = !this.sec_active3;
+    this.sec_active3 = true;
     this.sec_active1 = false;
     this.sec_active2 = false;
     this.sec_active4 = false;
@@ -133,7 +135,7 @@ export class AppComponent {
     this.sec_active6 = false;
   }
   setActive4() {
-    this.sec_active4 = !this.sec_active4;
+    this.sec_active4 = true;
     this.sec_active1 = false;
     this.sec_active2 = false;
     this.sec_active3 = false;
@@ -141,7 +143,7 @@ export class AppComponent {
     this.sec_active6 = false;
   }
   setActive5() {
-    this.sec_active5 = !this.sec_active5;
+    this.sec_active5 = true;
     this.sec_active1 = false;
     this.sec_active2 = false;
     this.sec_active3 = false;
@@ -149,7 +151,7 @@ export class AppComponent {
     this.sec_active6 = false;
   }
   setActive6() {
-    this.sec_active6 = !this.sec_active6;
+    this.sec_active6 = true;
     this.sec_active1 = false;
     this.sec_active2 = false;
     this.sec_active3 = false;
@@ -199,10 +201,19 @@ export class AppComponent {
   }
 
   async searchModal() {
+    // Hides Bottom navbar items
+    this.isSearchOpen = true;
     const modal = await this.modalController.create({
       component: SearchmodalPage
     });
-    modal.onDidDismiss().then(dataReturned => {});
+    // modal.onDidDismiss().then(dataReturned => {
+    //
+    // });
+
+    // Shows bottom navbar items on component unmount
+    modal.onWillDismiss().then(() => {
+      this.isSearchOpen = false;
+    });
     return await modal.present();
   }
 }

src/app/changedetails/changedetails.page.ts

@@ -58,13 +58,13 @@ export class ChangedetailsPage implements OnInit {
         form.value.password &&
         form.value.password != form.value.confirmPassword
       ) {
-        this.register.updatePassword(form.value.password);
+        // this.register.updatePassword(form.value.password);
       } else {
         alert('Password should match');
       }
 
       // Calls update user data fn
-      this.register.updateData(form.value, this.userData.uid);
+      // this.register.updateData(form.value, this.userData.uid);
       console.log('valid form values', form.value);
     }
   }

src/app/home/home.page.html

 <div class="nav_header">
   <ion-menu-toggle>
-        <button class="nav_btn nav_menu floatLeft">
-        </button>
+    <button class="nav_btn nav_menu floatLeft"></button>
   </ion-menu-toggle>
 
   <div class="nav_title floatLeft relative">
     <!-- <input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="clickSearch()" (input)="searchFun($event.target.value)" #searchText> -->
 
-        <input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="searchModal()">
-
-    </div>
-    <button class="nav_btn nav_search floatRight" *ngIf="!searchShow">
-    </button>
-    <button class="nav_btn nav_close floatRight" *ngIf="searchShow" (click)="searchClose()">
-    </button>
+    <input
+      class="search_bar"
+      placeholder="Search here.. eg:shirts, retailers etc..."
+      (click)="searchModal()"
+    />
+  </div>
+  <button
+    class="nav_btn nav_search floatRight"
+    *ngIf="!searchShow"
+    (click)="searchModal()"
+  ></button>
+  <button
+    class="nav_btn nav_close floatRight"
+    *ngIf="searchShow"
+    (click)="searchClose()"
+  ></button>
   <div class="clear"></div>
 </div>
 <ion-content>
   <div class="home_wrapper">
-
     <div class="home_banner">
       <div class="home_banner_title">
         <ion-row>
           <ion-col class="textLeft">
-                        <img src="../assets/Group 11_2.png">
+            <img src="../assets/Group 11_2.png" />
           </ion-col>
           <ion-col class="textRight">
             <p class="floatRight" (click)="istoggle()">{{address}}</p>
           </ion-col>
         </ion-row>
       </div>
-            <ion-slides pager="true" *ngIf="centerService.centers && centerService.centers.length > 0">
+      <ion-slides
+        pager="true"
+        *ngIf="centerService.centers && centerService.centers.length > 0"
+      >
         <ion-slide *ngFor="let center of centerService.centers">
           <div class="banner_slide" (click)="goToPage('storelist', center)">
             <h5>{{center.centerName}}</h5>
             <p>{{center.description}}</p>
           </div>
-                    <img [src]="center.centerImg" onerror="this.src='./../../assets/getmi_malls/mall_banner/mall_4.png'">
+          <img
+            [src]="center.centerImg"
+            onerror="this.src='./../../assets/getmi_malls/mall_banner/mall_4.png'"
+          />
         </ion-slide>
       </ion-slides>
     </div>
@@ -44,10 +57,20 @@
       Featured Stores
     </div>
     <div class="featured_slider">
-            <ion-slides pager="false" [options]="slideOpts" *ngIf="shopperService.activeshoppers && shopperService.activeshoppers.length > 0">
+      <ion-slides
+        pager="false"
+        [options]="slideOpts"
+        *ngIf="shopperService.activeshoppers && shopperService.activeshoppers.length > 0"
+      >
         <ion-slide *ngFor="let shopper of shopperService.activeshoppers">
-                    <div class="feature_product" (click)="goToPage('productlist', shopper)">
-                        <img [src]="shopper.featuredImage" onerror="this.src='./../../assets/getmi_malls/featured/featured1.png'">
+          <div
+            class="feature_product"
+            (click)="goToPage('productlist', shopper)"
+          >
+            <img
+              [src]="shopper.featuredImage"
+              onerror="this.src='./../../assets/getmi_malls/featured/featured1.png'"
+            />
             <div class="feature_overlay">
               <h5>{{shopper.name}}</h5>
               <p>{{shopper.caption}}</p>
@@ -68,23 +91,30 @@
     <div class="home_sub_header">
       <span class="floatLeft">Nearby Shopping Centers</span>
       <span class="floatRight">
-                <div class="nearby_icon" (click)="goToPage('nearby')">
-                </div>
+        <div class="nearby_icon" (click)="goToPage('nearby')"></div>
       </span>
       <div class="clear"></div>
     </div>
     <div class="nearby_shop_list">
-            <ul *ngIf="centerService.nearcenters && centerService.nearcenters.length > 0">
-                <li *ngFor="let center of centerService.nearcenters" (click)="goToPage('storelist', center)">
-
+      <ul
+        *ngIf="centerService.nearcenters && centerService.nearcenters.length > 0"
+      >
+        <li
+          *ngFor="let center of centerService.nearcenters"
+          (click)="goToPage('storelist', center)"
+        >
           <div class="nearby_image">
-                        <img [src]="center.centerImg" onerror="this.src='./../../assets/getmi_malls/mall_298/mall2.png'">
+            <img
+              [src]="center.centerImg"
+              onerror="this.src='./../../assets/getmi_malls/mall_298/mall2.png'"
+            />
           </div>
           <div class="nearby_detail">
             <h5>
               <span class="floatLeft">{{center.centerName}}</span>
-                            <span class="floatRight">0
-                                <img src="../assets/Path61_2.png">
+              <span class="floatRight"
+                >0
+                <img src="../assets/Path61_2.png" />
               </span>
               <div class="clear"></div>
             </h5>
@@ -98,9 +128,17 @@
       Featured Catagories
     </div>
     <div class="featured_catagory_list">
-            <ul *ngIf="categoriesService.activecategories && categoriesService.activecategories.length > 0">
-                <li *ngFor="let categories of categoriesService.activecategories" (click)="goToPage('catstorelist', categories)">
-                    <img [src]="categories.catImage" onerror="this.src='../assets/handsome-man-outdoors-drinking-coffee-with-sunglasses-guy-with-beard-instagram-effect_1212-818@3x.png'">
+      <ul
+        *ngIf="categoriesService.activecategories && categoriesService.activecategories.length > 0"
+      >
+        <li
+          *ngFor="let categories of categoriesService.activecategories"
+          (click)="goToPage('catstorelist', categories)"
+        >
+          <img
+            [src]="categories.catImage"
+            onerror="this.src='../assets/handsome-man-outdoors-drinking-coffee-with-sunglasses-guy-with-beard-instagram-effect_1212-818@3x.png'"
+          />
           <div class="featured_overlay">
             <h4>{{categories.catName}}</h4>
           </div>
@@ -112,7 +150,7 @@
 <div *ngIf="isShow" [@slideInOut]>
   <div class="nav_header">
     <button class="nav_btn nav_back floatLeft" (click)="istoggle()">
-            <img src="../assets/Group17_2.png">
+      <img src="../assets/Group17_2.png" />
     </button>
     <div class="nav_title floatLeft">
       <h4>CHANGE LOCATION</h4>
@@ -120,22 +158,41 @@
     <div class="clear"></div>
   </div>
   <ion-content class="sort_wrappper">
-        <agm-map [zoom]="20" [latitude]="lat" [longitude]="lng" [disableDefaultUI]="false" [zoomControl]="false" [backgroundColor]="'rgba(29, 27, 130,0.2)'">
+    <agm-map
+      [zoom]="20"
+      [latitude]="lat"
+      [longitude]="lng"
+      [disableDefaultUI]="false"
+      [zoomControl]="false"
+      [backgroundColor]="'rgba(29, 27, 130,0.2)'"
+    >
       <agm-marker [latitude]="lat" [longitude]="lng"></agm-marker>
     </agm-map>
     <div class="add_address_wrapper">
       <h5>
         <span class="floatLeft">NEW ADDRESS</span>
-                <span class="floatRight" (click)="istoggle(); goToPage('nearby')">ADD NEW</span>
+        <span class="floatRight" (click)="istoggle(); goToPage('nearby')"
+          >ADD NEW</span
+        >
         <div class="clear"></div>
       </h5>
-            <ul *ngIf="addressService.addressList && addressService.addressList.length > 0">
+      <ul
+        *ngIf="addressService.addressList && addressService.addressList.length > 0"
+      >
         <li *ngFor="let address of addressService.addressList; let i = index">
-                    <div class="floatLeft">{{address.default}}
-                        <input class="styled-checkbox" name="addressId" id="styled-checkbox-{{i}}" type="radio" (click)="setDefault(address.addressId)" [value]="address.addressId" #addressType [checked]="address.defaultVal == 1">
-                        <label for="styled-checkbox-{{i}}"> {{address.addressType}}
-                        </label>
-
+          <div class="floatLeft">
+            {{address.default}}
+            <input
+              class="styled-checkbox"
+              name="addressId"
+              id="styled-checkbox-{{i}}"
+              type="radio"
+              (click)="setDefault(address.addressId)"
+              [value]="address.addressId"
+              #addressType
+              [checked]="address.defaultVal == 1"
+            />
+            <label for="styled-checkbox-{{i}}"> {{address.addressType}} </label>
           </div>
           <div class="floatLeft">
             <p>
@@ -146,14 +203,16 @@
         </li>
       </ul>
     </div>
-
   </ion-content>
 </div>
 
-
-
 <div class="search_item_list" *ngIf="searchShow" [@slideInOut]>
   <ul *ngIf="searchService.searchList">
-        <li *ngFor="let search of searchService.searchList" (click)="viewPage(search)">{{search.text}}</li>
+    <li
+      *ngFor="let search of searchService.searchList"
+      (click)="viewPage(search)"
+    >
+      {{search.text}}
+    </li>
   </ul>
 </div>

src/app/productlist/productlist.page.html

 <div class="nav_header">
   <button class="nav_btn nav_back floatLeft" (click)="goBack()">
-        <img src="../assets/Group17_2.png">
+    <img src="../assets/Group17_2.png" />
   </button>
   <div class="nav_title floatLeft">
-        <input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="clickSearch()">
+    <input
+      class="search_bar"
+      placeholder="Search here.. eg:shirts, retailers etc..."
+      (click)="clickSearch()"
+    />
   </div>
-    <button class="nav_btn nav_search floatRight" *ngIf="!searchShow">
-    </button>
-    <button class="nav_btn nav_close floatRight" *ngIf="searchShow" (click)="searchClose()">
-    </button>
+  <button
+    class="nav_btn nav_search floatRight"
+    *ngIf="!searchShow"
+    (click)="clickSearch()"
+  ></button>
+  <button
+    class="nav_btn nav_close floatRight"
+    *ngIf="searchShow"
+    (click)="searchClose()"
+  ></button>
   <div class="clear"></div>
 </div>
 <ion-content>
-
   <div class="product_list">
     <div class="product_taskbar">
-            <div class="filter floatLeft" (click)="istoggle()">
-
-            </div>
+      <div class="filter floatLeft" (click)="istoggle()"></div>
       <div class="viewset floatRight">
-                <div class="grid_view grid_act floatRight" (click)="gridToggle()" [class.line_view]="onGrid">
-                </div>
+        <div
+          class="grid_view grid_act floatRight"
+          (click)="gridToggle()"
+          [class.line_view]="onGrid"
+        ></div>
         <div class="clear"></div>
       </div>
       <div class="clear"></div>
@@ -28,16 +38,29 @@
     <div class="product_title" *ngIf="data">
       {{data.shopName}}
     </div>
-        <ul [class.grid_view]="onGrid" *ngIf="prodService.product && prodService.product.length > 0">
+    <ul
+      [class.grid_view]="onGrid"
+      *ngIf="prodService.product && prodService.product.length > 0"
+    >
       <li *ngFor="let product of prodService.product; let i = index">
         <div class="product_image">
-                    <img [src]="product.image" onerror="this.src='../assets/model1@3x.png'" (click)="prodDetails(i)">
-                    <div [ngClass]="checkFavStatus(product.prodId)" (click)="changeFav(product.prodId)">
-                    </div>
+          <img
+            [src]="product.image"
+            onerror="this.src='../assets/model1@3x.png'"
+            (click)="prodDetails(i)"
+          />
+          <div
+            [ngClass]="checkFavStatus(product.prodId)"
+            (click)="changeFav(product.prodId)"
+          ></div>
           <div class="featured_badge" *ngIf="product.featured">Featured</div>
         </div>
         <h5 class="ellipse" (click)="prodDetails(i)">{{product.prodName}}</h5>
-                <p (click)="prodDetails(i)">A$ {{product.price}}<span class="offer" *ngIf="product.discount > 0">-{{product.discount}}%</span></p>
+        <p (click)="prodDetails(i)">
+          A$ {{product.price}}<span class="offer" *ngIf="product.discount > 0"
+            >-{{product.discount}}%</span
+          >
+        </p>
       </li>
     </ul>
   </div>
@@ -54,11 +77,25 @@
                     <label for="styled-checkbox-2">Relevence</label>
                 </li> -->
         <li>
-                    <input class="styled-checkbox" id="styled-checkbox-3" type="radio" value="low" name="sort" (click)="setValue($event.target.value)">
+          <input
+            class="styled-checkbox"
+            id="styled-checkbox-3"
+            type="radio"
+            value="low"
+            name="sort"
+            (click)="setValue($event.target.value)"
+          />
           <label for="styled-checkbox-3">Price Low - High</label>
         </li>
         <li>
-                    <input class="styled-checkbox" id="styled-checkbox-4" type="radio" value="high" name="sort" (click)="setValue($event.target.value)">
+          <input
+            class="styled-checkbox"
+            id="styled-checkbox-4"
+            type="radio"
+            value="high"
+            name="sort"
+            (click)="setValue($event.target.value)"
+          />
           <label for="styled-checkbox-4">Price High - Low</label>
         </li>
         <!-- <li>
@@ -68,15 +105,21 @@
       </ul>
       <div class="sort_footer">
         <button class="cancel floatLeft" (click)="istoggle()">CANCEL</button>
-                <button class="submit floatRight" (click)="istoggle(); submit()">SUBMIT</button>
+        <button class="submit floatRight" (click)="istoggle(); submit()">
+          SUBMIT
+        </button>
         <div class="clear"></div>
       </div>
     </div>
-
   </div>
 </ion-content>
 <div class="search_item_list" *ngIf="searchShow" [@slideInOut]>
   <ul *ngIf="searchService.searchList">
-            <li *ngFor="let search of searchService.searchList" (click)="viewPage(search)">{{search.text}}</li>
+    <li
+      *ngFor="let search of searchService.searchList"
+      (click)="viewPage(search)"
+    >
+      {{search.text}}
+    </li>
   </ul>
-    </div>
+</div>
\ No newline at end of file

src/app/searchmodal/searchmodal.page.html

 <div class="nav_header">
-    <button class="nav_btn nav_back floatLeft" (click)="closeModal()">
-    </button>
+  <button class="nav_btn nav_back floatLeft" (click)="closeModal()"></button>
   <div class="nav_title floatLeft relative">
-        <input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="clickSearch()" (input)="searchFun($event.target.value)" #searchText>
+    <input
+      class="search_bar"
+      placeholder="Search here.. eg:shirts, retailers etc..."
+      (click)="clickSearch()"
+      (input)="searchFun($event.target.value)"
+      #searchText
+    />
   </div>
-    <button class="nav_btn nav_close floatRight" (click)="closeModal()">
-    </button>
+  <button class="nav_btn nav_close floatRight" (click)="closeModal()"></button>
   <div class="clear"></div>
 </div>
 <div class="search_item_list">
   <ul *ngIf="searchService.searchList">
-        <li *ngFor="let search of searchService.searchList" (click)="viewPage(search)">{{search.text}} </li>
+    <li
+      *ngFor="let search of searchService.searchList"
+      (click)="viewPage(search)"
+    >
+      {{search.text}}
+    </li>
   </ul>
 </div>

src/app/storelist/storelist.page.html

 <div class="nav_header">
-    <button class="nav_btn nav_back floatLeft" (click)="goBack()">
-    </button>
+  <button class="nav_btn nav_back floatLeft" (click)="goBack()"></button>
   <div class="nav_title floatLeft">
-        <input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="clickSearch()">
+    <input
+      class="search_bar"
+      placeholder="Search here.. eg:shirts, retailers etc..."
+      (click)="clickSearch()"
+    />
   </div>
-    <button class="nav_btn nav_search floatRight" *ngIf="!searchShow">
-    </button>
-    <button class="nav_btn nav_close floatRight" *ngIf="searchShow" (click)="searchClose()">
-    </button>
+  <button
+    class="nav_btn nav_search floatRight"
+    *ngIf="!searchShow"
+    (click)="clickSearch()"
+  ></button>
+  <button
+    class="nav_btn nav_close floatRight"
+    *ngIf="searchShow"
+    (click)="searchClose()"
+  ></button>
   <div class="clear"></div>
 </div>
 <ion-content>
@@ -16,10 +25,20 @@
       Featured Stores
     </div>
     <div class="featured_slider">
-            <ion-slides pager="false" [options]="slideOpts" *ngIf="shopperService.activeshoppers && shopperService.activeshoppers.length > 0">
+      <ion-slides
+        pager="false"
+        [options]="slideOpts"
+        *ngIf="shopperService.activeshoppers && shopperService.activeshoppers.length > 0"
+      >
         <ion-slide *ngFor="let shopper of shopperService.activeshoppers">
-                    <div class="feature_product" (click)="goToPage('productlist', shopper)">
-                        <img [src]="shopper.featuredImage" onerror="this.src='./../../assets/getmi_malls/featured/featured1.png'">
+          <div
+            class="feature_product"
+            (click)="goToPage('productlist', shopper)"
+          >
+            <img
+              [src]="shopper.featuredImage"
+              onerror="this.src='./../../assets/getmi_malls/featured/featured1.png'"
+            />
             <div class="feature_overlay">
               <h5>{{shopper.name}}</h5>
               <p>{{shopper.caption}}</p>
@@ -33,15 +52,22 @@
     </div>
     <div class="nearby_shop_list">
       <ul *ngIf="shopperService.shoppers && shopperService.shoppers.length > 0">
-                <li *ngFor="let shopper of shopperService.shoppers" (click)="goToPage('productlist', shopper)">
+        <li
+          *ngFor="let shopper of shopperService.shoppers"
+          (click)="goToPage('productlist', shopper)"
+        >
           <div class="nearby_image">
-                        <img [src]="shopper.profilePic" onerror="this.src='./../../assets/getmi_malls/store298/stores1.png'">
+            <img
+              [src]="shopper.profilePic"
+              onerror="this.src='./../../assets/getmi_malls/store298/stores1.png'"
+            />
           </div>
           <div class="nearby_detail">
             <h5>
               <span class="floatLeft">{{shopper.name}}</span>
-                            <span class="floatRight">0
-                                <img src="../assets/Path61_2.png">
+              <span class="floatRight"
+                >0
+                <img src="../assets/Path61_2.png" />
               </span>
               <div class="clear"></div>
             </h5>
@@ -52,7 +78,6 @@
       </ul>
     </div>
   </div>
-
 </ion-content>
 
 <div class="search_item_list" *ngIf="searchShow" [@slideInOut]>

src/config/auth.service.ts

@@ -150,6 +150,7 @@ export class AuthService {
       };
       this.loggedUser = userData;
       this.service.set('userData', JSON.stringify(this.loggedUser));
+      this.subjectService.sendUserData(JSON.stringify(this.loggedUser));
       console.log(this.loggedUser);
     });
   }

src/config/subject.service.ts

@@ -7,6 +7,7 @@ import { BehaviorSubject } from 'rxjs/BehaviorSubject';
 })
 export class SubjectService {
   private loginState = new BehaviorSubject<any>(null);
+  private DataState = new BehaviorSubject<any>(null);
 
   sendLoginData(state: any) {
     this.loginState.next(state);
@@ -15,4 +16,12 @@ export class SubjectService {
   getLoginData(): Observable<any> {
     return this.loginState.asObservable();
   }
+
+  sendUserData(state: any) {
+    this.DataState.next(state);
+  }
+
+  getUserData(): Observable<any> {
+    return this.DataState.asObservable();
+  }
 }

src/global.scss

@@ -9,25 +9,24 @@
  * https://ionicframework.com/docs/layout/global-stylesheets
  */
 
-
 /* Core CSS required for Ionic components to work properly */
 
-@import "~@ionic/angular/css/core.css";
+@import '~@ionic/angular/css/core.css';
 
 /* Basic CSS for apps built with Ionic */
 
-@import "~@ionic/angular/css/normalize.css";
-@import "~@ionic/angular/css/structure.css";
-@import "~@ionic/angular/css/typography.css";
+@import '~@ionic/angular/css/normalize.css';
+@import '~@ionic/angular/css/structure.css';
+@import '~@ionic/angular/css/typography.css';
 @import '~@ionic/angular/css/display.css';
 
 /* Optional CSS utils that can be commented out */
 
-@import "~@ionic/angular/css/padding.css";
-@import "~@ionic/angular/css/float-elements.css";
-@import "~@ionic/angular/css/text-alignment.css";
-@import "~@ionic/angular/css/text-transformation.css";
-@import "~@ionic/angular/css/flex-utils.css";
+@import '~@ionic/angular/css/padding.css';
+@import '~@ionic/angular/css/float-elements.css';
+@import '~@ionic/angular/css/text-alignment.css';
+@import '~@ionic/angular/css/text-transformation.css';
+@import '~@ionic/angular/css/flex-utils.css';
 
 /*
   Site Name: GETME
@@ -54,7 +53,6 @@
 
 */
 
-
 /*-------------------------------
 
 01. FONTS-N-SIZES
@@ -84,8 +82,8 @@ button {
   outline: none;
 }
 
-input[type=number]::-webkit-inner-spin-button,
-input[type=number]::-webkit-outer-spin-button {
+input[type='number']::-webkit-inner-spin-button,
+input[type='number']::-webkit-outer-spin-button {
   -webkit-appearance: none !important;
   margin: 0;
 }
@@ -165,7 +163,6 @@ button {
   }
 }
 
-
 /*-------------------------------
 
 02. FONTS-SETTINGS
@@ -216,7 +213,6 @@ button {
   font-weight: 600 !important;
 }
 
-
 /*-------------------------------
 
 03. THEMES-N-BACKGROUNDS
@@ -248,7 +244,6 @@ button {
   background-color: rgba(243, 243, 243, 0.6) !important;
 }
 
-
 /*-------------------------------
 
 04. SPACING-N-POSITIONS
@@ -367,7 +362,6 @@ button {
   border: none !important;
 }
 
-
 /*-------------------------------
 
 05. ALIGMENTS
@@ -497,7 +491,7 @@ app-deliverypop {
 
 .nav_back {
   background-color: #fff !important;
-    background-image: url("./assets/Group17_2.png");
+  background-image: url('./assets/Group17_2.png');
   img {
     width: 25px;
     display: none;
@@ -506,7 +500,7 @@ app-deliverypop {
 
 .nav_back_white {
   background-color: transparent;
-    background-image: url("./assets/arrow_white.png");
+  background-image: url('./assets/arrow_white.png');
   img {
     width: 25px !important;
     display: none;
@@ -514,7 +508,7 @@ app-deliverypop {
 }
 
 .nav_menu {
-    background-image: url("./assets/Group22_2.png");
+  background-image: url('./assets/Group22_2.png');
   img {
     width: 25px;
     display: none;
@@ -522,7 +516,7 @@ app-deliverypop {
 }
 
 .nav_search {
-    background-image: url("./assets/search_2.png");
+  background-image: url('./assets/search_2.png');
   img {
     width: 25px;
     display: none;
@@ -530,7 +524,7 @@ app-deliverypop {
 }
 
 .nav_exit {
-    background-image: url("./assets/Group17_2.png");
+  background-image: url('./assets/Group17_2.png');
   img {
     width: 25px;
     display: none;
@@ -538,7 +532,7 @@ app-deliverypop {
 }
 
 .nav_close {
-    background-image: url("./assets/close.png");
+  background-image: url('./assets/close.png');
   img {
     width: 25px;
     display: none;
@@ -546,7 +540,7 @@ app-deliverypop {
 }
 
 .nav_cart {
-    background-image: url("./assets/cart_icon.png");
+  background-image: url('./assets/cart_icon.png');
   img {
     width: 25px;
     display: none;