@pocketprep/ui-kit 3.4.79 → 3.4.81

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.
@@ -470,7 +470,7 @@ export default class MatrixChoicesContainer extends Vue {
470
470
  padding: 0px 1px 0px 14px;
471
471
  align-items: flex-end;
472
472
  width: 100%;
473
- height: 32px;
473
+ height: fit-content;
474
474
  margin-bottom: 16px;
475
475
  color: $brand-black;
476
476
  font-size: 12px;
@@ -547,7 +547,8 @@ export default class MobileMatrixChoicesContainer extends Vue {
547
547
 
548
548
  .uikit-question-mobile-matrix-choices-container {
549
549
  width: 100%;
550
- max-width: 325px;
550
+ max-width: 492px;
551
+
551
552
  &:not(&--mobile) {
552
553
  display: none
553
554
  }
@@ -635,6 +636,8 @@ export default class MobileMatrixChoicesContainer extends Vue {
635
636
 
636
637
  &__row-label-correct-icon {
637
638
  color: $cadaverous;
639
+ width: 18px;
640
+ height: 18px;
638
641
 
639
642
  &--dark {
640
643
  color: $jungle-green;
@@ -663,6 +666,8 @@ export default class MobileMatrixChoicesContainer extends Vue {
663
666
  }
664
667
 
665
668
  &__toggle-row-icon {
669
+ position: absolute;
670
+ margin-top: 8px;
666
671
  margin-left: 8px;
667
672
  color: $brand-blue;
668
673
 
@@ -728,12 +733,13 @@ export default class MobileMatrixChoicesContainer extends Vue {
728
733
  &__checkbox-label {
729
734
  &--distractor {
730
735
  text-decoration: line-through;
736
+ color: $ash;
731
737
  }
732
738
  }
733
739
 
734
740
  &__radio-btns {
735
741
  width: 100%;
736
- max-width: 345px;
742
+ max-width: 492px;
737
743
  }
738
744
  }
739
745
  </style>
@@ -110,7 +110,7 @@ const stripHtmlTags = (string?: string) => {
110
110
  align-items: flex-start;
111
111
  align-self: stretch;
112
112
  padding: 11px 15px 12px 15px;
113
- max-width: 325px;
113
+ max-width: 492px;
114
114
  border: 0.5px solid rgba($pewter, 0.85);
115
115
  border-top: none;
116
116
  }
@@ -131,6 +131,7 @@ const stripHtmlTags = (string?: string) => {
131
131
 
132
132
  &--distractor {
133
133
  text-decoration: line-through;
134
+ color: $ash
134
135
  }
135
136
  }
136
137
  }
@@ -5,6 +5,7 @@
5
5
  ref="uikit-question-summary"
6
6
  class="uikit-question-summary"
7
7
  :class="{
8
+ 'uikit-question-summary--matrix-question': isMatrixQuestion,
8
9
  'uikit-question-summary--matrix-question-review-mode': isMatrixQuestion && reviewMode,
9
10
  }"
10
11
  >
@@ -209,6 +210,10 @@ export default class Summary extends Vue {
209
210
  box-shadow: 0 1px 4px 0 rgba($jet, 0.3);
210
211
  }
211
212
 
213
+ &--matrix-question {
214
+ max-width: 518px;
215
+ }
216
+
212
217
  &--matrix-question-review-mode#{&}--tablet-landscape {
213
218
  display: inline-block;
214
219
  }
@@ -239,6 +244,8 @@ export default class Summary extends Vue {
239
244
  }
240
245
 
241
246
  &__summary-toggle-explanation-icon {
247
+ position: absolute;
248
+ margin-top: 4px;
242
249
  margin-left: 5px;
243
250
  display: none;
244
251
 
@@ -31,6 +31,7 @@
31
31
  'uikit-question__main--show-side': (showExplanation && !showPaywall) || showPassageAndImage,
32
32
  'uikit-question__main--unanswered': showAnswers && !isMCR && isUnanswered && !isCorrect,
33
33
  'uikit-question__main--mcr': isMCR,
34
+ 'uikit-question__main--mcr-review-mode': isMCR && reviewMode,
34
35
  'uikit-question__main--matrix-question-review-mode': isMatrixQuestion && reviewMode,
35
36
  }"
36
37
  >
@@ -1590,6 +1591,16 @@ export default class Question extends Vue {
1590
1591
  width: 100%;
1591
1592
  padding-right: 42px;
1592
1593
  }
1594
+
1595
+ &--matrix-question-review-mode#{&}--mobile {
1596
+ overflow-y: scroll;
1597
+ }
1598
+
1599
+ &--mcr-review-mode#{&}--mobile {
1600
+ overflow-y: scroll;
1601
+ width: 100%;
1602
+ padding-right: 17px;
1603
+ }
1593
1604
  }
1594
1605
 
1595
1606
  &__right-side {
@@ -25,6 +25,7 @@
25
25
  slate03: $slate-03;
26
26
  brandBlack: $brand-black;
27
27
  brandBlue: $brand-blue;
28
+ brandBlueHover: $brand-blue-hover;
28
29
  skyBlue: $sky-blue;
29
30
  peacockGreen: $peacock-green;
30
31
  green: $green;
@@ -23,6 +23,7 @@ $sky-blue: #cfe1ff;
23
23
  $baby-blue: #a7c7ff;
24
24
  $azure-blue: #2e80ff;
25
25
  $brand-blue: #0064ff;
26
+ $brand-blue-hover: #0059E5;
26
27
  $midnight-blue: #043580;
27
28
  $frosted-blueberries: #005AE5;
28
29
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pocketprep/ui-kit",
3
- "version": "3.4.79",
3
+ "version": "3.4.81",
4
4
  "description": "Pocket Prep UI Kit",
5
5
  "author": "pocketprep",
6
6
  "scripts": {