design fix

src/app/home/home.page.html

@@ -11,7 +11,8 @@
                 <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)="goToPage('searchmodal')" />
+                    <h1 class="search_bar" (click)="goToPage('searchmodal')">Search here.. eg:shirts, retailers etc...
+                    </h1>
                 </div>
             </div>
             <div class="search-sctn">
@@ -133,6 +134,9 @@
         </div>
     </ion-header>
     <ion-content class="sort_wrappper">
+        <div class="location-finder">
+            <input type="text" placeholder="Search for location">
+        </div>
         <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" [iconUrl]="
       {

src/app/home/home.page.scss

@@ -255,6 +255,25 @@
     right: 0px;
     bottom: 0px;
     z-index: 99;
+    .location-finder {
+        position: absolute;
+        top: 15px;
+        left: 0;
+        right: 0;
+        padding: 0 20px;
+        z-index: 1;
+        input {
+            width: 100%;
+            border: 1px solid #e0e0e0;
+            outline: none;
+            padding: 8px 15px 8px 35px;
+            border-radius: 25px;
+            background-image: url('/assets/search_2.png');
+            background-position: 15px;
+            background-repeat: no-repeat;
+            background-size: 15px;
+        }
+    }
     agm-map {
         width: 100%;
         height: 100vh;
@@ -346,8 +365,20 @@
     }
     .mid-sctn {
         width: 70%;
+        display: flex;
+        align-items: center;
+        height: 100%;
+        margin-top: 2px;
     }
     .search-sctn {
         width: 15%;
     }
+    h1 {
+        font-size: 16px;
+        margin: 0 10px;
+        text-align: left;
+        overflow: hidden;
+        white-space: nowrap;
+        color: #6d6d6d;
+    }
 }
\ No newline at end of file