Resize menu header and put a content in a first plan

Hi everybody. I’m trying to make a geolocalization app and I faced some difficulties.
Fisrtly I want to increase the height header of the menu (where there is background image and photo), but my when I add a css class nothing happens. I want to have the same thing like in this picture

.

I would also to remove the header and to put the menu button and the search bar in a custom div (the same in google maps), but when I remove the header in the map view, only the search ionic bar appears, but the button menu doesn’t. How could I do please ?

<ion-view hide-nav-bar="true""  >

<!-- hide-nav-bar="true" -->


  <ion-nav-buttons side="left">
    <button menu-toggle="left"class="button button-icon icon ion-navicon"></button>
  </ion-nav-buttons>
 
  <div class="list list-inset">
  <label class="item item-input">
    <i class="icon ion-search placeholder-icon"></i>
    <input type="text" placeholder="Search">
  </label>
</div>


 <ion-content data-tap-disabled="true">


    <leaflet defaults="map.defaults" center="map.center" markers="map.markers" ng-if="map"></leaflet>

  </ion-content>

</ion-view>