MOBILE-3320 timeline: Fix timeline styles

main
Pau Ferrer Ocaña 2021-05-12 13:05:06 +02:00
parent 104313a885
commit 1219ff45b9
6 changed files with 38 additions and 30 deletions

View File

@ -20,7 +20,7 @@
</core-format-text>
</p>
<ion-button fill="clear" class="ion-hide-md-up" (click)="action($event, event.action.url)"
<ion-button fill="clear" class="ion-hide-md-up ion-text-wrap" (click)="action($event, event.action.url)"
[title]="event.action.name" [disabled]="!event.action.actionable" *ngIf="event.action">
{{event.action.name}}
<ion-badge slot="end" class="ion-margin-start" *ngIf="event.action.showitemcount">{{event.action.itemcount}}
@ -28,19 +28,23 @@
</ion-button>
</ion-label>
<ion-grid slot="end">
<ion-row class="ion-justify-content-end">
<div slot="end" class="events-info">
<div>
<ion-badge color="light">{{event.timesort * 1000 | coreFormatDate:"strftimetime24" }}</ion-badge>
</ion-row>
<ion-row class="ion-justify-content-end">
<ion-button fill="clear" class="ion-hide-md-down" (click)="action($event, event.action.url)"
[title]="event.action.name" [disabled]="!event.action.actionable" *ngIf="event.action">
{{event.action.name}}
<ion-badge slot="end" class="ion-margin-start" *ngIf="event.action.showitemcount">{{event.action.itemcount}}
</ion-badge>
</ion-button>
</ion-row>
</ion-grid>
</div>
<ion-button
class="ion-hide-md-down"
fill="clear"
(click)="action($event, event.action.url)"
[title]="event.action.name"
[disabled]="!event.action.actionable" *ngIf="event.action"
>
{{event.action.name}}
<ion-badge slot="end" class="ion-margin-start" *ngIf="event.action.showitemcount">
{{event.action.itemcount}}
</ion-badge>
</ion-button>
</div>
</ion-item>
</ng-container>
</ion-item-group>

View File

@ -0,0 +1,6 @@
.events-info {
display: flex;
flex-direction: column;
text-align: end;
padding: 10px 0;
}

View File

@ -29,6 +29,7 @@ import { AddonCalendarEvent } from '@addons/calendar/services/calendar';
@Component({
selector: 'addon-block-timeline-events',
templateUrl: 'addon-block-timeline-events.html',
styleUrls: ['events.scss'],
})
export class AddonBlockTimelineEventsComponent implements OnChanges {

View File

@ -103,7 +103,7 @@ export class AddonBlockTimelineProvider {
async getActionEventsByCourses(
courseIds: number[],
siteId?: string,
): Promise<{[courseId: string]: { events: AddonCalendarEvent[]; canLoadMore: number } }> {
): Promise<{[courseId: string]: { events: AddonCalendarEvent[]; canLoadMore?: number } }> {
const site = await CoreSites.getSite(siteId);
const time = moment().subtract(14, 'days').unix(); // Check two weeks ago.
@ -123,17 +123,13 @@ export class AddonBlockTimelineProvider {
preSets,
);
if (events && events.groupedbycourse) {
const courseEvents = {};
const courseEvents: {[courseId: string]: { events: AddonCalendarEvent[]; canLoadMore?: number } } = {};
events.groupedbycourse.forEach((course) => {
courseEvents[course.courseid] = this.treatCourseEvents(course, time);
});
events.groupedbycourse.forEach((course) => {
courseEvents[course.courseid] = this.treatCourseEvents(course, time);
});
return courseEvents;
}
throw new CoreError('No events returned on core_calendar_get_action_events_by_courses.');
return courseEvents;
}
/**

View File

@ -1,25 +1,26 @@
<ion-item button class="ion-text-wrap" (click)="action('download')" *ngIf="downloadCourseEnabled">
<ion-item button class="ion-text-wrap" (click)="action('download')" *ngIf="downloadCourseEnabled" detail="false">
<ion-icon *ngIf="!prefetch.loading" [name]="prefetch.icon" slot="start" aria-hidden="true"></ion-icon>
<ion-spinner *ngIf="prefetch.loading" slot="start"></ion-spinner>
<ion-label><h2>{{ prefetch.statusTranslatable | translate }}</h2></ion-label>
</ion-item>
<ion-item button class="ion-text-wrap" (click)="action('delete')" *ngIf="prefetch.status == 'downloaded' || prefetch.status == 'outdated'">
<ion-item button class="ion-text-wrap" (click)="action('delete')" detail="false"
*ngIf="prefetch.status == 'downloaded' || prefetch.status == 'outdated'">
<ion-icon name="fas-trash" slot="start" aria-hidden="true"></ion-icon>
<ion-label><h2>{{ 'addon.storagemanager.deletecourse' | translate }}</h2></ion-label>
</ion-item>
<ion-item button class="ion-text-wrap" (click)="action('hide')" *ngIf="!course.hidden">
<ion-item button class="ion-text-wrap" (click)="action('hide')" *ngIf="!course.hidden" detail="false">
<ion-icon name="fas-eye" slot="start" aria-hidden="true"></ion-icon>
<ion-label><h2>{{ 'core.courses.hidecourse' | translate }}</h2></ion-label>
</ion-item>
<ion-item button class="ion-text-wrap" (click)="action('show')" *ngIf="course.hidden">
<ion-item button class="ion-text-wrap" (click)="action('show')" *ngIf="course.hidden" detail="false">
<ion-icon name="fas-eye-slash" slot="start" aria-hidden="true"></ion-icon>
<ion-label><h2>{{ 'core.courses.show' | translate }}</h2></ion-label>
</ion-item>
<ion-item button class="ion-text-wrap" (click)="action('favourite')" *ngIf="!course.isfavourite">
<ion-item button class="ion-text-wrap" (click)="action('favourite')" *ngIf="!course.isfavourite" detail="false">
<ion-icon name="fas-star" slot="start" aria-hidden="true"></ion-icon>
<ion-label><h2>{{ 'core.courses.addtofavourites' | translate }}</h2></ion-label>
</ion-item>
<ion-item button class="ion-text-wrap" (click)="action('unfavourite')" *ngIf="course.isfavourite">
<ion-item button class="ion-text-wrap" (click)="action('unfavourite')" *ngIf="course.isfavourite" detail="false">
<ion-icon name="far-star" slot="start" aria-hidden="true"></ion-icon>
<ion-label><h2>{{ 'core.courses.removefromfavourites' | translate }}</h2></ion-label>
</ion-item>

View File

@ -5,7 +5,7 @@
</div>
<ion-item button lines="none" (click)="openCourse()" [attr.aria-label]="course.displayname || course.fullname"
class="core-course-header" [class.item-disabled]="course.visible == 0"
[class.core-course-more-than-title]="course.progress! >= 0">
[class.core-course-more-than-title]="course.progress! >= 0" detail="false">
<ion-label
class="ion-text-wrap core-course-title"
[class.core-course-with-buttons]="courseOptionMenuEnabled || (downloadCourseEnabled && showDownload)"