diff --git a/src/addon/mod/quiz/pages/review/review.scss b/src/addon/mod/quiz/pages/review/review.scss index e6b221d31..47b755a75 100644 --- a/src/addon/mod/quiz/pages/review/review.scss +++ b/src/addon/mod/quiz/pages/review/review.scss @@ -2,7 +2,8 @@ ion-app.app-root page-addon-mod-quiz-review { .item-radio-disabled, .item-checkbox-disabled, .item-select-disabled, - .item-input-disabled { + .item-input-disabled, + .text-input[disabled] { opacity: 0.8; .label, .radio, .checkbox, .select-disabled, .core-correct-icon { diff --git a/src/addon/qtype/shortanswer/component/addon-qtype-shortanswer.html b/src/addon/qtype/shortanswer/component/addon-qtype-shortanswer.html index 6f31a2d39..b73d8d7be 100644 --- a/src/addon/qtype/shortanswer/component/addon-qtype-shortanswer.html +++ b/src/addon/qtype/shortanswer/component/addon-qtype-shortanswer.html @@ -1,8 +1,8 @@
- +

- + {{ 'addon.mod_quiz.answercolon' | translate }} diff --git a/src/addon/qtype/shortanswer/component/shortanswer.scss b/src/addon/qtype/shortanswer/component/shortanswer.scss new file mode 100644 index 000000000..a49c2e2c3 --- /dev/null +++ b/src/addon/qtype/shortanswer/component/shortanswer.scss @@ -0,0 +1,11 @@ +addon-qtype-shortanswer { + .addon-qtype-shortanswer-text input { + display: inline-block; + border: 1px solid #ccc; + padding: 4px 6px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; + margin-bottom: 10px; + } +} diff --git a/src/core/question/classes/base-question-component.ts b/src/core/question/classes/base-question-component.ts index 2e78a2dfe..1a1dfafa0 100644 --- a/src/core/question/classes/base-question-component.ts +++ b/src/core/question/classes/base-question-component.ts @@ -289,7 +289,8 @@ export class CoreQuestionBaseComponent { id: input.id, name: input.name, value: input.value, - readOnly: input.readOnly + readOnly: input.readOnly, + isInline: !!this.domUtils.closest(input, '.qtext') // The answer can be inside the question text. }; // Check if question is marked as correct. @@ -310,6 +311,16 @@ export class CoreQuestionBaseComponent { this.question.input.correctIcon = ''; this.question.input.correctIconColor = ''; } + + if (this.question.input.isInline) { + // Handle correct/incorrect classes and icons. + const content = questionEl.querySelector('.qtext'); + + this.questionHelper.replaceCorrectnessClasses(content); + this.questionHelper.treatCorrectnessIcons(content); + + this.question.text = content.innerHTML; + } } return questionEl;