@bdelab/roar-levante-tasks 0.2.0 → 1.0.3
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/README.md +1 -1
- package/lib/index.c92b94e1.js +17 -0
- package/lib/index.c92b94e1.js.map +1 -0
- package/lib/resources/core-tasks.css +289 -47
- package/package.json +16 -10
- package/lib/index.4659cf64.js +0 -17
- package/lib/index.4659cf64.js.map +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
button.button-base, button.image-medium, button.image-large, button.image, button.slider, button.secondary--wide, button.secondary--green, button.secondary, button.primary {
|
|
1
|
+
button.button-base, button.image-medium, button.image-large, button.image-matrix, button.image, button.slider, button.secondary--wide, button.secondary--green, button.secondary, button.primary {
|
|
2
2
|
border-radius: min(32px, 4vh);
|
|
3
3
|
border-width: min(6px, 0.8vh);
|
|
4
4
|
border-style: solid;
|
|
@@ -44,6 +44,16 @@ button.primary:disabled {
|
|
|
44
44
|
box-shadow: -6px -8px 0px 0px #979797 inset;
|
|
45
45
|
cursor: no-drop;
|
|
46
46
|
}
|
|
47
|
+
button.primary.small {
|
|
48
|
+
font-size: 16px;
|
|
49
|
+
font-weight: 500;
|
|
50
|
+
color: #fbfbfd;
|
|
51
|
+
padding: min(8px, 1.1vh) min(48px, 6.5vh);
|
|
52
|
+
border-radius: min(24px, 3vh);
|
|
53
|
+
display: flex;
|
|
54
|
+
align-items: center;
|
|
55
|
+
justify-content: center;
|
|
56
|
+
}
|
|
47
57
|
button.secondary {
|
|
48
58
|
background: #275bdd;
|
|
49
59
|
border-color: #0f3cac;
|
|
@@ -51,6 +61,9 @@ button.secondary {
|
|
|
51
61
|
font-size: 56px;
|
|
52
62
|
width: 160px;
|
|
53
63
|
height: 160px;
|
|
64
|
+
display: flex;
|
|
65
|
+
align-items: center;
|
|
66
|
+
justify-content: center;
|
|
54
67
|
}
|
|
55
68
|
@media (max-width: 650px) {
|
|
56
69
|
button.secondary {
|
|
@@ -85,6 +98,7 @@ button.secondary--green {
|
|
|
85
98
|
padding: min(48px, 6.5vh) min(48px, 6.5vh);
|
|
86
99
|
border-color: #5ba300;
|
|
87
100
|
box-shadow: -8px -10px 0px 0px #5ba300 inset, 0px 0px 12px 0px #cfebb6 inset;
|
|
101
|
+
cursor: default;
|
|
88
102
|
}
|
|
89
103
|
@keyframes pulse {
|
|
90
104
|
0% {
|
|
@@ -108,16 +122,6 @@ button.secondary--green {
|
|
|
108
122
|
min-height: 40px;
|
|
109
123
|
}
|
|
110
124
|
}
|
|
111
|
-
button.secondary--green:hover {
|
|
112
|
-
background: #7ab800;
|
|
113
|
-
border-color: #4d8a00;
|
|
114
|
-
box-shadow: -8px -10px 0px 0px #4d8a00 inset, 0px 0px 12px 0px #cfebb6 inset;
|
|
115
|
-
}
|
|
116
|
-
button.secondary--green:active {
|
|
117
|
-
background: #70a800;
|
|
118
|
-
border-color: #539400;
|
|
119
|
-
box-shadow: -8px -10px 0px 0px #539400 inset, 0px 0px 12px 0px #cfebb6 inset;
|
|
120
|
-
}
|
|
121
125
|
button.secondary--wide {
|
|
122
126
|
background: #275bdd;
|
|
123
127
|
padding: min(20px, 2.5vh) min(72px, 10vh);
|
|
@@ -146,6 +150,25 @@ button.secondary--wide:active {
|
|
|
146
150
|
border-color: #0b2e83;
|
|
147
151
|
box-shadow: -8px -10px 0px 0px #0b2e83 inset, 0px 0px 12px 0px #d4def8 inset;
|
|
148
152
|
}
|
|
153
|
+
button.secondary--wide:disabled {
|
|
154
|
+
filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
|
|
155
|
+
/* Firefox 10+, Firefox on Android */
|
|
156
|
+
filter: grayscale(100%);
|
|
157
|
+
-moz-filter: grayscale(100%);
|
|
158
|
+
-ms-filter: grayscale(100%);
|
|
159
|
+
-o-filter: grayscale(100%);
|
|
160
|
+
filter: gray;
|
|
161
|
+
/* IE6-9 */
|
|
162
|
+
-webkit-filter: grayscale(100%);
|
|
163
|
+
/* Chrome 19+, Safari 6+, Safari 6+ iOS */
|
|
164
|
+
opacity: 0.6;
|
|
165
|
+
cursor: not-allowed;
|
|
166
|
+
}
|
|
167
|
+
button.secondary--wide:disabled:active {
|
|
168
|
+
background: #275bdd;
|
|
169
|
+
border-color: #0f3cac;
|
|
170
|
+
box-shadow: -6px -8px 0px 0px rgba(15, 60, 172, 0.5) inset;
|
|
171
|
+
}
|
|
149
172
|
button.slider {
|
|
150
173
|
background: #275bdd;
|
|
151
174
|
border-color: #0f3cac;
|
|
@@ -154,10 +177,7 @@ button.slider {
|
|
|
154
177
|
width: 16px;
|
|
155
178
|
height: 16x;
|
|
156
179
|
}
|
|
157
|
-
button.
|
|
158
|
-
position: absolute;
|
|
159
|
-
top: min(8px, 1vh);
|
|
160
|
-
right: min(8px, 1vh);
|
|
180
|
+
button.utility {
|
|
161
181
|
cursor: pointer;
|
|
162
182
|
border-radius: min(16px, 2vh);
|
|
163
183
|
padding: min(16px, 2vh);
|
|
@@ -170,32 +190,43 @@ button.replay {
|
|
|
170
190
|
border: 2px solid #0f3cac;
|
|
171
191
|
}
|
|
172
192
|
@media (max-width: 500px) {
|
|
173
|
-
button.
|
|
174
|
-
width:
|
|
175
|
-
height:
|
|
176
|
-
padding:
|
|
193
|
+
button.utility {
|
|
194
|
+
width: 36px;
|
|
195
|
+
height: 36px;
|
|
196
|
+
padding: 9px;
|
|
177
197
|
}
|
|
178
198
|
}
|
|
179
|
-
button.
|
|
199
|
+
button.utility:hover {
|
|
180
200
|
background-color: rgba(32, 81, 203, 0.4);
|
|
181
201
|
border: 2px solid #0d3496;
|
|
182
202
|
}
|
|
183
|
-
button.
|
|
203
|
+
button.utility:active {
|
|
184
204
|
background-color: rgba(29, 74, 185, 0.6);
|
|
185
205
|
border: 2px solid #0b2e83;
|
|
186
206
|
}
|
|
187
|
-
button.
|
|
207
|
+
button.utility:disabled {
|
|
188
208
|
background-color: rgba(255, 255, 255, 0.6);
|
|
189
209
|
border: 2px solid #bdbdbd;
|
|
190
210
|
pointer-events: none;
|
|
191
211
|
}
|
|
192
|
-
button.
|
|
212
|
+
button.utility:disabled svg path {
|
|
193
213
|
fill: #bdbdbd;
|
|
194
214
|
}
|
|
215
|
+
button.utility.open {
|
|
216
|
+
background-color: rgba(29, 74, 185, 0.6);
|
|
217
|
+
border: 2px solid #0b2e83;
|
|
218
|
+
}
|
|
219
|
+
button.utility.transparent {
|
|
220
|
+
background-color: transparent;
|
|
221
|
+
border: transparent;
|
|
222
|
+
width: calc(min(64px, 8vh) / 2);
|
|
223
|
+
height: calc(min(64px, 8vh) / 2);
|
|
224
|
+
padding: 0;
|
|
225
|
+
}
|
|
195
226
|
button.image {
|
|
196
227
|
padding: 0;
|
|
197
228
|
box-sizing: border-box;
|
|
198
|
-
border-color: #
|
|
229
|
+
border-color: #bdbdbd;
|
|
199
230
|
min-width: unset !important;
|
|
200
231
|
min-height: unset !important;
|
|
201
232
|
}
|
|
@@ -234,15 +265,62 @@ button.image:hover {
|
|
|
234
265
|
button.image:active {
|
|
235
266
|
border-color: #0b2e83;
|
|
236
267
|
}
|
|
268
|
+
button.image-matrix {
|
|
269
|
+
padding: 0;
|
|
270
|
+
box-sizing: border-box;
|
|
271
|
+
border-color: #bdbdbd;
|
|
272
|
+
min-width: unset !important;
|
|
273
|
+
min-height: unset !important;
|
|
274
|
+
background-color: #ffffff;
|
|
275
|
+
}
|
|
276
|
+
button.image-matrix img {
|
|
277
|
+
border: none;
|
|
278
|
+
width: min(clamp(120px, 10vw, 150px), 15vh);
|
|
279
|
+
height: min(clamp(120px, 10vw, 150px), 15vh);
|
|
280
|
+
padding: 1vh;
|
|
281
|
+
margin: 0;
|
|
282
|
+
float: left;
|
|
283
|
+
}
|
|
284
|
+
@media (max-width: 650px) {
|
|
285
|
+
button.image-matrix img {
|
|
286
|
+
width: min(clamp(100px, 18vw, 150px), 15vh);
|
|
287
|
+
height: min(clamp(100px, 18vw, 150px), 15vh);
|
|
288
|
+
padding: 1vh;
|
|
289
|
+
}
|
|
290
|
+
}
|
|
291
|
+
@media (max-width: 500px) {
|
|
292
|
+
button.image-matrix img {
|
|
293
|
+
width: 22vw;
|
|
294
|
+
height: 22vw;
|
|
295
|
+
padding: 1vh;
|
|
296
|
+
}
|
|
297
|
+
}
|
|
298
|
+
button.image-matrix:hover {
|
|
299
|
+
border-color: #0f3cac;
|
|
300
|
+
}
|
|
301
|
+
button.image-matrix:active {
|
|
302
|
+
border-color: #0b2e83;
|
|
303
|
+
}
|
|
304
|
+
button.image-grayed-out {
|
|
305
|
+
filter: grayscale(100%);
|
|
306
|
+
-moz-filter: grayscale(100%);
|
|
307
|
+
-ms-filter: grayscale(100%);
|
|
308
|
+
-o-filter: grayscale(100%);
|
|
309
|
+
filter: gray;
|
|
310
|
+
/* IE6-9 */
|
|
311
|
+
-webkit-filter: grayscale(100%);
|
|
312
|
+
/* Chrome 19+, Safari 6+, Safari 6+ iOS */
|
|
313
|
+
opacity: 0.6;
|
|
314
|
+
}
|
|
237
315
|
button.image-large {
|
|
238
316
|
padding: 0;
|
|
239
317
|
box-sizing: border-box;
|
|
240
|
-
border-color: #
|
|
318
|
+
border-color: #bdbdbd;
|
|
241
319
|
}
|
|
242
320
|
button.image-large img {
|
|
243
321
|
border: none;
|
|
244
|
-
width: calc(min(
|
|
245
|
-
height: calc(min(
|
|
322
|
+
width: calc(min(90vw, 90vh) * 0.7 / 2 - 10px);
|
|
323
|
+
height: calc(min(90vw, 90vh) * 0.7 / 2 - 10px);
|
|
246
324
|
padding: 0;
|
|
247
325
|
margin: 0;
|
|
248
326
|
border-radius: min(24px, 3vh);
|
|
@@ -257,7 +335,7 @@ button.image-large:active {
|
|
|
257
335
|
button.image-medium {
|
|
258
336
|
padding: 0;
|
|
259
337
|
box-sizing: border-box;
|
|
260
|
-
border-color: #
|
|
338
|
+
border-color: #bdbdbd;
|
|
261
339
|
}
|
|
262
340
|
button.image-medium img {
|
|
263
341
|
border: none;
|
|
@@ -278,8 +356,10 @@ button.image-medium img {
|
|
|
278
356
|
border-radius: min(24px, 3vh);
|
|
279
357
|
}
|
|
280
358
|
}
|
|
281
|
-
|
|
282
|
-
|
|
359
|
+
@media (hover: hover) and (pointer: fine) {
|
|
360
|
+
button.image-medium:hover {
|
|
361
|
+
border-color: #0b2e83;
|
|
362
|
+
}
|
|
283
363
|
}
|
|
284
364
|
button.image-medium:active {
|
|
285
365
|
border-color: #0b2e83;
|
|
@@ -306,18 +386,56 @@ button.warning-shadow {
|
|
|
306
386
|
button.info-shadow {
|
|
307
387
|
box-shadow: 0 0 20px 5px #275bdd;
|
|
308
388
|
border-radius: 2rem;
|
|
389
|
+
border-color: #0f3cac;
|
|
390
|
+
}
|
|
391
|
+
|
|
392
|
+
.hf-mouseover button.secondary--green:hover {
|
|
393
|
+
background: #7ab800;
|
|
394
|
+
border-color: #4d8a00;
|
|
395
|
+
box-shadow: -8px -10px 0px 0px #4d8a00 inset, 0px 0px 12px 0px #cfebb6 inset;
|
|
396
|
+
cursor: pointer;
|
|
397
|
+
}
|
|
398
|
+
.hf-mouseover button.secondary--green:active {
|
|
399
|
+
background: #70a800;
|
|
400
|
+
border-color: #539400;
|
|
401
|
+
box-shadow: -8px -10px 0px 0px #539400 inset, 0px 0px 12px 0px #cfebb6 inset;
|
|
402
|
+
}
|
|
403
|
+
|
|
404
|
+
.hf-touch button.secondary--green:hover {
|
|
405
|
+
cursor: default;
|
|
309
406
|
}
|
|
310
407
|
|
|
311
408
|
.arrow-key-border {
|
|
312
409
|
max-width: 100% !important;
|
|
313
410
|
pointer-events: none;
|
|
314
|
-
padding-top: 1vw;
|
|
315
411
|
}
|
|
316
412
|
.arrow-key-border svg {
|
|
317
413
|
width: min(6vw, 6vh);
|
|
318
414
|
height: min(6vw, 6vh);
|
|
319
415
|
}
|
|
320
416
|
|
|
417
|
+
.lev-progress-bar {
|
|
418
|
+
position: absolute;
|
|
419
|
+
top: min(8px, 1vh);
|
|
420
|
+
right: min(8px, 1vh);
|
|
421
|
+
left: 50%;
|
|
422
|
+
transform: translateX(-50%);
|
|
423
|
+
display: flex;
|
|
424
|
+
justify-content: flex-start;
|
|
425
|
+
align-items: center;
|
|
426
|
+
width: 70vw;
|
|
427
|
+
height: min(10px, 1.5vh);
|
|
428
|
+
background-color: rgba(255, 255, 255, 0.8);
|
|
429
|
+
border-radius: min(10px, 1.5vh)/2;
|
|
430
|
+
overflow: hidden;
|
|
431
|
+
}
|
|
432
|
+
.lev-progress-bar .progress-fill {
|
|
433
|
+
height: 100%;
|
|
434
|
+
background-color: #275bdd;
|
|
435
|
+
border-radius: min(10px, 1.5vh)/2;
|
|
436
|
+
width: 0%;
|
|
437
|
+
}
|
|
438
|
+
|
|
321
439
|
.lev-toast-default {
|
|
322
440
|
position: fixed;
|
|
323
441
|
top: -100px;
|
|
@@ -361,6 +479,28 @@ button.info-shadow {
|
|
|
361
479
|
background: rgba(255, 255, 255, 0.8);
|
|
362
480
|
}
|
|
363
481
|
|
|
482
|
+
.exit-confirmation-popup {
|
|
483
|
+
position: absolute;
|
|
484
|
+
top: 10%;
|
|
485
|
+
left: 50vw;
|
|
486
|
+
transform: translateX(-50%);
|
|
487
|
+
border: 3px solid #0f3cac;
|
|
488
|
+
border-radius: min(32px, 4vh);
|
|
489
|
+
background-color: #ffffff;
|
|
490
|
+
padding: 20px;
|
|
491
|
+
text-align: center;
|
|
492
|
+
font-weight: 700;
|
|
493
|
+
}
|
|
494
|
+
|
|
495
|
+
.exit-confirmation-popup-buttons {
|
|
496
|
+
display: flex;
|
|
497
|
+
flex-direction: row;
|
|
498
|
+
gap: 20px;
|
|
499
|
+
margin-top: 20px;
|
|
500
|
+
justify-content: center;
|
|
501
|
+
align-items: center;
|
|
502
|
+
}
|
|
503
|
+
|
|
364
504
|
.lev-text {
|
|
365
505
|
font-size: 32px;
|
|
366
506
|
line-height: 1;
|
|
@@ -457,6 +597,23 @@ button.info-shadow {
|
|
|
457
597
|
transform: rotate(0deg);
|
|
458
598
|
}
|
|
459
599
|
}
|
|
600
|
+
.pulse {
|
|
601
|
+
width: 200px;
|
|
602
|
+
height: 200px;
|
|
603
|
+
animation: pulse 2s infinite;
|
|
604
|
+
}
|
|
605
|
+
.pulse:hover {
|
|
606
|
+
cursor: pointer;
|
|
607
|
+
}
|
|
608
|
+
|
|
609
|
+
@keyframes pulse {
|
|
610
|
+
0% {
|
|
611
|
+
transform: scale(1);
|
|
612
|
+
}
|
|
613
|
+
50% {
|
|
614
|
+
transform: scale(1.1);
|
|
615
|
+
}
|
|
616
|
+
}
|
|
460
617
|
.lev-response-row {
|
|
461
618
|
width: 100%;
|
|
462
619
|
}
|
|
@@ -572,7 +729,7 @@ button.info-shadow {
|
|
|
572
729
|
grid-row: 2;
|
|
573
730
|
}
|
|
574
731
|
|
|
575
|
-
.lev-row-container {
|
|
732
|
+
.lev-row-container, .lev-row-container.instruction-half-screen {
|
|
576
733
|
display: flex;
|
|
577
734
|
padding: 24px;
|
|
578
735
|
justify-content: center;
|
|
@@ -613,7 +770,7 @@ button.info-shadow {
|
|
|
613
770
|
margin: 0;
|
|
614
771
|
}
|
|
615
772
|
}
|
|
616
|
-
.lev-row-container.instruction {
|
|
773
|
+
.lev-row-container.instruction, .lev-row-container.instruction-half-screen {
|
|
617
774
|
display: flex;
|
|
618
775
|
padding: min(24px, 3.5vh);
|
|
619
776
|
justify-content: center;
|
|
@@ -625,21 +782,21 @@ button.info-shadow {
|
|
|
625
782
|
width: calc(100vw - 2 * (min(64px, 8vh) + min(8px, 1vh) + 24px));
|
|
626
783
|
max-width: max-content;
|
|
627
784
|
}
|
|
628
|
-
.lev-row-container.instruction p {
|
|
785
|
+
.lev-row-container.instruction p, .lev-row-container.instruction-half-screen p {
|
|
629
786
|
font-size: clamp(16px, min(2vw, 3vh), 48px);
|
|
630
787
|
font-weight: 400;
|
|
631
788
|
line-height: 1;
|
|
632
789
|
margin: 0;
|
|
633
790
|
}
|
|
634
791
|
@media (max-width: 800px) {
|
|
635
|
-
.lev-row-container.instruction {
|
|
792
|
+
.lev-row-container.instruction, .lev-row-container.instruction-half-screen {
|
|
636
793
|
display: flex;
|
|
637
794
|
padding: min(16px, 2.5vh);
|
|
638
795
|
justify-content: center;
|
|
639
796
|
align-items: center;
|
|
640
797
|
border-radius: min(24px, 3vh);
|
|
641
798
|
}
|
|
642
|
-
.lev-row-container.instruction p {
|
|
799
|
+
.lev-row-container.instruction p, .lev-row-container.instruction-half-screen p {
|
|
643
800
|
font-size: clamp(16px, min(2vw, 3vh), 48px);
|
|
644
801
|
font-weight: 400;
|
|
645
802
|
line-height: 1;
|
|
@@ -647,7 +804,7 @@ button.info-shadow {
|
|
|
647
804
|
}
|
|
648
805
|
}
|
|
649
806
|
@media (max-width: 500px) {
|
|
650
|
-
.lev-row-container.instruction {
|
|
807
|
+
.lev-row-container.instruction, .lev-row-container.instruction-half-screen {
|
|
651
808
|
display: flex;
|
|
652
809
|
padding: 12px;
|
|
653
810
|
justify-content: center;
|
|
@@ -655,13 +812,16 @@ button.info-shadow {
|
|
|
655
812
|
border-radius: min(24px, 3vh);
|
|
656
813
|
width: 90vw;
|
|
657
814
|
}
|
|
658
|
-
.lev-row-container.instruction p {
|
|
815
|
+
.lev-row-container.instruction p, .lev-row-container.instruction-half-screen p {
|
|
659
816
|
font-size: clamp(16px, min(2vw, 3vh), 48px);
|
|
660
817
|
font-weight: 400;
|
|
661
818
|
line-height: 1;
|
|
662
819
|
margin: 0;
|
|
663
820
|
}
|
|
664
821
|
}
|
|
822
|
+
.lev-row-container.instruction-half-screen {
|
|
823
|
+
max-width: 40vw !important;
|
|
824
|
+
}
|
|
665
825
|
.lev-row-container.instruction-small {
|
|
666
826
|
display: flex;
|
|
667
827
|
padding: min(24px, 3.5vh);
|
|
@@ -712,23 +872,26 @@ button.info-shadow {
|
|
|
712
872
|
}
|
|
713
873
|
}
|
|
714
874
|
|
|
715
|
-
.lev-stimulus-container {
|
|
875
|
+
.lev-stimulus-container, .lev-stimulus-container-wide {
|
|
716
876
|
display: flex;
|
|
717
877
|
flex-direction: column;
|
|
718
878
|
width: 100%;
|
|
719
879
|
max-width: 900px;
|
|
720
880
|
justify-content: center;
|
|
721
|
-
margin-top: calc(min(64px, 8vh) + min(8px, 1vh));
|
|
722
881
|
margin-bottom: 16px;
|
|
723
882
|
align-items: center;
|
|
724
883
|
}
|
|
725
|
-
.lev-stimulus-container img {
|
|
884
|
+
.lev-stimulus-container img, .lev-stimulus-container-wide img {
|
|
726
885
|
max-width: 100%;
|
|
727
886
|
width: calc(3 * min(clamp(120px, 10vw, 150px), 15vh));
|
|
728
887
|
height: calc(3 * min(clamp(120px, 10vw, 150px), 15vh));
|
|
729
888
|
}
|
|
730
889
|
|
|
731
|
-
.lev-
|
|
890
|
+
.lev-stimulus-container-wide {
|
|
891
|
+
max-width: 90vw;
|
|
892
|
+
}
|
|
893
|
+
|
|
894
|
+
.lev-stim-content, .lev-stim-content-x-2, .lev-stim-content-x-3 {
|
|
732
895
|
display: flex;
|
|
733
896
|
width: 100%;
|
|
734
897
|
text-align: center;
|
|
@@ -736,10 +899,10 @@ button.info-shadow {
|
|
|
736
899
|
font-size: 64px;
|
|
737
900
|
color: #275bdd;
|
|
738
901
|
}
|
|
739
|
-
.lev-stim-content img, .lev-stim-content-x-3 img {
|
|
902
|
+
.lev-stim-content img, .lev-stim-content-x-2 img, .lev-stim-content-x-3 img {
|
|
740
903
|
border: none;
|
|
741
|
-
width: calc(min(
|
|
742
|
-
height: calc(min(
|
|
904
|
+
width: calc(min(90vw, 90vh) * 0.7 / 2 - 10px);
|
|
905
|
+
height: calc(min(90vw, 90vh) * 0.7 / 2 - 10px);
|
|
743
906
|
padding: 0;
|
|
744
907
|
margin: 0;
|
|
745
908
|
border-radius: min(24px, 3vh);
|
|
@@ -762,6 +925,23 @@ button.info-shadow {
|
|
|
762
925
|
}
|
|
763
926
|
}
|
|
764
927
|
|
|
928
|
+
.lev-stim-content-x-2 img {
|
|
929
|
+
width: calc(2 * min(clamp(120px, 10vw, 150px), 15vh));
|
|
930
|
+
height: calc(2 * min(clamp(120px, 10vw, 150px), 15vh));
|
|
931
|
+
}
|
|
932
|
+
@media (max-width: 650px) {
|
|
933
|
+
.lev-stim-content-x-2 img {
|
|
934
|
+
width: calc(2 * min(clamp(100px, 18vw, 150px), 15vh));
|
|
935
|
+
height: calc(2 * min(clamp(100px, 18vw, 150px), 15vh));
|
|
936
|
+
}
|
|
937
|
+
}
|
|
938
|
+
@media (max-width: 500px) {
|
|
939
|
+
.lev-stim-content-x-2 img {
|
|
940
|
+
width: 44vw;
|
|
941
|
+
height: 44vw;
|
|
942
|
+
}
|
|
943
|
+
}
|
|
944
|
+
|
|
765
945
|
.lev-instructions-container {
|
|
766
946
|
text-align: center;
|
|
767
947
|
font-size: 1.3rem;
|
|
@@ -809,6 +989,63 @@ button.info-shadow {
|
|
|
809
989
|
font-size: 4rem;
|
|
810
990
|
}
|
|
811
991
|
|
|
992
|
+
.horizontal-wrapper {
|
|
993
|
+
display: flex;
|
|
994
|
+
flex-direction: row;
|
|
995
|
+
justify-content: center;
|
|
996
|
+
align-items: center;
|
|
997
|
+
width: 100%;
|
|
998
|
+
gap: 10vw;
|
|
999
|
+
}
|
|
1000
|
+
|
|
1001
|
+
.sds-progress-container {
|
|
1002
|
+
max-width: 50vw;
|
|
1003
|
+
display: flex;
|
|
1004
|
+
flex-direction: row;
|
|
1005
|
+
align-items: center;
|
|
1006
|
+
gap: 30px;
|
|
1007
|
+
}
|
|
1008
|
+
|
|
1009
|
+
.theta-estimate-container {
|
|
1010
|
+
position: absolute;
|
|
1011
|
+
top: 30px;
|
|
1012
|
+
left: 30px;
|
|
1013
|
+
flex-direction: column;
|
|
1014
|
+
justify-content: center;
|
|
1015
|
+
align-items: center;
|
|
1016
|
+
width: 30%;
|
|
1017
|
+
max-height: 50%;
|
|
1018
|
+
border: 1px solid red;
|
|
1019
|
+
border-radius: 10px;
|
|
1020
|
+
background-color: #ffffff;
|
|
1021
|
+
color: black;
|
|
1022
|
+
font-size: 1.5rem;
|
|
1023
|
+
font-weight: 600;
|
|
1024
|
+
padding: 10px;
|
|
1025
|
+
}
|
|
1026
|
+
|
|
1027
|
+
.experimenter-button-container {
|
|
1028
|
+
position: absolute;
|
|
1029
|
+
bottom: min(8px, 1vh);
|
|
1030
|
+
left: min(8px, 1vh);
|
|
1031
|
+
display: flex;
|
|
1032
|
+
flex-direction: column;
|
|
1033
|
+
align-items: center;
|
|
1034
|
+
justify-content: flex-start;
|
|
1035
|
+
gap: min(8px, 1vh);
|
|
1036
|
+
}
|
|
1037
|
+
|
|
1038
|
+
.participant-button-container {
|
|
1039
|
+
position: absolute;
|
|
1040
|
+
top: min(8px, 1vh);
|
|
1041
|
+
right: min(8px, 1vh);
|
|
1042
|
+
display: flex;
|
|
1043
|
+
flex-direction: row;
|
|
1044
|
+
align-items: center;
|
|
1045
|
+
justify-content: flex-end;
|
|
1046
|
+
gap: min(8px, 1vh);
|
|
1047
|
+
}
|
|
1048
|
+
|
|
812
1049
|
video.instruction-video {
|
|
813
1050
|
width: min(40vw, 40vh);
|
|
814
1051
|
height: min(40vw, 40vh);
|
|
@@ -982,12 +1219,17 @@ img.instruction-video {
|
|
|
982
1219
|
}
|
|
983
1220
|
}
|
|
984
1221
|
.lev-corsi-override .lev-corsi-block-override {
|
|
985
|
-
background-color: rgba(215, 215, 215, 0.93);
|
|
986
1222
|
width: 100%;
|
|
987
1223
|
height: 100%;
|
|
988
1224
|
border-radius: 2rem;
|
|
989
1225
|
border: 6px solid rgba(162, 162, 162, 0.93);
|
|
990
1226
|
}
|
|
1227
|
+
.lev-corsi-override.display {
|
|
1228
|
+
background-color: rgba(215, 215, 215, 0.93);
|
|
1229
|
+
}
|
|
1230
|
+
.lev-corsi-override.input {
|
|
1231
|
+
background-color: rgba(255, 255, 255, 0.8);
|
|
1232
|
+
}
|
|
991
1233
|
|
|
992
1234
|
#jspsych-html-slider-response-wrapper {
|
|
993
1235
|
width: min(800px, 95%);
|
|
@@ -1114,7 +1356,6 @@ img.instruction-video {
|
|
|
1114
1356
|
background: white;
|
|
1115
1357
|
border-radius: 32px;
|
|
1116
1358
|
color: black;
|
|
1117
|
-
font-family: "Noto Sans";
|
|
1118
1359
|
font-size: 1rem;
|
|
1119
1360
|
font-style: normal;
|
|
1120
1361
|
font-weight: 700;
|
|
@@ -1145,6 +1386,7 @@ img.instruction-video {
|
|
|
1145
1386
|
}
|
|
1146
1387
|
.instruction-no-border p {
|
|
1147
1388
|
margin-bottom: 0;
|
|
1389
|
+
text-align: left;
|
|
1148
1390
|
}
|
|
1149
1391
|
@media (min-width: 1200px) {
|
|
1150
1392
|
.instruction-no-border {
|
package/package.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bdelab/roar-levante-tasks",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"description": "",
|
|
5
|
-
"main": "lib/index.
|
|
6
|
-
"module": "lib/index.
|
|
5
|
+
"main": "lib/index.c92b94e1.js",
|
|
6
|
+
"module": "lib/index.c92b94e1.js",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"files": [
|
|
9
9
|
"lib",
|
|
@@ -11,15 +11,16 @@
|
|
|
11
11
|
"patchPackages.js"
|
|
12
12
|
],
|
|
13
13
|
"scripts": {
|
|
14
|
-
"build": "npx webpack --mode production --env dbmode=development",
|
|
14
|
+
"build:dev": "npx webpack --mode production --env dbmode=development",
|
|
15
|
+
"build:staging": "npx webpack --mode production --env dbmode=staging",
|
|
15
16
|
"build:prod": "npx webpack --mode production --env dbmode=production",
|
|
16
17
|
"prepackage": "rimraf lib/",
|
|
17
18
|
"package": "npx rollup -c",
|
|
18
19
|
"postpackage": "node postBuildPackage.js",
|
|
19
20
|
"prepublishOnly": "npm run package",
|
|
20
21
|
"preversion": "npm run lint",
|
|
21
|
-
"version": "npm run format && git add -A",
|
|
22
|
-
"postversion": "GIT_REMOTE=$(git remote -v | grep
|
|
22
|
+
"version": "npm run format && git add -A && git commit -m \"v$npm_package_version\"",
|
|
23
|
+
"postversion": "git tag \"v$npm_package_version\" && GIT_REMOTE=$(git remote -v | grep 'yeatmanlab/roar-levante-tasks.git (push)' | cut -f 1) && git push $GIT_REMOTE && git push $GIT_REMOTE --tags",
|
|
23
24
|
"dev": "npx webpack serve --mode development --env dbmode=development",
|
|
24
25
|
"deploy:prod": "npm run build:prod && firebase deploy --only hosting",
|
|
25
26
|
"lint": "npx eslint --ext .ts,.tsx,.js,.jsx",
|
|
@@ -28,7 +29,10 @@
|
|
|
28
29
|
"postinstall": "npm run patchPackages",
|
|
29
30
|
"predev": "fkill :8000 -f || true",
|
|
30
31
|
"preprod": "fkill :8000 -f || true",
|
|
31
|
-
"cypress:open": "cypress open"
|
|
32
|
+
"cypress:open": "cypress open",
|
|
33
|
+
"test": "vitest",
|
|
34
|
+
"test:ui": "vitest --ui",
|
|
35
|
+
"test:coverage": "vitest --coverage"
|
|
32
36
|
},
|
|
33
37
|
"repository": {
|
|
34
38
|
"type": "git",
|
|
@@ -40,9 +44,9 @@
|
|
|
40
44
|
],
|
|
41
45
|
"license": "STANFORD ACADEMIC SOFTWARE LICENSE FOR ROAR™",
|
|
42
46
|
"dependencies": {
|
|
43
|
-
"@bdelab/jscat": "
|
|
47
|
+
"@bdelab/jscat": "5.3.2",
|
|
44
48
|
"@bdelab/roar-firekit": "^6.1.2",
|
|
45
|
-
"@bdelab/roar-utils": "
|
|
49
|
+
"@bdelab/roar-utils": "1.2.7",
|
|
46
50
|
"@jspsych-contrib/plugin-audio-multi-response": "^1.0.0",
|
|
47
51
|
"@jspsych-contrib/plugin-corsi-blocks": "^1.0.0",
|
|
48
52
|
"@jspsych-contrib/plugin-html-multi-response": "^1.0.2",
|
|
@@ -64,7 +68,8 @@
|
|
|
64
68
|
"lodash": "^4.17.21",
|
|
65
69
|
"papaparse": "^5.4.1",
|
|
66
70
|
"regenerator-runtime": "^0.13.9",
|
|
67
|
-
"store2": "^2.13.2"
|
|
71
|
+
"store2": "^2.13.2",
|
|
72
|
+
"vitest": "^4.1.2"
|
|
68
73
|
},
|
|
69
74
|
"devDependencies": {
|
|
70
75
|
"@babel/cli": "^7.22.5",
|
|
@@ -90,6 +95,7 @@
|
|
|
90
95
|
"eslint-plugin-import": "^2.25.4",
|
|
91
96
|
"file-loader": "^6.2.0",
|
|
92
97
|
"html-webpack-plugin": "^5.5.0",
|
|
98
|
+
"jsdom": "^29.1.1",
|
|
93
99
|
"path-browserify": "^1.0.1",
|
|
94
100
|
"prettier": "3.0.0",
|
|
95
101
|
"process": "^0.11.10",
|