MOBILE-3648 lesson: Fix styles

main
Pau Ferrer Ocaña 2021-02-05 15:08:21 +01:00 committed by Dani Palou
parent f296d2923c
commit 4203484344
8 changed files with 211 additions and 210 deletions

View File

@ -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

View File

@ -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>

View File

@ -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;
// }
// }
}

View File

@ -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"

View File

@ -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>

View File

@ -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"

View File

@ -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>

View File

@ -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);