Merge pull request #4029 from dpalou/MOBILE-4560

Mobile 4560
main
Pau Ferrer Ocaña 2024-04-30 16:19:51 +02:00 committed by GitHub
commit eef40eb6cb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 63 additions and 37 deletions

View File

@ -17,6 +17,7 @@ import { CoreRoutedItemsManagerSource } from '@classes/items-management/routed-i
import { ADDON_COMPETENCY_COMPETENCIES_PAGE } from '../competency.module';
import { AddonCompetency, AddonCompetencyPlan, AddonCompetencyProvider } from '../services/competency';
import { AddonCompetencyHelper } from '../services/competency-helper';
import { CoreIonicColorNames } from '@singletons/colors';
/**
* Provides a collection of learning plans.
@ -73,13 +74,13 @@ export class AddonCompetencyPlansSource extends CoreRoutedItemsManagerSource<Add
plan.statusname = AddonCompetencyHelper.getPlanStatusName(plan.status);
switch (plan.status) {
case AddonCompetencyProvider.STATUS_ACTIVE:
plan.statuscolor = 'success';
plan.statuscolor = CoreIonicColorNames.SUCCESS;
break;
case AddonCompetencyProvider.STATUS_COMPLETE:
plan.statuscolor = 'danger';
plan.statuscolor = CoreIonicColorNames.DANGER;
break;
default:
plan.statuscolor = 'warning';
plan.statuscolor = CoreIonicColorNames.WARNING;
break;
}
});

View File

@ -60,6 +60,7 @@ import { AddonModAssignModuleHandlerService } from '../../services/handlers/modu
import { CanLeave } from '@guards/can-leave';
import { CoreTime } from '@singletons/time';
import { isSafeNumber, SafeNumber } from '@/core/utils/types';
import { CoreIonicColorNames } from '@singletons/colors';
/**
* Component that displays an assignment submission.
@ -815,7 +816,7 @@ export class AddonModAssignSubmissionComponent implements OnInit, OnDestroy, Can
if (this.hasOffline || this.submittedOffline) {
// Offline data.
this.statusTranslated = Translate.instant('core.notsent');
this.statusColor = 'warning';
this.statusColor = CoreIonicColorNames.WARNING;
} else if (!this.assign.teamsubmission) {
// Single submission.

View File

@ -5,10 +5,31 @@
color: var(--core-question-correct-color);
}
.core-question-answer-partiallycorrect {
color: var(--core-question-partial-color);
}
.core-question-answer-incorrect {
color: var(--core-question-incorrect-color);
}
input, select {
&.core-question-answer-correct {
--background: var(--core-question-correct-color-bg);
--contrast-background: var(--background);
}
&.core-question-answer-partiallycorrect {
--background: var(--core-question-partial-color-bg);
--contrast-background: var(--background);
}
&.core-question-answer-incorrect {
--background: var(--core-question-incorrect-color-bg);
--contrast-background: var(--background);
}
}
.core-question-feedback-container ::ng-deep {
--color: var(--core-question-feedback-color);
--background: var(--core-question-feedback-background-color);
@ -45,6 +66,7 @@
.core-question-feedback-inline {
display: inline-block;
@include margin-horizontal(4px, 0px);
}
.core-question-feedback-padding {
@ -60,11 +82,15 @@
color: var(--core-question-correct-color);
}
.core-question-partiallycorrect {
background-color: var(--core-question-state-partial-color);
--background: var(--core-question-partial-color-bg);
background-color: var(--core-question-partial-color-bg);
color: var(--core-question-partial-color);
}
.core-question-notanswered,
.core-question-incorrect {
background-color: var(--core-question-state-incorrect-color);
--background: var(--core-question-incorrect-color-bg);
background-color: var(--core-question-incorrect-color-bg);
color: var(--core-question-incorrect-color);
}
.core-question-answersaved,
.core-question-requiresgrading {

View File

@ -29,6 +29,7 @@ import { CoreQuestionDelegate } from './question-delegate';
import { CoreIcons } from '@singletons/icons';
import { CoreUrlUtils } from '@services/utils/url';
import { ContextLevel } from '@/core/constants';
import { CoreIonicColorNames } from '@singletons/colors';
/**
* Service with some common functions to handle questions.
@ -731,6 +732,7 @@ export class CoreQuestionHelperProvider {
CoreDomUtils.replaceClassesInElement(element, {
correct: 'core-question-answer-correct',
incorrect: 'core-question-answer-incorrect',
partiallycorrect: 'core-question-answer-partiallycorrect',
});
}
@ -799,38 +801,40 @@ export class CoreQuestionHelperProvider {
treatCorrectnessIcons(element: HTMLElement): void {
const icons = <HTMLElement[]> Array.from(element.querySelectorAll('img.icon, img.questioncorrectnessicon, i.icon'));
icons.forEach((icon) => {
let correct = false;
let iconName: string | undefined;
let color: string | undefined;
if ('src' in icon) {
if ((icon as HTMLImageElement).src.indexOf('correct') >= 0) {
correct = true;
} else if ((icon as HTMLImageElement).src.indexOf('incorrect') < 0 ) {
return;
iconName = 'check';
color = CoreIonicColorNames.SUCCESS;
} else if ((icon as HTMLImageElement).src.indexOf('incorrect') >= 0 ) {
iconName = 'xmark';
color = CoreIonicColorNames.DANGER;
}
} else {
const classList = icon.classList.toString();
if (classList.indexOf('fa-check') >= 0) {
correct = true;
} else if (classList.indexOf('fa-xmark') < 0 && classList.indexOf('fa-remove') < 0) {
return;
if (icon.classList.contains('fa-check-square')) {
iconName = 'square-check';
color = CoreIonicColorNames.WARNING;
} else if (icon.classList.contains('fa-check')) {
iconName = 'check';
color = CoreIonicColorNames.SUCCESS;
} else if (icon.classList.contains('fa-xmark') || icon.classList.contains('fa-remove')) {
iconName = 'xmark';
color = CoreIonicColorNames.DANGER;
}
}
if (!iconName) {
return;
}
// Replace the icon with the font version.
const newIcon: HTMLIonIconElement = document.createElement('ion-icon');
if (correct) {
const iconName = 'check';
newIcon.setAttribute('name', `fas-${iconName}`);
newIcon.setAttribute('src', CoreIcons.getIconSrc('font-awesome', 'solid', iconName));
newIcon.className = 'core-correct-icon ion-color ion-color-success questioncorrectnessicon';
} else {
const iconName = 'xmark';
newIcon.setAttribute('name', `fas-${iconName}`);
newIcon.setAttribute('src', CoreIcons.getIconSrc('font-awesome', 'solid', iconName));
newIcon.className = 'core-correct-icon ion-color ion-color-danger questioncorrectnessicon';
}
newIcon.setAttribute('name', `fas-${iconName}`);
newIcon.setAttribute('src', CoreIcons.getIconSrc('font-awesome', 'solid', iconName));
newIcon.className = `core-correct-icon ion-color ion-color-${color} questioncorrectnessicon`;
newIcon.title = icon.title;
newIcon.setAttribute('aria-label', icon.title);
icon.parentNode?.replaceChild(newIcon, icon);

View File

@ -135,16 +135,13 @@ html.dark {
--core-question-correct-color-bg: var(--success-shade);
--core-question-incorrect-color: var(--danger);
--core-question-incorrect-color-bg: var(--danger-shade);
--core-question-partial-color: var(--warning-tint);
--core-question-partial-color-bg: var(--warning-shade);
--core-question-feedback-color: var(--warning-tint);
--core-question-feedback-color-bg: var(--warning-shade);
--core-question-warning-color: var(--danger);
--core-question-saved-color-bg: var(--gray-500);
--core-question-state-correct-color: var(--success-shade);
--core-question-state-partial-color: var(--warning-shade);
--core-question-state-partial-text: var(--warning);
--core-question-state-incorrect-color: var(--danger-shade);
--core-question-feedback-color: var(--warning-tint);
--core-question-feedback-background-color: var(--warning-shade);

View File

@ -171,16 +171,13 @@ html {
--core-question-correct-color-bg: var(--success-tint);
--core-question-incorrect-color: var(--danger);
--core-question-incorrect-color-bg: var(--danger-tint);
--core-question-partial-color: var(--warning-shade);
--core-question-partial-color-bg: var(--warning-tint);
--core-question-feedback-color: var(--warning-shade);
--core-question-feedback-color-bg: var(--warning-tint);
--core-question-warning-color: var(--danger);
--core-question-saved-color-bg: var(--gray-200);
--core-question-state-correct-color: var(--success-tint);
--core-question-state-partial-color: var(--warning-tint);
--core-question-state-partial-text: var(--warning);
--core-question-state-incorrect-color: var(--danger-tint);
--core-question-feedback-color: var(--warning-shade);
--core-question-feedback-background-color: var(--warning-tint);