MOBILE-2790 dashboard: Switch download button on course cards

main
Pau Ferrer Ocaña 2018-12-14 11:24:16 +01:00
parent dd137cc81f
commit 02f3d107ae
6 changed files with 15 additions and 7 deletions

View File

@ -43,7 +43,7 @@
<ion-grid no-padding>
<ion-row no-padding>
<ion-col *ngFor="let course of filteredCourses" no-padding col-12 col-sm-6 col-md-6 col-lg-4 col-xl-4 align-self-stretch>
<core-courses-course-progress [course]="course" class="core-courseoverview" showAll="true"></core-courses-course-progress>
<core-courses-course-progress [course]="course" class="core-courseoverview" showAll="true" [showDownload]="downloadAllCoursesEnabled"></core-courses-course-progress>
</ion-col>
</ion-row>
</ion-grid>

View File

@ -14,7 +14,7 @@
<div class="safe-area-page">
<div class="core-horizontal-scroll">
<ng-container *ngFor="let course of courses">
<core-courses-course-progress [course]="course" class="core-recentlyaccessedcourses"></core-courses-course-progress>
<core-courses-course-progress [course]="course" class="core-recentlyaccessedcourses" [showDownload]="downloadAllCoursesEnabled"></core-courses-course-progress>
</ng-container>
</div>
</div>

View File

@ -14,7 +14,7 @@
<div class="safe-area-page">
<div class="core-horizontal-scroll">
<ng-container *ngFor="let course of courses">
<core-courses-course-progress [course]="course" class="core-block_starredcourses"></core-courses-course-progress>
<core-courses-course-progress [course]="course" class="core-block_starredcourses" [showDownload]="downloadAllCoursesEnabled"></core-courses-course-progress>
</ng-container>
</div>
</div>

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">
<div class="core-course-title" [class.core-course-with-buttons]="courseOptionMenuEnabled || (downloadCourseEnabled && showDownload)">
<p *ngIf="course.displayname && course.shortname && course.fullname != course.displayname" class="core-course-shortname"><core-format-text [text]="course.shortname"></core-format-text></p>
<h2>
<core-icon name="fa-star" *ngIf="course.isfavourite"></core-icon>
@ -11,7 +11,7 @@
</h2>
</div>
<div class="core-button-spinner" *ngIf="downloadCourseEnabled && !courseOptionMenuEnabled">
<div class="core-button-spinner" *ngIf="downloadCourseEnabled && !courseOptionMenuEnabled && showDownload">
<!-- Download course. -->
<button *ngIf="prefetchCourseData.prefetchCourseIcon != 'spinner'" ion-button icon-only clear color="dark" (click)="prefetchCourse($event)" [attr.aria-label]="prefetchCourseData.title | translate">
<core-icon [name]="prefetchCourseData.prefetchCourseIcon"></core-icon>

View File

@ -54,12 +54,16 @@ ion-app.app-root core-courses-course-progress {
.core-course-title {
margin: 5px 0;
flex-grow: 1;
max-width: calc(100% - 50px);
max-width: calc(100% - 5px);
h2 ion-icon {
margin-right: 4px;
color: $core-star-color;
}
&.core-course-with-buttons {
max-width: calc(100% - 50px);
}
}
&.core-course-more-than-title {
@ -112,7 +116,6 @@ ion-app.app-root .core-horizontal-scroll core-courses-course-progress {
.core-course-title {
margin: 3px 0;
max-width: calc(100% - 40px);
h2 {
font-size: 1.5rem;
@ -120,6 +123,10 @@ ion-app.app-root .core-horizontal-scroll core-courses-course-progress {
margin-right: 2px;
}
}
&.core-course-with-buttons {
max-width: calc(100% - 40px);
}
}
.core-button-spinner {
min-height: 40px;

View File

@ -39,6 +39,7 @@ import { CoreCoursesCourseOptionsMenuComponent } from '../course-options-menu/co
export class CoreCoursesCourseProgressComponent implements OnInit, OnDestroy {
@Input() course: any; // The course to render.
@Input() showAll = false; // If true, will show all actions, options, star and progress.
@Input() showDownload = true; // If true, will show download button. Only works if the options menu is not shown.
isDownloading: boolean;
prefetchCourseData = {