MOBILE-3648 lesson: Fix styles
parent
f296d2923c
commit
4203484344
|
@ -176,128 +176,115 @@
|
|||
<!-- General statistics for the current group. -->
|
||||
<ion-card class="addon-mod_lesson-lessonstats" *ngIf="overview">
|
||||
<ion-card-header class="ion-text-wrap">
|
||||
<ion-card-subtitle>{{ 'addon.mod_lesson.lessonstats' | translate }}</ion-card-subtitle>
|
||||
<ion-card-title>{{ 'addon.mod_lesson.lessonstats' | translate }}</ion-card-title>
|
||||
</ion-card-header>
|
||||
|
||||
<!-- In tablet, max 2 rows with 3 columns. -->
|
||||
<div class="ion-hide-md-down">
|
||||
<ion-grid class="ion-text-wrap" *ngIf="overview.lessonscored">
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.averagescore' | translate }}</p>
|
||||
<p *ngIf="overview.numofattempts > 0">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.avescore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.numofattempts <= 0">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
<ion-grid class="ion-text-wrap ion-hide-md-down">
|
||||
<ion-row *ngIf="overview.lessonscored">
|
||||
<ion-col class="ion-text-center">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.averagescore' | translate }}</h3>
|
||||
<p *ngIf="overview.numofattempts > 0">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.avescore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.numofattempts <= 0">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-col class="ion-text-center">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.highscore' | translate }}</p>
|
||||
<p *ngIf="overview.highscore != null">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.highscore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.highscore == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
<ion-col class="ion-text-center">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.highscore' | translate }}</h3>
|
||||
<p *ngIf="overview.highscore != null">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.highscore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.highscore == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-col class="ion-text-center">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.lowscore' | translate }}</p>
|
||||
<p *ngIf="overview.lowscore != null">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.lowscore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.lowscore == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
<ion-col class="ion-text-center">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.lowscore' | translate }}</h3>
|
||||
<p *ngIf="overview.lowscore != null">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.lowscore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.lowscore == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.averagetime' | translate }}</h3>
|
||||
<p *ngIf="overview.avetime != null && overview.numofattempts">{{ avetimeReadable }}</p>
|
||||
<p *ngIf="overview.avetime == null || !overview.numofattempts">
|
||||
{{ 'addon.mod_lesson.notcompleted' | translate }}
|
||||
</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-grid class="ion-text-wrap">
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.averagetime' | translate }}</p>
|
||||
<p *ngIf="overview.avetime != null && overview.numofattempts">{{ avetimeReadable }}</p>
|
||||
<p *ngIf="overview.avetime == null || !overview.numofattempts">
|
||||
{{ 'addon.mod_lesson.notcompleted' | translate }}
|
||||
</p>
|
||||
</ion-col>
|
||||
<ion-col class="ion-text-center">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.hightime' | translate }}</h3>
|
||||
<p *ngIf="overview.hightime != null">{{ hightimeReadable }}</p>
|
||||
<p *ngIf="overview.hightime == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-col class="ion-text-center">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.hightime' | translate }}</p>
|
||||
<p *ngIf="overview.hightime != null">{{ hightimeReadable }}</p>
|
||||
<p *ngIf="overview.hightime == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-col class="ion-text-center">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.lowtime' | translate }}</p>
|
||||
<p *ngIf="overview.lowtime != null">{{ lowtimeReadable }}</p>
|
||||
<p *ngIf="overview.lowtime == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</div>
|
||||
<ion-col class="ion-text-center">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.lowtime' | translate }}</h3>
|
||||
<p *ngIf="overview.lowtime != null">{{ lowtimeReadable }}</p>
|
||||
<p *ngIf="overview.lowtime == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
<!-- In phone, 3 rows with 1 or 2 columns. -->
|
||||
<div class="ion-hide-md-up">
|
||||
<ion-grid class="ion-text-wrap">
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center" *ngIf="overview.lessonscored">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.averagescore' | translate }}</p>
|
||||
<p *ngIf="overview.numofattempts > 0">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.avescore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.numofattempts <= 0">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
<ion-grid class="ion-text-wrap ion-hide-md-up">
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center" *ngIf="overview.lessonscored">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.averagescore' | translate }}</h3>
|
||||
<p *ngIf="overview.numofattempts > 0">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.avescore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.numofattempts <= 0">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-col [ngClass]="{'ion-text-center': overview.lessonscored}">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.averagetime' | translate }}</p>
|
||||
<p *ngIf="overview.avetime != null && overview.numofattempts">{{ avetimeReadable }}</p>
|
||||
<p *ngIf="overview.avetime == null || !overview.numofattempts">
|
||||
{{ 'addon.mod_lesson.notcompleted' | translate }}
|
||||
</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
<ion-col [ngClass]="{'ion-text-center': overview.lessonscored}">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.averagetime' | translate }}</h3>
|
||||
<p *ngIf="overview.avetime != null && overview.numofattempts">{{ avetimeReadable }}</p>
|
||||
<p *ngIf="overview.avetime == null || !overview.numofattempts">
|
||||
{{ 'addon.mod_lesson.notcompleted' | translate }}
|
||||
</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center" *ngIf="overview.lessonscored">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.highscore' | translate }}</h3>
|
||||
<p *ngIf="overview.highscore != null">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.highscore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.highscore == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-grid class="ion-text-wrap">
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center" *ngIf="overview.lessonscored">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.highscore' | translate }}</p>
|
||||
<p *ngIf="overview.highscore != null">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.highscore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.highscore == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
<ion-col [ngClass]="{'ion-text-center': overview.lessonscored}">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.hightime' | translate }}</h3>
|
||||
<p *ngIf="overview.hightime != null">{{ hightimeReadable }}</p>
|
||||
<p *ngIf="overview.hightime == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center" *ngIf="overview.lessonscored">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.lowscore' | translate }}</h3>
|
||||
<p *ngIf="overview.lowscore != null">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.lowscore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.lowscore == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-col [ngClass]="{'ion-text-center': overview.lessonscored}">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.hightime' | translate }}</p>
|
||||
<p *ngIf="overview.hightime != null">{{ hightimeReadable }}</p>
|
||||
<p *ngIf="overview.hightime == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
<ion-grid class="ion-text-wrap">
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center" *ngIf="overview.lessonscored">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.lowscore' | translate }}</p>
|
||||
<p *ngIf="overview.lowscore != null">
|
||||
{{ 'core.percentagenumber' | translate:{$a: overview.lowscore} }}
|
||||
</p>
|
||||
<p *ngIf="overview.lowscore == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-col [ngClass]="{'ion-text-center': overview.lessonscored}">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.lowtime' | translate }}</p>
|
||||
<p *ngIf="overview.lowtime != null">{{ lowtimeReadable }}</p>
|
||||
<p *ngIf="overview.lowtime == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</div>
|
||||
<ion-col [ngClass]="{'ion-text-center': overview.lessonscored}">
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.lowtime' | translate }}</h3>
|
||||
<p *ngIf="overview.lowtime != null">{{ lowtimeReadable }}</p>
|
||||
<p *ngIf="overview.lowtime == null">{{ 'addon.mod_lesson.notcompleted' | translate }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-card>
|
||||
|
||||
<!-- List of students that have retakes. -->
|
||||
<ion-card *ngIf="overview">
|
||||
<ion-card-header class="ion-text-wrap">
|
||||
<ion-card-subtitle>{{ 'addon.mod_lesson.overview' | translate }}</ion-card-subtitle>
|
||||
<ion-card-title>{{ 'addon.mod_lesson.overview' | translate }}</ion-card-title>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-item class="ion-text-wrap" *ngFor="let student of overview.students" button
|
||||
|
|
|
@ -83,13 +83,15 @@
|
|||
</core-rich-text-editor>
|
||||
</ion-item>
|
||||
<ion-item class="ion-text-wrap" *ngIf="!question.textarea && question.useranswer">
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.youranswer' | translate }}</p>
|
||||
<p>
|
||||
<core-format-text [component]="component" [componentId]="lesson?.coursemodule"
|
||||
[text]="question.useranswer" contextLevel="module"
|
||||
[contextInstanceId]="lesson?.coursemodule" [courseId]="courseId">
|
||||
</core-format-text>
|
||||
</p>
|
||||
<ion-label>
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.youranswer' | translate }}</h3>
|
||||
<p>
|
||||
<core-format-text [component]="component" [componentId]="lesson?.coursemodule"
|
||||
[text]="question.useranswer" contextLevel="module"
|
||||
[contextInstanceId]="lesson?.coursemodule" [courseId]="courseId">
|
||||
</core-format-text>
|
||||
</p>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
</ng-container>
|
||||
|
||||
|
@ -126,24 +128,18 @@
|
|||
<!-- Matching. -->
|
||||
<ng-container *ngSwitchCase="'matching'">
|
||||
<ion-item class="ion-text-wrap" *ngFor="let row of question.rows">
|
||||
<ion-grid>
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<p><core-format-text id="addon-mod_lesson-matching-{{row.id}}" [component]="component"
|
||||
[componentId]="lesson?.coursemodule" [text]="row.text" contextLevel="module"
|
||||
[contextInstanceId]="lesson?.coursemodule" [courseId]="courseId">
|
||||
</core-format-text></p>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<ion-select [id]="row.id" [formControlName]="row.name" interface="action-sheet"
|
||||
[attr.aria-labelledby]="'addon-mod_lesson-matching-' + row.id">
|
||||
<ion-select-option *ngFor="let option of row.options" [value]="option.value">
|
||||
{{option.label}}
|
||||
</ion-select-option>
|
||||
</ion-select>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
<ion-label>
|
||||
<p><core-format-text id="addon-mod_lesson-matching-{{row.id}}" [component]="component"
|
||||
[componentId]="lesson?.coursemodule" [text]="row.text" contextLevel="module"
|
||||
[contextInstanceId]="lesson?.coursemodule" [courseId]="courseId">
|
||||
</core-format-text></p>
|
||||
</ion-label>
|
||||
<ion-select [id]="row.id" [formControlName]="row.name" interface="action-sheet"
|
||||
[attr.aria-labelledby]="'addon-mod_lesson-matching-' + row.id">
|
||||
<ion-select-option *ngFor="let option of row.options" [value]="option.value">
|
||||
{{option.label}}
|
||||
</ion-select-option>
|
||||
</ion-select>
|
||||
</ion-item>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
|
@ -192,7 +188,7 @@
|
|||
</div>
|
||||
|
||||
<ion-card-header class="ion-text-wrap" *ngIf="eolData.gradelesson">
|
||||
<ion-card-subtitle>{{ 'addon.mod_lesson.congratulations' | translate }}</ion-card-subtitle>
|
||||
<ion-card-title>{{ 'addon.mod_lesson.congratulations' | translate }}</ion-card-title>
|
||||
</ion-card-header>
|
||||
<ion-item class="ion-text-wrap" *ngIf="eolData.notenoughtimespent" lines="none">
|
||||
<ion-label>{{ eolData.notenoughtimespent.message }}</ion-label>
|
||||
|
|
|
@ -1,3 +1,11 @@
|
|||
:host {
|
||||
--background-odd: var(--gray-lighter);
|
||||
}
|
||||
|
||||
:host-context(body.dark) {
|
||||
--background-odd: var(--gray-darker);
|
||||
}
|
||||
|
||||
:host ::ng-deep {
|
||||
.addon-mod_lesson-slideshow {
|
||||
max-width: 100%;
|
||||
|
@ -5,15 +13,16 @@
|
|||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.studentanswer {
|
||||
padding-inline-start: 8px;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
margin-top: 1.5rem;
|
||||
|
||||
tr:nth-child(odd) {
|
||||
background-color: var(--gray-lighter);
|
||||
// @include darkmode() {
|
||||
// background-color: $core-dark-item-divider-bg-color;
|
||||
// }
|
||||
background-color: var(--background-odd);
|
||||
}
|
||||
|
||||
tr:last-child td {
|
||||
|
@ -26,21 +35,4 @@
|
|||
border-bottom: 1px solid var(--gray);
|
||||
}
|
||||
}
|
||||
|
||||
// @todo
|
||||
// .item-ios table {
|
||||
// @extend .card-ios;
|
||||
// @include darkmode() {
|
||||
// color: $white;
|
||||
// background-color: $core-dark-item-bg-color;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .item-md table {
|
||||
// @extend .card-md;
|
||||
// @include darkmode() {
|
||||
// color: $white;
|
||||
// background-color: $core-dark-item-bg-color;
|
||||
// }
|
||||
// }
|
||||
}
|
||||
|
|
|
@ -36,28 +36,32 @@
|
|||
|
||||
<!-- Retake stats. -->
|
||||
<ion-list *ngIf="retake && retake.userstats && retake.userstats.gradeinfo" class="addon-mod_lesson-userstats">
|
||||
<ion-grid class="ion-text-wrap">
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.grade' | translate }}</p>
|
||||
<p>{{ 'core.percentagenumber' | translate:{$a: retake.userstats.grade} }}</p>
|
||||
</ion-col>
|
||||
<ion-item>
|
||||
<ion-label class="ion-text-wrap">
|
||||
<ion-grid class="ion-no-padding">
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.grade' | translate }}</h3>
|
||||
<p>{{ 'core.percentagenumber' | translate:{$a: retake.userstats.grade} }}</p>
|
||||
</ion-col>
|
||||
|
||||
<ion-col>
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.rawgrade' | translate }}</p>
|
||||
<p>{{ retake.userstats.gradeinfo.earned }} / {{ retake.userstats.gradeinfo.total }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
<ion-col>
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.rawgrade' | translate }}</h3>
|
||||
<p>{{ retake.userstats.gradeinfo.earned }} / {{ retake.userstats.gradeinfo.total }}</p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
<ion-item class="ion-text-wrap">
|
||||
<ion-label>
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.timetaken' | translate }}</p>
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.timetaken' | translate }}</h3>
|
||||
<p>{{ timeTakenReadable }}</p>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
<ion-item class="ion-text-wrap">
|
||||
<ion-label>
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.completed' | translate }}</p>
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.completed' | translate }}</h3>
|
||||
<p>{{ retake.userstats.completed * 1000 | coreFormatDate }}</p>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
|
@ -74,11 +78,11 @@
|
|||
<ion-card *ngFor="let page of retake.answerpages" class="addon-mod_lesson-answerpage"
|
||||
[ngClass]="{'text-dimmed': page.grayout}">
|
||||
<ion-card-header class="ion-text-wrap">
|
||||
<ion-card-subtitle>{{page.qtype}}: {{page.title}}</ion-card-subtitle>
|
||||
<ion-card-title>{{page.qtype}}: {{page.title}}</ion-card-title>
|
||||
</ion-card-header>
|
||||
<ion-item class="ion-text-wrap" lines="none">
|
||||
<ion-label>
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.question' | translate }}</p>
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.question' | translate }}</h3>
|
||||
<p>
|
||||
<core-format-text [component]="component" [componentId]="lesson?.coursemodule" [maxHeight]="50"
|
||||
[text]="page.contents" contextLevel="module" [contextInstanceId]="lesson?.coursemodule"
|
||||
|
@ -89,7 +93,7 @@
|
|||
</ion-item>
|
||||
<ion-item class="ion-text-wrap" lines="none">
|
||||
<ion-label>
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.answer' | translate }}</p>
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.answer' | translate }}</h3>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
<ion-item class="ion-text-wrap" lines="none"
|
||||
|
@ -100,20 +104,24 @@
|
|||
</ion-item>
|
||||
<div *ngIf="page.answerdata && page.answerdata.answers && page.answerdata.answers.length"
|
||||
class="addon-mod_lesson-answer">
|
||||
<div *ngFor="let answer of page.answerdata.answers">
|
||||
<ion-grid class="ion-text-wrap" *ngIf="page.isContent">
|
||||
<!-- Content page, display a button and the content. -->
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<ion-button expand="block" class="ion-text-wrap" color="light" [disabled]="true">{{ answer[0].buttonText }}</ion-button>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<p [innerHTML]="answer[0].content"></p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
<ng-container *ngFor="let answer of page.answerdata.answers">
|
||||
<ion-item lines="none" *ngIf="page.isContent">
|
||||
<ion-label class="ion-text-wrap">
|
||||
<ion-grid class="ion-no-padding">
|
||||
<!-- Content page, display a button and the content. -->
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<ion-button expand="block" class="ion-text-wrap" color="light" [disabled]="true">{{ answer[0].buttonText }}</ion-button>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<p [innerHTML]="answer[0].content"></p>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<div *ngIf="page.isQuestion">
|
||||
<ng-container *ngIf="page.isQuestion">
|
||||
<!-- Question page, show the right input for the answer. -->
|
||||
|
||||
<!-- Truefalse or matching. -->
|
||||
|
@ -152,27 +160,31 @@
|
|||
</ion-item>
|
||||
|
||||
<!-- Matching. -->
|
||||
<ion-grid class="ion-text-wrap" *ngIf="answer[0].isSelect">
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<p>
|
||||
<core-format-text [component]="component" [componentId]="lesson?.coursemodule"
|
||||
[text]=" answer[0].content" contextLevel="module"
|
||||
[contextInstanceId]="lesson?.coursemodule" [courseId]="courseId">
|
||||
</core-format-text>
|
||||
</p>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<p>{{answer[0].value}}</p>
|
||||
<ion-badge *ngIf="answer[1]" color="dark">
|
||||
<core-format-text [component]="component" [componentId]="lesson?.coursemodule"
|
||||
[text]="answer[1]" contextLevel="module"
|
||||
[contextInstanceId]="lesson?.coursemodule" [courseId]="courseId">
|
||||
</core-format-text>
|
||||
</ion-badge>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
<ion-item lines="none" *ngIf="answer[0].isSelect">
|
||||
<ion-label class="ion-text-wrap">
|
||||
<ion-grid class="ion-no-padding">
|
||||
<ion-row>
|
||||
<ion-col>
|
||||
<p>
|
||||
<core-format-text [component]="component" [componentId]="lesson?.coursemodule"
|
||||
[text]=" answer[0].content" contextLevel="module"
|
||||
[contextInstanceId]="lesson?.coursemodule" [courseId]="courseId">
|
||||
</core-format-text>
|
||||
</p>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<p>{{answer[0].value}}</p>
|
||||
<ion-badge *ngIf="answer[1]" color="dark">
|
||||
<core-format-text [component]="component" [componentId]="lesson?.coursemodule"
|
||||
[text]="answer[1]" contextLevel="module"
|
||||
[contextInstanceId]="lesson?.coursemodule" [courseId]="courseId">
|
||||
</core-format-text>
|
||||
</ion-badge>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
|
||||
<!-- Essay or couldn't determine. -->
|
||||
<ion-item class="ion-text-wrap" lines="none"
|
||||
|
@ -192,7 +204,7 @@
|
|||
</ion-badge>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
<ion-item class="ion-text-wrap" *ngIf="!page.isContent && !page.isQuestion" lines="none">
|
||||
<!-- Another page (end of branch, ...). -->
|
||||
|
@ -211,11 +223,11 @@
|
|||
</ion-badge>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
<ion-item class="ion-text-wrap" *ngIf="page.answerdata.response" lines="none">
|
||||
<ion-label>
|
||||
<p class="item-heading">{{ 'addon.mod_lesson.response' | translate }}</p>
|
||||
<h3 class="item-heading">{{ 'addon.mod_lesson.response' | translate }}</h3>
|
||||
<p>
|
||||
<core-format-text [component]="component" [componentId]="lesson?.coursemodule"
|
||||
[text]="page.answerdata.response" contextLevel="module"
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<ion-list>
|
||||
<ion-item class="ion-text-wrap">
|
||||
<ion-label>
|
||||
<p class="item-heading">{{ 'core.contentlinks.chooseaccounttoopenlink' | translate }}</p>
|
||||
<h3 class="item-heading">{{ 'core.contentlinks.chooseaccounttoopenlink' | translate }}</h3>
|
||||
<p>{{ url }}</p>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
|
|
|
@ -95,7 +95,7 @@
|
|||
|
||||
<ion-buttons class="ion-padding core-course-section-nav-buttons safe-padding-horizontal"
|
||||
*ngIf="displaySectionSelector && sections?.length">
|
||||
<ion-button *ngIf="previousSection" color="medium" (click)="sectionChanged(previousSection)"
|
||||
<ion-button *ngIf="previousSection" color="light" (click)="sectionChanged(previousSection)"
|
||||
title="{{ 'core.previous' | translate }}">
|
||||
<ion-icon name="fas-chevron-left" slot="icon-only"></ion-icon>
|
||||
<core-format-text class="accesshide" [text]="previousSection.name" contextLevel="course"
|
||||
|
|
|
@ -67,7 +67,7 @@
|
|||
|
||||
<ion-item class="ion-text-wrap">
|
||||
<ion-label>
|
||||
<p class="item-heading">{{ 'core.whyisthisrequired' | translate }}</p>
|
||||
<h3 class="item-heading">{{ 'core.whyisthisrequired' | translate }}</h3>
|
||||
<p>{{ 'core.explanationdigitalminor' | translate }}</p>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
|
@ -225,7 +225,7 @@
|
|||
</ion-item-divider>
|
||||
<ion-item class="ion-text-wrap" lines="none">
|
||||
<ion-label>
|
||||
<p class="item-heading">{{ 'core.considereddigitalminor' | translate }}</p>
|
||||
<h3 class="item-heading">{{ 'core.considereddigitalminor' | translate }}</h3>
|
||||
<p>{{ 'core.digitalminor_desc' | translate }}</p>
|
||||
<p *ngIf="supportName">{{ supportName }}</p>
|
||||
<p *ngIf="supportEmail">{{ supportEmail }}</p>
|
||||
|
|
|
@ -33,6 +33,16 @@ ion-item.ion-text-wrap ion-label {
|
|||
white-space: normal !important;
|
||||
}
|
||||
|
||||
// It fixes the click on links where ion-ripple-effect is present.
|
||||
.ion-activatable ion-label,
|
||||
.item-multiple-items ion-label {
|
||||
z-index: 3;
|
||||
pointer-events: none;
|
||||
ion-anchor, ion-button, a, button {
|
||||
pointer-events: visible;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Ionic toolbar.
|
||||
ion-toolbar ion-back-button,
|
||||
|
@ -372,6 +382,10 @@ ion-toolbar ion-title .core-bar-button-image img {
|
|||
}
|
||||
|
||||
// Select.
|
||||
ion-select::part(text) {
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
ion-select.core-button-select,
|
||||
.core-button-select {
|
||||
--background: var(--core-button-select-background);
|
||||
|
|
Loading…
Reference in New Issue