app.html 1.4 KB

12345678910111213141516171819202122232425262728293031323334
  1. <ion-menu id="sideNav" [content]="content">
  2. <ion-header>
  3. <ion-toolbar>
  4. <ion-title>Menu</ion-title>
  5. </ion-toolbar>
  6. </ion-header>
  7. <ion-content>
  8. <div class="user-info" *ngIf="user" (click)="showProfile(user.id)" menuClose>
  9. <div class="user-banner" [style.background]="'url('+ banner +')'">
  10. <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px"
  11. viewBox="0 0 300 100" xml:space="preserve" width="100%" class="svg-triangle">
  12. <polygon points="0,75 0,100 300,100 300,99" fill="#FFFFFF" />
  13. </svg>
  14. <img src="{{ user.profile_image_url_https | highResolution }}" alt="User" class="user-avatar">
  15. </div>
  16. <div class="user-info">
  17. {{user.name}}<br><span class="handle">@{{user.screen_name}}</span>
  18. </div>
  19. </div>
  20. <ion-list>
  21. <button menuClose ion-item no-padding icon-start *ngFor="let page of pages" (click)="openPage(page)">
  22. <ion-icon name="{{page.icon}}"></ion-icon>{{page.title}}
  23. </button>
  24. <button menuClose ion-item no-padding icon-start (click)="logout()">
  25. <ion-icon name="log-out"></ion-icon>Logout
  26. </button>
  27. </ion-list>
  28. </ion-content>
  29. </ion-menu>
  30. <!-- Disable swipe-to-go-back because it's poor UX to combine STGB with side menus -->
  31. <ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>