MOBILE-3401 courses: Shrink title on course cards with spinner

main
Pau Ferrer Ocaña 2020-06-19 14:55:20 +02:00
parent a1b557d926
commit 460ed1efa4
2 changed files with 6 additions and 2 deletions

View File

@ -3,7 +3,7 @@
<img *ngIf="course.courseImage" [src]="course.courseImage" core-external-content alt=""/>
</div>
<ion-item tappable text-wrap detail-none (click)="openCourse(course)" [title]="course.displayname || course.fullname" class="core-course-link" [class.item-disabled]="course.visible == 0" [class.core-course-more-than-title]="(course.progress != null && course.progress >= 0)">
<div class="core-course-title" [class.core-course-with-buttons]="courseOptionMenuEnabled || (downloadCourseEnabled && showDownload)">
<div class="core-course-title" [class.core-course-with-buttons]="courseOptionMenuEnabled || (downloadCourseEnabled && showDownload)" [class.core-course-with-spinner]="(downloadCourseEnabled && prefetchCourseData.prefetchCourseIcon == 'spinner') || showSpinner">
<p *ngIf="course.categoryname || (course.displayname && course.shortname && course.fullname != course.displayname)" class="core-course-additional-info">
<span *ngIf="course.categoryname" class="core-course-category"><core-format-text [text]="course.categoryname"></core-format-text></span>
<span *ngIf="course.categoryname && course.displayname && course.shortname && course.fullname != course.displayname" class="core-course-category"> | </span>
@ -30,7 +30,7 @@
<ion-spinner *ngIf="(downloadCourseEnabled && prefetchCourseData.prefetchCourseIcon == 'spinner') || showSpinner"></ion-spinner>
<!-- Downloaded icon. -->
<ion-icon *ngIf="downloadCourseEnabled && prefetchCourseData.downloadSucceeded && !showSpinner" class="core-icon-downloaded" name="cloud-done" color="success" [attr.aria-label]="'core.downloaded' | translate" role="status"></ion-icon>
<ion-icon *ngIf="downloadCourseEnabled && prefetchCourseData.downloadSucceeded && !showSpinner" class="core-icon-downloaded" name="cloud-done" color="success" [attr.aria-label]="'core.downloaded' | translate" role="status"></ion-icon>
<!-- Options menu. -->
<button ion-button icon-only clear color="dark" (click)="showCourseOptionsMenu($event)" *ngIf="!showSpinner" [attr.aria-label]="('core.displayoptions' | translate)">

View File

@ -62,6 +62,10 @@ ion-app.app-root core-courses-course-progress {
&.core-course-with-buttons {
max-width: calc(100% - 50px);
&.core-course-with-spinner {
max-width: calc(100% - 100px);
}
}
}