Add an avatar in the header

I am trying to add an avatar to the header but the buttons on the far right seems to get in the way.

The code:

      <ion-avatar item-left>
        <img [src]="user.avatar">
      <h2>Marty McFly</h2>
    <ion-buttons end>
      <button ion-button icon-only [navPush]="eventAddPage">
        <ion-icon name="add"></ion-icon>
      <button ion-button icon-only (click)="logOut()">
        <ion-icon name="log-out"></ion-icon>
  <ion-segment [(ngModel)]="gmap">
    <ion-segment-button value="map">
    <ion-segment-button value="list">

Is there a better way of implementing the header?

1 Like