<div>
  <h1 class="api-info-header">{{data.title}} ({{data.version}})</h1>
  <p *ngIf="data.description" innerHtml="{{data.description | marked}}"> </p>
  <p>
    <!-- TODO: create separate components for contact and license ? -->
    <span *ngIf="data.contact"> Contact:
      <a *ngIf="data.contact.url" href="{{data.contact.url}}">
        {{data.contact.name || data.contact.url}}</a>
      <a *ngIf="data.contact.email" href="mailto:{{data.contact.email}}">
        {{data.contact.email}}</a>
    </span>
    <span *ngIf="data.license"> License:
      <a *ngIf="data.license.url" href="{{data.license.url}}"> {{data.license.name}} </a>
      <span *ngIf="!data.license.url"> {{data.license.name}} </span>
    </span>
  </p>
  <p>
    Download OpenAPI (fka Swagger) specification:
    <a class="openapi-button" target="_blank" attr.href='{{specUrl}}'> Download </a>
  </p>
</div>
