EVOgeek
/
Vmeda.Online
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-4470 feedback: Fix text wrap on ion-item

main
Pau Ferrer Ocaña 2024-05-10 14:36:23 +02:00
parent 7fc7aa78d6
commit 552a6dcf94
2 changed files with 15 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/addons/mod/feedback/pages/form/form.html
View File

@ -69,7 +69,7 @@
<ion-radio-group *ngIf="item.templateName === 'multichoice-r'" [(ngModel)]="item.value" [required]="item.required" <ion-radio-group *ngIf="item.templateName === 'multichoice-r'" [(ngModel)]="item.value" [required]="item.required"
name="{{item.typ}}_{{item.id}}"> name="{{item.typ}}_{{item.id}}">
<ion-item *ngFor="let option of item.choices" class="ion-text-wrap"> <ion-item *ngFor="let option of item.choices" class="ion-text-wrap" lines="none">
<ion-radio [value]="option.value"> <ion-radio [value]="option.value">
<core-format-text [component]="component" [componentId]="cmId" [text]="option.label" <core-format-text [component]="component" [componentId]="cmId" [text]="option.label"
contextLevel="module" [contextInstanceId]="cmId" [wsNotFiltered]="true" [courseId]="courseId" /> contextLevel="module" [contextInstanceId]="cmId" [wsNotFiltered]="true" [courseId]="courseId" />
@ -80,7 +80,7 @@
<ng-container *ngIf="item.templateName === 'multichoice-c'"> <ng-container *ngIf="item.templateName === 'multichoice-c'">
<ion-item *ngFor="let option of item.choices"> <ion-item *ngFor="let option of item.choices">
<ion-checkbox [required]="item.required" name="{{item.typ}}_{{item.id}}" [(ngModel)]="option.checked" <ion-checkbox [required]="item.required" name="{{item.typ}}_{{item.id}}" [(ngModel)]="option.checked"
value="option.value"> value="option.value" lines="none">
<core-format-text [component]="component" [componentId]="cmId" [text]="option.label" <core-format-text [component]="component" [componentId]="cmId" [text]="option.label"
contextLevel="module" [contextInstanceId]="cmId" [wsNotFiltered]="true" [courseId]="courseId" /> contextLevel="module" [contextInstanceId]="cmId" [wsNotFiltered]="true" [courseId]="courseId" />
</ion-checkbox> </ion-checkbox>
@ -156,7 +156,7 @@
<ng-template #label let-item="item"> <ng-template #label let-item="item">
<p *ngIf="item.name" [core-mark-required]="item.required" [slot]="item.slottedLabel ? 'label' : undefined"> <p class="ion-text-wrap" *ngIf="item.name" [core-mark-required]="item.required" [slot]="item.slottedLabel ? 'label' : undefined">
<span *ngIf="feedback!.autonumbering && item.itemnumber">{{item.itemnumber}}. </span> <span *ngIf="feedback!.autonumbering && item.itemnumber">{{item.itemnumber}}. </span>
<core-format-text [component]="component" [componentId]="cmId" [text]="item.name" contextLevel="module" [contextInstanceId]="cmId" <core-format-text [component]="component" [componentId]="cmId" [text]="item.name" contextLevel="module" [contextInstanceId]="cmId"
[courseId]="courseId" [wsNotFiltered]="true" /> [courseId]="courseId" [wsNotFiltered]="true" />

27
src/theme/components/ion-item.scss
View File

@ -190,10 +190,12 @@ ion-item .in-item {
// Correctly inherit ion-text-wrap onto labels. // Correctly inherit ion-text-wrap onto labels.
.item > ion-label, .item > ion-label,
.fake-ion-item, .fake-ion-item,
.item.ion-text-wrap > ion-checkbox::part(label), .item > ion-checkbox::part(label),
ion-checkbox.ion-text-wrap::part(label) ion-checkbox::part(label),
.item.ion-text-wrap ion-toggle::part(label), .item ion-toggle::part(label),
ion-toggle.ion-text-wrap::part(label) { ion-toggle::part(label),
.item > ion-input > label,
ion-input > label {
core-format-text, core-format-text,
core-format-text > *:not(pre) { core-format-text > *:not(pre) {
white-space: nowrap; white-space: nowrap;
@ -207,7 +209,12 @@ ion-item > .in-item,
.fake-ion-item.ion-text-wrap, .fake-ion-item.ion-text-wrap,
.item.ion-text-wrap > ion-checkbox::part(label), .item.ion-text-wrap > ion-checkbox::part(label),
ion-checkbox.ion-text-wrap::part(label), ion-checkbox.ion-text-wrap::part(label),
ion-toggle.ion-text-wrap::part(label) { ion-toggle.ion-text-wrap::part(label),
.item.ion-text-wrap > ion-input > label,
ion-input.ion-text-wrap > label {
white-space: normal;
overflow: inherit;
core-format-text, core-format-text,
core-format-text > *:not(pre) { core-format-text > *:not(pre) {
white-space: normal; white-space: normal;
@ -215,16 +222,6 @@ ion-toggle.ion-text-wrap::part(label) {
} }
} }
.item.ion-text-wrap > ion-label,
.item.ion-text-wrap ion-checkbox::part(label),
ion-checkbox.ion-text-wrap::part(label),
.item.ion-text-wrap ion-radio::part(label),
ion-radio.ion-text-wrap::part(label),
.item.ion-text-wrap ion-toggle::part(label),
ion-toggle.ion-text-wrap::part(label) {
white-space: normal !important;
}
ion-item .core-input-errors-wrapper { ion-item .core-input-errors-wrapper {
width: 100%; width: 100%;
} }