@mjsz-vbr-elements/shared 2.6.1 → 2.6.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.
@@ -0,0 +1,939 @@
1
+ .mjsz-vbr-gamecenter-timeline {
2
+ container-name: rows;
3
+ container-type: inline-size;
4
+ }
5
+
6
+ .mjsz-vbr-gamecenter-timeline-game-data {
7
+ margin-bottom: 30px;
8
+ text-align: center;
9
+ }
10
+
11
+ .mjsz-vbr-gamecenter-timeline-game-data .is-teams-and-results {
12
+ display: grid;
13
+ grid-template-columns: 1fr;
14
+ justify-items: center;
15
+ align-items: start;
16
+ row-gap: 1rem;
17
+ background-color: var(--vbr-widget-primary-color-0);
18
+ }
19
+
20
+ @media all and (min-width: 576px) {
21
+
22
+ .mjsz-vbr-gamecenter-timeline-game-data .is-teams-and-results {
23
+ grid-template-columns: repeat(3, 1fr)
24
+ }
25
+ }
26
+
27
+ .mjsz-vbr-gamecenter-timeline-game-data .is-title-container {
28
+ margin-bottom: 30px;
29
+ }
30
+
31
+ .mjsz-vbr-gamecenter-timeline-game-data .is-title-container .is-title {
32
+ color: var(--vbr-widget-gamecenter-title-color);
33
+ font-size: var(--vbr-widget-gamecenter-title-size);
34
+ font-weight: var(--vbr-widget-gamecenter-title-weight);
35
+ text-transform: uppercase;
36
+ }
37
+
38
+ .mjsz-vbr-gamecenter-timeline-game-data .is-title-container .is-gamedate {
39
+ color: var(--vbr-widget-gamecenter-gamedate-color);
40
+ font-size: var(--vbr-widget-gamecenter-gamedate-size);
41
+ text-transform: uppercase;
42
+ }
43
+
44
+ .mjsz-vbr-gamecenter-timeline-game-data .is-title-container .is-local-gamedate {
45
+ color: var(--vbr-widget-gamecenter-local-gamedate-color);
46
+ font-size: var(--vbr-widget-gamecenter-local-gamedate-size);
47
+ text-transform: uppercase;
48
+ }
49
+
50
+ .mjsz-vbr-gamecenter-timeline-game-data .is-game-result {
51
+ color: var(--vbr-widget-gamecenter-result-color);
52
+ font-weight: var(--vbr-widget-gamecenter-result-weight);
53
+ font-size: var(--vbr-widget-gamecenter-result-size);
54
+ line-height: var(--vbr-widget-gamecenter-result-size);
55
+ }
56
+
57
+ .mjsz-vbr-gamecenter-timeline-game-data .is-team-name {
58
+ display: block;
59
+ padding: 8px 0;
60
+ color: var(--vbr-widget-gamecenter-teamname-color);
61
+ font-weight: var(--vbr-widget-gamecenter-teamname-weight);
62
+ font-size: var(--vbr-widget-gamecenter-teamname-size);
63
+ }
64
+
65
+ .mjsz-vbr-gamecenter-timeline-game-data .is-game-status {
66
+ color: var(--vbr-widget-gamecenter-gamestatus-color);
67
+ font-size: var(--vbr-widget-gamecenter-gamestatus-size);
68
+ text-transform: uppercase;
69
+ }
70
+
71
+ .mjsz-vbr-gamecenter-timeline-game-data .is-period-results {
72
+ color: var(--vbr-widget-gamecenter-periodresults-color);
73
+ font-size: var(--vbr-widget-gamecenter-periodresults-size);
74
+ font-weight: 500;
75
+ }
76
+
77
+ .mjsz-vbr-gamecenter-timeline-game-data .is-team-logo {
78
+ margin: auto;
79
+ display: block;
80
+ width: 128px;
81
+ height: 128px;
82
+ }
83
+
84
+ .mjsz-vbr-gamecenter-timeline-game-data .is-game-status-live {
85
+ color: var(--vbr-widget-live-game-color);
86
+ }
87
+
88
+ .mjsz-vbr-gamecenter-timeline-game-data .is-external-contents {
89
+ padding: 5px;
90
+ display: flex;
91
+ align-items: center;
92
+ justify-content: center;
93
+ }
94
+
95
+ .mjsz-vbr-gamecenter-timeline-game-data .is-external-contents a {
96
+ display: flex;
97
+ align-items: center;
98
+ font-size: var(--vbr-widget-gamecenter-local-gamedate-size);
99
+ }
100
+
101
+ .mjsz-vbr-gamecenter-timeline-game-data .is-external-contents a:after {
102
+ content: '/';
103
+ margin: 0 5px;
104
+ }
105
+
106
+ .mjsz-vbr-gamecenter-timeline-game-data .is-external-contents a:last-of-type:after {
107
+ content: '';
108
+ }
109
+
110
+ .mjsz-vbr-gamecenter-timeline-game-data .is-external-contents .is-icon {
111
+ margin-right: 5px;
112
+ display: inline-block;
113
+ width: 15px;
114
+ height: 15px;
115
+ }
116
+
117
+ .mjsz-vbr-gamecenter-timeline-game-data .is-attendance {
118
+ font-size: var(--vbr-widget-typography-text-sm-size);
119
+ line-height: var(--vbr-widget-typography-text-lg-lineheight);
120
+ color: var(--vbr-widget-primary-color-500);
121
+ }
122
+
123
+ .mjsz-vbr-gamecenter-timeline-game-data .is-goal-scorers {
124
+ font-size: var(--vbr-widget-typography-text-xs-size);
125
+ font-weight: 700;
126
+ line-height: var(--vbr-widget-typography-text-xs-lineheight);
127
+ color: var(--vbr-widget-primary-color-500);
128
+ }
129
+
130
+ .mjsz-vbr-gamecenter-timeline-game-data .is-goal-scorers span {
131
+ font-weight: 400;
132
+ }
133
+
134
+ .mjsz-vbr-gamecenter-timeline-score-board {
135
+ /* display: grid; */
136
+ grid-template-columns: 1fr 50px auto auto auto 50px 1fr;
137
+ grid-template-rows: 50px;
138
+ align-items: center;
139
+ justify-items: center;
140
+ gap: 1rem;
141
+ padding: 0.5rem;
142
+ width: 100%;
143
+ color: #fff;
144
+ background-color: var(--vbr-widget-primary-color-700);
145
+ position: sticky;
146
+ top: 0;
147
+ display: none;
148
+ z-index: 100;
149
+ }
150
+
151
+ .mjsz-vbr-gamecenter-timeline-score-board.is-visible {
152
+ display: grid;
153
+ }
154
+
155
+ .mjsz-vbr-gamecenter-timeline-score-board .is-score {
156
+ font-size: var(--vbr-widget-typography-text-4xl-size);
157
+ font-weight: 700;
158
+ }
159
+
160
+ .mjsz-vbr-gamecenter-timeline-score-board .is-team {
161
+ font-size: var(--vbr-widget-typography-text-base-size);
162
+ font-weight: 700;
163
+ color: var(--vbr-widget-primary-color-100);
164
+ }
165
+
166
+ .mjsz-vbr-gamecenter-timeline-score-board .is-home-team {
167
+ justify-self: end;
168
+ text-align: right;
169
+ }
170
+
171
+ .mjsz-vbr-gamecenter-timeline-score-board .is-away-team {
172
+ justify-self: start;
173
+ }
174
+
175
+ .mjsz-vbr-gamecenter-timeline-score-board .is-game-status {
176
+ font-size: var(--vbr-widget-typography-text-xs-size);
177
+ font-weight: 500;
178
+ text-transform: uppercase;
179
+ color: var(--vbr-widget-live-game-color);
180
+ }
181
+
182
+ .mjsz-vbr-gamecenter-timeline-score-board img {
183
+ display: block;
184
+ width: 100%;
185
+ height: 100%;
186
+ }
187
+
188
+ .mjsz-vbr-gamecenter-timeline .is-heading-1 {
189
+ margin-block-start: 3rem;
190
+ margin-block-end: 1rem;
191
+ font-size: var(--vbr-widget-typography-text-xl-size);
192
+ font-weight: 700;
193
+ color: var(--vbr-widget-primary-color-800);
194
+ text-align: center;
195
+ text-transform: uppercase;
196
+ }
197
+
198
+ .mjsz-vbr-gamecenter-timeline .is-heading-2 {
199
+ margin-block-start: 3rem;
200
+ margin-block-end: 1rem;
201
+ font-size: var(--vbr-widget-typography-text-base-size);
202
+ font-weight: 700;
203
+ color: var(--vbr-widget-primary-color-800);
204
+ text-align: center;
205
+ text-transform: uppercase;
206
+ }
207
+
208
+ .mjsz-vbr-gamecenter-timeline-tab-buttons {
209
+ display: flex;
210
+ flex-wrap: wrap;
211
+ justify-content: center;
212
+ border-bottom: 1px solid var(--vbr-widget-primary-color-100);
213
+ margin-block-end: 2rem;
214
+ }
215
+
216
+ .mjsz-vbr-gamecenter-timeline .mjsz-vbr-period-results {
217
+ width: 100%;
218
+ }
219
+
220
+ .mjsz-vbr-gamecenter-timeline .mjsz-vbr-period-results tr:first-of-type {
221
+ border-bottom: 1px solid var(--vbr-widget-primary-color-100);
222
+ }
223
+
224
+ .mjsz-vbr-gamecenter-timeline .mjsz-vbr-period-results td {
225
+ font-size: var(--vbr-widget-typography-text-base-size);
226
+ font-weight: 500;
227
+ color: var(--vbr-widget-primary-color-700);
228
+ }
229
+
230
+ .mjsz-vbr-gamecenter-timeline .mjsz-vbr-period-results td:nth-child(2) {
231
+ font-size: var(--vbr-widget-typography-text-sm-size);
232
+ text-align: left;
233
+ }
234
+
235
+ .mjsz-vbr-gamecenter-timeline .mjsz-vbr-period-results span {
236
+ display: inline-block;
237
+ width: 9px;
238
+ height: 9px;
239
+ border: 1px solid #fff;
240
+ border-radius: 50%;
241
+ }
242
+
243
+ .mjsz-vbr-gamecenter-timeline .mjsz-vbr-period-results span.is-home-team {
244
+ background-color: var(--vbr-widget-gamecenter-home-team-identifier-color);
245
+ }
246
+
247
+ .mjsz-vbr-gamecenter-timeline .mjsz-vbr-period-results span.is-away-team {
248
+ background-color: var(--vbr-widget-gamecenter-away-team-identifier-color);
249
+ }
250
+
251
+ .mjsz-vbr-gamecenter-timeline-game-events .is-no-action {
252
+ padding-block: 0.5rem;
253
+ text-align: center;
254
+ color: var(--vbr-widget-primary-color-300);
255
+ }
256
+
257
+ .mjsz-vbr-gamecenter-timeline-game-events .is-period-header {
258
+ padding-block: 1rem;
259
+ display: grid;
260
+ grid-template-columns: 1fr auto 1fr;
261
+ grid-template-rows: auto 1fr 1px 1fr;
262
+ }
263
+
264
+ .mjsz-vbr-gamecenter-timeline-game-events .is-period-header p {
265
+ grid-column: 2;
266
+ grid-row: 1;
267
+ justify-self: center;
268
+ margin-bottom: 0.25rem;
269
+ padding-inline: 0.5rem;
270
+ width: max-content;
271
+ color: #fff;
272
+ font-size: var(--vbr-widget-typography-text-base-size);
273
+ font-weight: 500;
274
+ line-height: var(--vbr-widget-typography-text-base-lineheight);
275
+ background-color: var(--vbr-widget-primary-color-900);
276
+ border-radius: 6px;
277
+ }
278
+
279
+ .mjsz-vbr-gamecenter-timeline-game-events .is-period-header span {
280
+ grid-column: 2;
281
+ grid-row: 2/-1;
282
+
283
+ padding-inline: 0.5rem;
284
+ padding-block: 0.25rem;
285
+ font-size: small;
286
+ font-weight: 500;
287
+ color: var(--vbr-widget-primary-color-500);
288
+ background-color: var(--vbr-widget-primary-color-100);
289
+ border-radius: 0.5rem;
290
+ }
291
+
292
+ .mjsz-vbr-gamecenter-timeline-game-events .is-period-header span svg {
293
+ display: inline-block;
294
+ width: 14px;
295
+ height: 14px;
296
+ vertical-align: sub;
297
+ }
298
+
299
+ .mjsz-vbr-gamecenter-timeline-game-events .is-period-header div {
300
+ grid-column: 1/-1;
301
+ grid-row: 3;
302
+ background-color: var(--vbr-widget-primary-color-100);
303
+ }
304
+
305
+ .mjsz-vbr-gamecenter-timeline-game-event {
306
+ --columns: 0.15fr 2px 0.15fr 1fr;
307
+ --areas: '. . . .' 'time time time details' '. . . .';
308
+
309
+ display: grid;
310
+ grid-template-columns: var(--columns);
311
+ grid-template-rows: 0.5rem 1fr 0.5rem;
312
+ grid-template-areas: var(--areas);
313
+ gap: 0.25rem;
314
+ }
315
+
316
+ .mjsz-vbr-gamecenter-timeline-game-event .is-timeline {
317
+ grid-column: 2/3;
318
+ grid-row: 1/-1;
319
+ background-color: var(--vbr-widget-primary-color-200);
320
+ }
321
+
322
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container {
323
+ grid-area: details;
324
+
325
+ display: grid;
326
+ grid-template-columns: auto 1fr;
327
+ grid-template-areas: 'type-icon detail-title' 'type-icon detail-list';
328
+ column-gap: 1rem;
329
+ padding: 1rem;
330
+ border-inline-end: 5px solid var(--vbr-widget-gamecenter-home-team-identifier-color);
331
+ background-color: var(--vbr-widget-gamecenter-card-bg-color);
332
+ border-radius: 0.5rem;
333
+ align-items: start;
334
+ outline: 1px solid var(--vbr-widget-gamecenter-card-border-color);
335
+ }
336
+
337
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container:not(:has(.is-details-list)) {
338
+ grid-template-areas: 'type-icon detail-title';
339
+ align-items: center;
340
+ }
341
+
342
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-details-title {
343
+ grid-area: detail-title;
344
+
345
+ font-weight: 700;
346
+ text-transform: uppercase;
347
+ color: var(--vbr-widget-gamecenter-card-title-color);
348
+ }
349
+
350
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-details-list {
351
+ grid-area: detail-list;
352
+ margin: 0;
353
+ padding: 0;
354
+ list-style: none;
355
+ }
356
+
357
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-details-list .is-details-sub-title {
358
+ font-size: var(--vbr-widget-typography-text-sm-size);
359
+ color: var(--vbr-widget-gamecenter-card-secondary-color);
360
+ }
361
+
362
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-details-list .is-evented-person {
363
+ font-weight: var(--vbr-widget-gamecenter-events-evented-person-weight);
364
+ color: var(--vbr-widget-gamecenter-card-secondary-color);
365
+ }
366
+
367
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-details-list .is-player-number {
368
+ font-weight: 400;
369
+ font-style: italic;
370
+ }
371
+
372
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-team-logo {
373
+ grid-area: team-logo;
374
+
375
+ display: none;
376
+
377
+ justify-self: center;
378
+ align-self: center;
379
+ }
380
+
381
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-team-logo img {
382
+ width: 40px;
383
+ height: 40px;
384
+ }
385
+
386
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-event-type-icon {
387
+ grid-area: type-icon;
388
+ padding: 0.5rem;
389
+ border-radius: 100%;
390
+ }
391
+
392
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-event-type-icon svg {
393
+ display: block;
394
+ width: 14px;
395
+ height: 14px;
396
+ }
397
+
398
+ /* margin-block-start: 1px; */
399
+
400
+ @container rows (width > 410px) {
401
+
402
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-event-type-icon svg {
403
+ width: 24px;
404
+ height: 24px
405
+ }
406
+ }
407
+
408
+ /* outline-color: var(--vbr-widget-danger-color-a400); */
409
+
410
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-penalty .is-event-type-icon {
411
+ color: var(--vbr-widget-primary-color-0);
412
+ background-color: var(--vbr-widget-danger-color-a400);
413
+ }
414
+
415
+ /* outline-color: var(--vbr-widget-gamecenter-home-team-identifier-color); */
416
+
417
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-timeout .is-event-type-icon {
418
+ color: var(--vbr-widget-primary-color-0);
419
+ background-color: var(--vbr-widget-gamecenter-home-team-identifier-color);
420
+ }
421
+
422
+ /* outline-color: var(--vbr-widget-gamecenter-home-team-identifier-color); */
423
+
424
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goalies .is-event-type-icon {
425
+ color: var(--vbr-widget-primary-color-900);
426
+ background-color: var(--vbr-widget-neutral-color);
427
+ }
428
+
429
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-penalty-shot-goal .is-event-type-icon {
430
+ color: var(--vbr-widget-primary-color-0);
431
+ background-color: var(--vbr-widget-live-game-color);
432
+ }
433
+
434
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-penalty-shot-no-goal .is-event-type-icon {
435
+ color: var(--vbr-widget-primary-color-400);
436
+ background-color: var(--vbr-widget-primary-color-100);
437
+ }
438
+
439
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal {
440
+ /* color: var(--vbr-widget-secondary-color-500); */
441
+ background-color: var(--vbr-widget-gamecenter-card-event-goal-bg-color);
442
+ outline-color: var(--vbr-widget-gamecenter-card-event-goal-border-color);
443
+ }
444
+
445
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal .is-event-type-icon {
446
+ color: var(--vbr-widget-primary-color-0);
447
+ background-color: var(--vbr-widget-live-game-color);
448
+ }
449
+
450
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal .is-details-title {
451
+ color: var(--vbr-widget-primary-color-0);
452
+ }
453
+
454
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal .is-evented-person {
455
+ color: var(--vbr-widget-primary-color-100);
456
+ }
457
+
458
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal .is-assists-list {
459
+ font-size: var(--vbr-widget-typography-text-sm-size);
460
+ }
461
+
462
+ /* color: var(--vbr-widget-primary-color-400); */
463
+
464
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal .is-assists-list span:not(:last-of-type):after {
465
+ content: '/';
466
+ margin-inline: 0.25rem;
467
+ }
468
+
469
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal .is-poi-data {
470
+ display: flex;
471
+ flex-wrap: wrap;
472
+ gap: 0.25rem;
473
+ font-size: var(--vbr-widget-typography-text-xs-size);
474
+ color: var(--vbr-widget-gamecenter-card-tertiary-color);
475
+ }
476
+
477
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal .is-poi-data ul {
478
+ display: flex;
479
+ gap: 0.125rem;
480
+ }
481
+
482
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal .is-poi-data ul li:not(:last-of-type):after {
483
+ content: ',';
484
+ }
485
+
486
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container.is-goal .is-badge.is-invert {
487
+ color: var(--vbr-widget-danger-color-50);
488
+ background-color: var(--vbr-widget-danger-color-500);
489
+ }
490
+
491
+ @container rows (width > 410px) {
492
+
493
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container {
494
+ grid-template-columns: auto 1fr auto;
495
+ grid-template-areas: 'type-icon detail-title team-logo' 'type-icon detail-list team-logo'
496
+ }
497
+
498
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container:not(:has(.is-details-list)) {
499
+ grid-template-areas: 'type-icon detail-title team-logo';
500
+ align-items: center;
501
+ }
502
+
503
+ .mjsz-vbr-gamecenter-timeline-game-event .is-details-container .is-team-logo {
504
+ display: block;
505
+ }
506
+ }
507
+
508
+ .mjsz-vbr-gamecenter-timeline-game-event .is-timestamp {
509
+ grid-area: time;
510
+
511
+ justify-self: center;
512
+ align-self: center;
513
+ }
514
+
515
+ .mjsz-vbr-gamecenter-timeline-game-event .is-timestamp p {
516
+ margin: 0;
517
+ padding-inline: 0.5rem;
518
+ width: max-content;
519
+ color: #fff;
520
+ font-size: var(--vbr-widget-typography-text-base-size);
521
+ font-weight: 500;
522
+ line-height: var(--vbr-widget-typography-text-base-lineheight);
523
+ background-color: var(--vbr-widget-primary-color-900);
524
+ border-radius: 6px;
525
+ }
526
+
527
+ /* .is-event-type {
528
+ grid-area: event-type;
529
+
530
+ justify-self: center;
531
+
532
+ p {
533
+ display: flex;
534
+ align-items: center;
535
+ gap: 5px;
536
+ margin: 0;
537
+ padding-inline: 0.5rem;
538
+ color: var(--vbr-widget-primary-color-500);
539
+ font-size: small;
540
+ line-height: 1.5rem;
541
+ background-color: var(--vbr-widget-primary-color-100);
542
+ border-radius: 6px;
543
+ }
544
+
545
+ svg {
546
+ display: block;
547
+ width: 14px;
548
+ height: 14px;
549
+ }
550
+
551
+ &.is-goal {
552
+ p {
553
+ color: var(--vbr-widget-primary-color-0);
554
+ background-color: var(--vbr-widget-danger-color-a400);
555
+ }
556
+ }
557
+
558
+ &.is-penalty {
559
+ p {
560
+ color: var(--vbr-widget-primary-color-900);
561
+ }
562
+ }
563
+
564
+ &.is-timeout {
565
+ p {
566
+ color: var(--vbr-widget-primary-color-0);
567
+ background-color: var(--vbr-widget-secondary-color-700);
568
+ }
569
+ }
570
+
571
+ &.is-goalie-in {
572
+ p {
573
+ color: var(--vbr-widget-secondary-color-700);
574
+ border: 1px solid var(--vbr-widget-primary-color-100);
575
+ background-color: var(--vbr-widget-primary-color-0);
576
+ }
577
+ }
578
+
579
+ &.is-goalie-out {
580
+ p {
581
+ color: var(--vbr-widget-danger-color-700);
582
+ border: 1px solid var(--vbr-widget-primary-color-100);
583
+ background-color: var(--vbr-widget-primary-color-0);
584
+ }
585
+ }
586
+
587
+ &.is-penalty-shot-goal {
588
+ p {
589
+ color: var(--vbr-widget-primary-color-0);
590
+ background-color: var(--vbr-widget-danger-color-a400);
591
+ }
592
+ }
593
+
594
+ &.is-penalty-shot-no-goal {
595
+ p {
596
+ color: var(--vbr-widget-danger-color-700);
597
+ background-color: var(--vbr-widget-danger-color-100);
598
+ }
599
+ }
600
+ } */
601
+
602
+ .mjsz-vbr-gamecenter-timeline-game-event[data-team='away'] .is-details-container {
603
+ border-color: var(--vbr-widget-gamecenter-away-team-identifier-color);
604
+ }
605
+
606
+ /* &[data-team='home'] {
607
+ .is-details-list,
608
+ .is-details-title {
609
+ text-align: right;
610
+ }
611
+ } */
612
+
613
+ @container rows (width > 500px) {
614
+
615
+ .mjsz-vbr-gamecenter-timeline-game-event {
616
+ --columns: 1fr 0.15fr 2px 0.15fr 1fr;
617
+ --areas: '. . . . .' 'details time time time .' '. . . . .'
618
+ }
619
+
620
+ .mjsz-vbr-gamecenter-timeline-game-event .is-timeline {
621
+ grid-column: 3/4;
622
+ grid-row: 1/-1;
623
+ }
624
+
625
+ .mjsz-vbr-gamecenter-timeline-game-event[data-team='away'] {
626
+ --areas: '. . . . .' '. time time time details' '. . . . .';
627
+ }
628
+
629
+ .mjsz-vbr-gamecenter-timeline-game-event[data-team='home'] .is-details-container {
630
+ grid-template-columns: auto 1fr;
631
+ grid-template-areas: 'team-logo detail-title type-icon' 'team-logo detail-list type-icon';
632
+ }
633
+
634
+ .mjsz-vbr-gamecenter-timeline-game-event[data-team='home'] .is-details-container:not(:has(.is-details-list)) {
635
+ grid-template-areas: 'team-logo detail-title type-icon';
636
+ }
637
+
638
+ .mjsz-vbr-gamecenter-timeline-game-event[data-team='home'] .is-details-container {
639
+
640
+ border-inline-end: none;
641
+ border-inline-start: 5px solid var(--vbr-widget-gamecenter-home-team-identifier-color);
642
+ }
643
+
644
+ .mjsz-vbr-gamecenter-timeline-game-event[data-team='home'] .is-details-container .is-details-list,
645
+ .mjsz-vbr-gamecenter-timeline-game-event[data-team='home'] .is-details-container .is-details-title {
646
+ text-align: right;
647
+ }
648
+
649
+ .mjsz-vbr-gamecenter-timeline-game-event[data-team='home'] .is-details-container .is-poi-data {
650
+ justify-content: flex-end;
651
+ }
652
+ }
653
+
654
+ .mjsz-vbr-gamecenter-timeline-lineups {
655
+ margin-block-start: 1rem;
656
+ padding-block-end: 2rem;
657
+ }
658
+
659
+ .mjsz-vbr-gamecenter-timeline-lineups hr {
660
+ margin-block: 1.5rem;
661
+ border-top: 1px solid var(--vbr-widget-primary-color-100);
662
+ }
663
+
664
+ .mjsz-vbr-gamecenter-timeline-lineups .is-container {
665
+ display: grid;
666
+ gap: 2rem;
667
+ }
668
+
669
+ @container rows (width >= 768px) {
670
+
671
+ .mjsz-vbr-gamecenter-timeline-lineups .is-container {
672
+ grid-template-columns: 1fr 1fr
673
+ }
674
+ }
675
+
676
+ .mjsz-vbr-gamecenter-timeline-lineups-lines {
677
+ display: grid;
678
+ grid-template-columns: 1fr;
679
+ grid-template-areas: 'ld' 'rd' 'lw' 'c' 'rw';
680
+ gap: 0.5rem;
681
+ }
682
+
683
+ .mjsz-vbr-gamecenter-timeline-lineups-lines.is-away-team {
684
+ grid-template-areas: 'ld' 'rd' 'lw' 'c' 'rw';
685
+ }
686
+
687
+ .mjsz-vbr-gamecenter-timeline-lineups-lines .is-ld {
688
+ grid-area: ld;
689
+ }
690
+
691
+ .mjsz-vbr-gamecenter-timeline-lineups-lines .is-rd {
692
+ grid-area: rd;
693
+ }
694
+
695
+ .mjsz-vbr-gamecenter-timeline-lineups-lines .is-lw {
696
+ grid-area: lw;
697
+ }
698
+
699
+ .mjsz-vbr-gamecenter-timeline-lineups-lines .is-c {
700
+ grid-area: c;
701
+ }
702
+
703
+ .mjsz-vbr-gamecenter-timeline-lineups-lines .is-rw {
704
+ grid-area: rw;
705
+ }
706
+
707
+ .mjsz-vbr-gamecenter-timeline-lineups-lines .is-gk {
708
+ width: 100%;
709
+ }
710
+
711
+ .mjsz-vbr-gamecenter-timeline-lineups-lines.is-away-team .is-player-wrapper {
712
+ border-inline-start: none;
713
+ border-inline-end: 3px solid var(--vbr-widget-gamecenter-away-team-identifier-color);
714
+ }
715
+
716
+ @container rows (width >= 768px) {
717
+
718
+ .mjsz-vbr-gamecenter-timeline-lineups-lines {
719
+ grid-template-columns: 1fr 1fr;
720
+ grid-template-areas: '. lw' 'ld lw' 'ld c' 'rd c' 'rd rw' '. rw';
721
+ grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr
722
+ }
723
+
724
+ .mjsz-vbr-gamecenter-timeline-lineups-lines.is-away-team {
725
+ grid-template-areas: 'lw .' 'lw ld' 'c ld' 'c rd' 'rw rd' 'rw .';
726
+ }
727
+
728
+ .mjsz-vbr-gamecenter-timeline-lineups-lines:has(.is-gk) {
729
+ display: flex;
730
+ justify-content: center;
731
+ grid-template-columns: none;
732
+ grid-template-areas: none;
733
+ }
734
+
735
+ .mjsz-vbr-gamecenter-timeline-lineups-lines .is-gk {
736
+ width: 50%;
737
+ }
738
+ }
739
+
740
+ .mjsz-vbr-gamecenter-timeline-lineups-lines-simple {
741
+ display: grid;
742
+ grid-template-columns: 1fr;
743
+ gap: 0.5rem;
744
+ }
745
+
746
+ @container rows (width >= 768px) {
747
+
748
+ .mjsz-vbr-gamecenter-timeline-lineups-lines-simple {
749
+ grid-template-columns: 1fr 1fr
750
+ }
751
+ }
752
+
753
+ .mjsz-vbr-gamecenter-timeline-lineups-lines-referees {
754
+ display: grid;
755
+ grid-template-columns: 1fr;
756
+ gap: 0.5rem;
757
+ }
758
+
759
+ @container rows (width >= 768px) {
760
+
761
+ .mjsz-vbr-gamecenter-timeline-lineups-lines-referees {
762
+ grid-template-columns: 1fr 1fr 1fr 1fr
763
+ }
764
+ }
765
+
766
+ .mjsz-vbr-gamecenter-timeline-lineups .is-official-person-container {
767
+ display: grid;
768
+ grid-template-columns: 40px 1fr;
769
+ grid-template-areas: 'img name' 'img role';
770
+ align-content: start;
771
+ column-gap: 0.5rem;
772
+ padding: 0.75rem;
773
+ outline: 1px solid var(--vbr-widget-gamecenter-card-border-color);
774
+ background-color: var(--vbr-widget-gamecenter-card-bg-color);
775
+ border-radius: 0.5rem;
776
+ }
777
+
778
+ .mjsz-vbr-gamecenter-timeline-lineups .is-official-person-container.is-home-team {
779
+ border-inline-start: 3px solid var(--vbr-widget-gamecenter-home-team-identifier-color);
780
+ }
781
+
782
+ .mjsz-vbr-gamecenter-timeline-lineups .is-official-person-container.is-away-team {
783
+ border-inline-end: 3px solid var(--vbr-widget-gamecenter-away-team-identifier-color);
784
+ }
785
+
786
+ .mjsz-vbr-gamecenter-timeline-lineups .is-official-person-container li:nth-child(1) {
787
+ grid-area: img;
788
+ }
789
+
790
+ .mjsz-vbr-gamecenter-timeline-lineups .is-official-person-container li:nth-child(2) {
791
+ grid-area: name;
792
+
793
+ font-weight: 600;
794
+ color: var(--vbr-widget-primary-color-700);
795
+ }
796
+
797
+ .mjsz-vbr-gamecenter-timeline-lineups .is-official-person-container li:nth-child(3) {
798
+ grid-area: role;
799
+
800
+ align-self: center;
801
+ font-size: var(--vbr-widget-typography-text-xs-size);
802
+ line-height: 1;
803
+ color: var(--vbr-widget-gamecenter-card-tertiary-color);
804
+ text-transform: uppercase;
805
+ }
806
+
807
+ .mjsz-vbr-gamecenter-timeline-lineups .is-official-person-container img {
808
+ display: block;
809
+ width: 40px;
810
+ height: 40px;
811
+ border-radius: 50%;
812
+ }
813
+
814
+ .mjsz-vbr-gamecenter-timeline-lineups .is-player-wrapper {
815
+ display: grid;
816
+ grid-template-columns: 40px auto 1fr;
817
+ grid-template-areas: 'img number name' 'img position name';
818
+ column-gap: 0.5rem;
819
+ padding: 0.75rem;
820
+ background-color: var(--vbr-widget-gamecenter-card-bg-color);
821
+ border-inline-start: 3px solid var(--vbr-widget-gamecenter-home-team-identifier-color);
822
+ outline: 1px solid var(--vbr-widget-gamecenter-card-border-color);
823
+ border-radius: 0.5rem;
824
+ overflow: hidden;
825
+ }
826
+
827
+ .mjsz-vbr-gamecenter-timeline-lineups .is-player-wrapper li {
828
+ line-height: var(--vbr-widget-typography-text-xs-lineheight);
829
+ }
830
+
831
+ .mjsz-vbr-gamecenter-timeline-lineups .is-player-wrapper li:nth-child(1) {
832
+ grid-area: img;
833
+ }
834
+
835
+ .mjsz-vbr-gamecenter-timeline-lineups .is-player-wrapper li:nth-child(2) {
836
+ grid-area: number;
837
+ font-style: italic;
838
+ color: var(--vbr-widget-primary-color-500);
839
+ }
840
+
841
+ .mjsz-vbr-gamecenter-timeline-lineups .is-player-wrapper li:nth-child(3) {
842
+ grid-area: name;
843
+ font-weight: 600;
844
+ color: var(--vbr-widget-primary-color-700);
845
+ overflow: hidden;
846
+ text-overflow: ellipsis;
847
+ display: -webkit-box;
848
+ -webkit-line-clamp: 2;
849
+ line-clamp: 2;
850
+ -webkit-box-orient: vertical;
851
+ }
852
+
853
+ .mjsz-vbr-gamecenter-timeline-lineups .is-player-wrapper li:nth-child(3) ul {
854
+ display: inline-flex;
855
+ gap: 0.125rem;
856
+ vertical-align: middle;
857
+ }
858
+
859
+ .mjsz-vbr-gamecenter-timeline-lineups .is-player-wrapper li:nth-child(3) svg {
860
+ display: inline-block;
861
+ padding: 0.2rem;
862
+ width: 12px;
863
+ height: 12px;
864
+ color: var(--vbr-widget-primary-color-0);
865
+ background-color: var(--vbr-widget-live-game-color);
866
+ border-radius: 100%;
867
+ }
868
+
869
+ .mjsz-vbr-gamecenter-timeline-lineups .is-player-wrapper li:nth-child(4) {
870
+ grid-area: position;
871
+ align-self: center;
872
+ font-size: var(--vbr-widget-typography-text-xs-size);
873
+ line-height: 1;
874
+ color: var(--vbr-widget-gamecenter-card-tertiary-color);
875
+ text-transform: uppercase;
876
+ }
877
+
878
+ .mjsz-vbr-gamecenter-timeline-lineups .is-player-wrapper img {
879
+ display: block;
880
+ width: 40px;
881
+ height: 40px;
882
+ border-radius: 50%;
883
+ }
884
+
885
+ .mjsz-vbr-gamecenter-timeline-team-stats .is-stat-container {
886
+ display: grid;
887
+ gap: 1rem;
888
+ margin-inline: auto;
889
+ width: min(100%, 700px);
890
+ }
891
+
892
+ .mjsz-vbr-gamecenter-timeline-game-officials .is-game-officials-container {
893
+ display: flex;
894
+ flex-direction: column;
895
+ gap: 1rem;
896
+ }
897
+
898
+ .mjsz-vbr-gamecenter-timeline-game-officials .is-game-officials-container > div {
899
+ flex: 1;
900
+ }
901
+
902
+ @container rows (width >= 768px) {
903
+
904
+ .mjsz-vbr-gamecenter-timeline-game-officials .is-game-officials-container {
905
+ flex-direction: row
906
+ }
907
+ }
908
+
909
+ .mjsz-vbr-gamecenter-timeline-data-table {
910
+ margin-block-end: 1rem;
911
+ min-width: 0;
912
+ }
913
+
914
+ .mjsz-vbr-gamecenter-timeline-data-table h2 {
915
+ padding: 8px;
916
+ font-size: var(--vbr-widget-gamecenter-team-container-title-size);
917
+ font-weight: 700;
918
+ color: var(--vbr-widget-gamecenter-team-container-title-color);
919
+ }
920
+
921
+ .mjsz-vbr-gamecenter-timeline-data-table h2:before {
922
+ display: inline-block;
923
+ content: '';
924
+ width: 0;
925
+ aspect-ratio: 1;
926
+ background-color: transparent;
927
+ border-radius: 100%;
928
+ margin-inline-end: 0.25rem;
929
+ }
930
+
931
+ .mjsz-vbr-gamecenter-timeline-data-table.is-home-team h2:before {
932
+ width: 8px;
933
+ background-color: var(--vbr-widget-gamecenter-home-team-identifier-color);
934
+ }
935
+
936
+ .mjsz-vbr-gamecenter-timeline-data-table.is-away-team h2:before {
937
+ width: 8px;
938
+ background-color: var(--vbr-widget-gamecenter-away-team-identifier-color);
939
+ }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mjsz-vbr-elements/shared",
3
3
  "private": false,
4
- "version": "2.6.1",
4
+ "version": "2.6.3",
5
5
  "author": "Ákos Stegner <akos.stegner@gmail.com>",
6
6
  "homepage": "https://api.icehockey.hu/widgets/docs/v2/",
7
7
  "type": "module",