@pocketprep/ui-kit 3.4.67 → 3.4.68
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/@pocketprep/ui-kit.js +222 -220
- package/dist/@pocketprep/ui-kit.js.map +1 -1
- package/dist/@pocketprep/ui-kit.umd.cjs +5 -5
- package/dist/@pocketprep/ui-kit.umd.cjs.map +1 -1
- package/dist/style.css +1 -1
- package/lib/components/Quiz/Question/MatrixChoicesContainer.vue +16 -0
- package/lib/components/Quiz/Question/MatrixRadioGroup.vue +6 -0
- package/lib/components/Quiz/Question/MobileMatrixChoicesContainer.vue +0 -2
- package/lib/components/Quiz/Question.vue +13 -14
- package/package.json +1 -1
|
@@ -49,6 +49,8 @@
|
|
|
49
49
|
<div
|
|
50
50
|
class="uikit-question-matrix-choices-container__choices"
|
|
51
51
|
:class="{
|
|
52
|
+
'uikit-question-matrix-choices-container__choices--checkbox':
|
|
53
|
+
question.type === 'Matrix Checkbox',
|
|
52
54
|
'uikit-question-matrix-choices-container__choices--two-columns':
|
|
53
55
|
numberOfMatrixColumnLabels === 2
|
|
54
56
|
}"
|
|
@@ -60,6 +62,8 @@
|
|
|
60
62
|
<div
|
|
61
63
|
class="uikit-question-matrix-choices-container__choice-text"
|
|
62
64
|
:class="{
|
|
65
|
+
'uikit-question-matrix-choices-container__choice-text--checkbox':
|
|
66
|
+
question.type === 'Matrix Checkbox',
|
|
63
67
|
'uikit-question-matrix-choices-container__choice-text--two-columns':
|
|
64
68
|
numberOfMatrixColumnLabels === 2
|
|
65
69
|
}"
|
|
@@ -471,6 +475,10 @@ export default class MatrixChoicesContainer extends Vue {
|
|
|
471
475
|
&--mobile {
|
|
472
476
|
display: none;
|
|
473
477
|
}
|
|
478
|
+
|
|
479
|
+
p {
|
|
480
|
+
margin: 0;
|
|
481
|
+
}
|
|
474
482
|
}
|
|
475
483
|
|
|
476
484
|
&__column-row-header {
|
|
@@ -595,6 +603,10 @@ export default class MatrixChoicesContainer extends Vue {
|
|
|
595
603
|
&--mobile {
|
|
596
604
|
display: none;
|
|
597
605
|
}
|
|
606
|
+
|
|
607
|
+
&--checkbox {
|
|
608
|
+
padding-bottom: 0;
|
|
609
|
+
}
|
|
598
610
|
}
|
|
599
611
|
|
|
600
612
|
&__choice-text {
|
|
@@ -627,6 +639,10 @@ export default class MatrixChoicesContainer extends Vue {
|
|
|
627
639
|
p {
|
|
628
640
|
margin: 0;
|
|
629
641
|
}
|
|
642
|
+
|
|
643
|
+
&--checkbox {
|
|
644
|
+
margin-bottom: 12px;
|
|
645
|
+
}
|
|
630
646
|
}
|
|
631
647
|
|
|
632
648
|
&__mobile-choices {
|
|
@@ -21,6 +21,7 @@ const selectChoice = (choiceKey: string) => {
|
|
|
21
21
|
<ul
|
|
22
22
|
v-if="choices.length"
|
|
23
23
|
class="uikit-matrix-radio-group"
|
|
24
|
+
:class="{'uikit-matrix-radio-group--disabled': showAnswers}"
|
|
24
25
|
v-dark="isDarkMode"
|
|
25
26
|
role="radiogroup"
|
|
26
27
|
>
|
|
@@ -75,6 +76,11 @@ const selectChoice = (choiceKey: string) => {
|
|
|
75
76
|
list-style: none;
|
|
76
77
|
margin: 0;
|
|
77
78
|
padding: 0;
|
|
79
|
+
cursor: pointer;
|
|
80
|
+
|
|
81
|
+
&--disabled {
|
|
82
|
+
cursor: default;
|
|
83
|
+
}
|
|
78
84
|
|
|
79
85
|
&__option {
|
|
80
86
|
display: flex;
|
|
@@ -273,13 +273,8 @@
|
|
|
273
273
|
:isCorrect="isCorrect"
|
|
274
274
|
/>
|
|
275
275
|
</template>
|
|
276
|
-
<template #
|
|
277
|
-
|
|
278
|
-
}" >
|
|
279
|
-
<slot
|
|
280
|
-
name="showNamesTable"
|
|
281
|
-
:choiceKey="choiceKey"
|
|
282
|
-
/>
|
|
276
|
+
<template #explanationBottomExperiment>
|
|
277
|
+
<slot name="explanationBottomExperiment" />
|
|
283
278
|
</template>
|
|
284
279
|
</MatrixChoicesContainer>
|
|
285
280
|
<MobileMatrixChoicesContainer
|
|
@@ -301,12 +296,14 @@
|
|
|
301
296
|
@emitSelectedMatrixChoice="selectMatrixChoice"
|
|
302
297
|
@emitAnsweredMatrixRowIndex="answeredMatrixRowIndex"
|
|
303
298
|
>
|
|
304
|
-
<template
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
299
|
+
<template
|
|
300
|
+
#motivationalMoment="{
|
|
301
|
+
isCorrect,
|
|
302
|
+
choiceKey,
|
|
303
|
+
showAnswers,
|
|
304
|
+
answerKeys,
|
|
305
|
+
}"
|
|
306
|
+
>
|
|
310
307
|
<slot
|
|
311
308
|
name="motivationalMoment"
|
|
312
309
|
:showAnswers="showAnswers"
|
|
@@ -315,8 +312,10 @@
|
|
|
315
312
|
:isCorrect="isCorrect"
|
|
316
313
|
/>
|
|
317
314
|
</template>
|
|
315
|
+
<template #explanationBottomExperiment>
|
|
316
|
+
<slot name="explanationBottomExperiment" />
|
|
317
|
+
</template>
|
|
318
318
|
</MobileMatrixChoicesContainer>
|
|
319
|
-
<slot name="unansweredFlaggedNamesTable" />
|
|
320
319
|
</div>
|
|
321
320
|
<Summary
|
|
322
321
|
v-if="((isMCR && showAnswers) || (isMatrixQuestion && showMatrixAnswers)) && !showPaywall"
|