<ion-header>
  <ion-toolbar>
    <ion-title>{{ title | titlecase }}</ion-title>
    <ion-buttons slot="end">
      <ion-button (click)="dismiss()">
        <ion-icon slot="icon-only" name="close"></ion-icon>
      </ion-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content>
  <text-spinner *ngIf="loading; else loaded" [text]="'Loading ' + title | titlecase"></text-spinner>

  <ng-template #loaded>

    <ion-item *ngIf="loadingError; else noError">
      <ion-label>
        <ion-text color="danger">
          {{ loadingError }}
        </ion-text>
      </ion-label>
    </ion-item>

    <ng-template #noError>
      <div class="content-padding" [innerHTML]="content | markdown"></div>
    </ng-template>
  </ng-template>
</ion-content>
