<ion-card>
    <a ion-item text-wrap detail-none (click)="openCourse(course)" [title]="course.fullname">
        <h2 float-start><core-format-text [text]="course.fullname"></core-format-text></h2>
        <!-- Download course. -->
        <button *ngIf="prefetchCourseData.prefetchCourseIcon != 'spinner'" ion-button icon-only clear color="dark" float-end (click)="prefetchCourse($event)">
            <ion-icon [name]="prefetchCourseData.prefetchCourseIcon"></ion-icon>
        </button>
        <!-- Download course spinner. -->
        <ion-spinner *ngIf="prefetchCourseData.prefetchCourseIcon == 'spinner'" class="core-course-download-spinner" float-end></ion-spinner>
    </a>
    <ion-item text-wrap *ngIf="course.summary && course.summary.length">
        <p>
            <summary>
                <core-format-text [text]="course.summary" maxHeight="20"></core-format-text>
            </summary>
        </p>
    </ion-item>
    <ion-item *ngIf="course.progress != null && course.progress >= 0">
        <core-progress-bar [progress]="course.progress"></core-progress-bar>
    </ion-item>
    <ng-content></ng-content>
</ion-card>