MOBILE-2430 ux: Solve minor ux problems
parent
757882428f
commit
f189c6e815
|
@ -68,6 +68,7 @@ export class AddonModForumDiscussionPage implements OnDestroy {
|
|||
};
|
||||
refreshIcon = 'spinner';
|
||||
syncIcon = 'spinner';
|
||||
discussionStr = '';
|
||||
|
||||
protected cmId: number;
|
||||
protected forumId: number;
|
||||
|
@ -101,6 +102,8 @@ export class AddonModForumDiscussionPage implements OnDestroy {
|
|||
this.isOnline = this.appProvider.isOnline();
|
||||
});
|
||||
this.isSplitViewOn = this.svComponent && this.svComponent.isOn();
|
||||
|
||||
this.discussionStr = translate.instant('addon.mod_forum.discussion');
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -107,7 +107,7 @@
|
|||
</ng-container>
|
||||
|
||||
<ion-item>
|
||||
<button ion-button block (click)="submitQuestion()">{{ question.submitLabel }}</button>
|
||||
<button ion-button block (click)="submitQuestion()" class="button-no-uppercase">{{ question.submitLabel }}</button>
|
||||
</ion-item>
|
||||
</form>
|
||||
</ion-card>
|
||||
|
@ -117,7 +117,7 @@
|
|||
<ion-grid text-wrap *ngIf="pageButtons && pageButtons.length" class="addon-mod_lesson-pagebuttons">
|
||||
<ion-row align-items-center>
|
||||
<ion-col *ngFor="let button of pageButtons" col-12 col-md-6 col-lg-3 col-xl>
|
||||
<a ion-button block outline text-wrap [id]="button.id" (click)="buttonClicked(button.data)">{{ button.content }}</a>
|
||||
<a ion-button block outline text-wrap [id]="button.id" (click)="buttonClicked(button.data)" class="button-no-uppercase">{{ button.content }}</a>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
@ -174,7 +174,7 @@
|
|||
<core-format-text [text]="eolData.displayofgrade.message"></core-format-text>
|
||||
</ion-item>
|
||||
<ion-item text-wrap *ngIf="eolData.reviewlesson">
|
||||
<a ion-button block (click)="reviewLesson(eolData.reviewlesson.pageid)">
|
||||
<a ion-button block (click)="reviewLesson(eolData.reviewlesson.pageid)" class="button-no-uppercase">
|
||||
<core-format-text [text]="'addon.mod_lesson.reviewlesson' | translate"></core-format-text>
|
||||
</a>
|
||||
</ion-item>
|
||||
|
@ -184,7 +184,7 @@
|
|||
<ion-item text-wrap *ngIf="eolData.activitylink && eolData.activitylink.value">
|
||||
<ng-container *ngIf="eolData.activitylink.value.formatted">
|
||||
<!-- Activity link was successfully formatted, render the button. -->
|
||||
<a ion-button block color="light" [href]="eolData.activitylink.value.href" core-link [capture]="true">
|
||||
<a ion-button block color="light" [href]="eolData.activitylink.value.href" core-link [capture]="true" class="button-no-uppercase">
|
||||
<core-format-text [text]="eolData.activitylink.value.label"></core-format-text>
|
||||
</a>
|
||||
</ng-container>
|
||||
|
|
|
@ -12,10 +12,12 @@ page-addon-mod-lesson-player {
|
|||
|
||||
.addon-mod_lesson-pagebuttons .button-block {
|
||||
contain: content;
|
||||
height: auto;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.button-inner {
|
||||
height: auto;
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -39,6 +39,10 @@
|
|||
.core-big { font-size: 115%; }
|
||||
.invisible { visibility: hidden; }
|
||||
|
||||
.button-no-uppercase {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(sm) {
|
||||
.core-center-view .scroll-content {
|
||||
display: flex!important;
|
||||
|
|
|
@ -9,7 +9,7 @@ core-loading {
|
|||
}
|
||||
|
||||
.core-loading-content {
|
||||
display: unset;
|
||||
display: inline;
|
||||
padding-bottom: 1px; /* This makes height be real */
|
||||
}
|
||||
|
||||
|
@ -21,7 +21,7 @@ core-loading {
|
|||
.scroll-content > core-loading,
|
||||
ion-content > .scroll-content > core-loading,
|
||||
.core-loading-center {
|
||||
position: unset !important;
|
||||
position: static !important;
|
||||
}
|
||||
|
||||
.scroll-content > core-loading,
|
||||
|
|
|
@ -18,6 +18,14 @@
|
|||
font-size: 1.6rem;
|
||||
border: 0;
|
||||
|
||||
span {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
word-wrap: break-word;
|
||||
display: block;
|
||||
}
|
||||
|
||||
&[aria-selected=true] {
|
||||
color: $core-top-tabs-color-active !important;
|
||||
border: 0 !important;
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
<!-- Section selector. -->
|
||||
<core-dynamic-component [component]="sectionSelectorComponent" [data]="data">
|
||||
<div text-wrap *ngIf="displaySectionSelector && sections && sections.length" no-padding class="clearfix">
|
||||
<button float-start ion-button (click)="showSectionSelector($event)" clear class="core-button-select">
|
||||
<button float-start ion-button (click)="showSectionSelector($event)" clear class="core-button-select button-no-uppercase">
|
||||
{{selectedSection && (selectedSection.formattedName || selectedSection.name) || 'core.course.sections' | translate }}
|
||||
<ion-icon name="arrow-dropdown" ios="md-arrow-dropdown"></ion-icon>
|
||||
</button>
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
</ion-refresher>
|
||||
|
||||
<core-loading [hideUntil]="coursesLoaded">
|
||||
<ion-searchbar *ngIf="showFilter" [(ngModel)]="filter" (ionInput)="filterChanged($event)" (ionCancel)="filterChanged()" [placeholder]="'core.courses.filtermycourses' | translate">
|
||||
<ion-searchbar #searchbar *ngIf="showFilter" [(ngModel)]="filter" (ionInput)="filterChanged($event)" (ionCancel)="filterChanged()" [placeholder]="'core.courses.filtermycourses' | translate">
|
||||
</ion-searchbar>
|
||||
<ion-grid no-padding>
|
||||
<ion-row no-padding>
|
||||
|
|
|
@ -12,8 +12,8 @@
|
|||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { Component, OnDestroy } from '@angular/core';
|
||||
import { IonicPage, NavController } from 'ionic-angular';
|
||||
import { Component, OnDestroy, ViewChild } from '@angular/core';
|
||||
import { IonicPage, Searchbar, NavController } from 'ionic-angular';
|
||||
import { CoreEventsProvider } from '@providers/events';
|
||||
import { CoreSitesProvider } from '@providers/sites';
|
||||
import { CoreDomUtilsProvider } from '@providers/utils/dom';
|
||||
|
@ -31,6 +31,8 @@ import { CoreCourseOptionsDelegate } from '@core/course/providers/options-delega
|
|||
templateUrl: 'my-courses.html',
|
||||
})
|
||||
export class CoreCoursesMyCoursesPage implements OnDestroy {
|
||||
@ViewChild('searchbar') searchbar: Searchbar;
|
||||
|
||||
courses: any[];
|
||||
filteredCourses: any[];
|
||||
searchEnabled: boolean;
|
||||
|
@ -153,6 +155,11 @@ export class CoreCoursesMyCoursesPage implements OnDestroy {
|
|||
this.filter = '';
|
||||
this.showFilter = !this.showFilter;
|
||||
this.filteredCourses = this.courses;
|
||||
if (this.showFilter) {
|
||||
setTimeout(() => {
|
||||
this.searchbar.setFocus();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -80,7 +80,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- Filter courses. -->
|
||||
<ion-searchbar *ngIf="showFilter" [(ngModel)]="courses.filter" (ionInput)="filterChanged($event)" (ionCancel)="filterChanged()" [placeholder]="'core.courses.filtermycourses' | translate">
|
||||
<ion-searchbar #searchbar *ngIf="showFilter" [(ngModel)]="courses.filter" (ionInput)="filterChanged($event)" (ionCancel)="filterChanged()" [placeholder]="'core.courses.filtermycourses' | translate">
|
||||
</ion-searchbar>
|
||||
<!-- List of courses. -->
|
||||
<div>
|
||||
|
|
|
@ -12,8 +12,8 @@
|
|||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { Component, OnDestroy } from '@angular/core';
|
||||
import { IonicPage, NavController } from 'ionic-angular';
|
||||
import { Component, OnDestroy, ViewChild } from '@angular/core';
|
||||
import { IonicPage, Searchbar, NavController } from 'ionic-angular';
|
||||
import { CoreEventsProvider } from '@providers/events';
|
||||
import { CoreSitesProvider } from '@providers/sites';
|
||||
import { CoreDomUtilsProvider } from '@providers/utils/dom';
|
||||
|
@ -34,6 +34,8 @@ import * as moment from 'moment';
|
|||
templateUrl: 'my-overview.html',
|
||||
})
|
||||
export class CoreCoursesMyOverviewPage implements OnDestroy {
|
||||
@ViewChild('searchbar') searchbar: Searchbar;
|
||||
|
||||
firstSelectedTab: number;
|
||||
siteHomeEnabled: boolean;
|
||||
tabsReady = false;
|
||||
|
@ -245,6 +247,11 @@ export class CoreCoursesMyOverviewPage implements OnDestroy {
|
|||
this.showFilter = !this.showFilter;
|
||||
this.courses.filter = '';
|
||||
this.filteredCourses = this.courses[this.courses.selected];
|
||||
if (this.showFilter) {
|
||||
setTimeout(() => {
|
||||
this.searchbar.setFocus();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
Loading…
Reference in New Issue