<ion-header>
    <ion-navbar core-back-button>
        <ion-title>{{ 'core.contentlinks.chooseaccount' | translate }}</ion-title>
    </ion-navbar>
</ion-header>
<ion-content>
    <core-loading [hideUntil]="loaded">
        <ion-list>
            <ion-item text-wrap>
                <p class="item-heading">{{ 'core.contentlinks.chooseaccounttoopenlink' | translate }}</p>
                <p>{{ url }}</p>
            </ion-item>
            <a ion-item *ngFor="let site of sites" (click)="siteClicked(site.id)" detail-none>
                <ion-avatar item-start>
                    <img [src]="site.avatar" core-external-content [siteId]="site.id" alt="{{ 'core.pictureof' | translate:{$a: site.fullname} }}" role="presentation" onError="this.src='assets/img/user-avatar.png'">
                </ion-avatar>
                <h2>{{site.fullName}}</h2>
                <p><core-format-text [text]="site.siteName" clean="true" [siteId]="site.id"></core-format-text></p>
                <p>{{site.siteUrl}}</p>
            </a>
            <ion-item>
                <button ion-button block (click)="cancel()">{{ 'core.login.cancel' | translate }}</button>
            </ion-item>
        </ion-list>
    </core-loading>
</ion-content>
