@times-components/ts-components 1.145.1-82bc6796129e892c1eb22c6257c5e3809c159767.3 → 1.145.1-b32ea924749bafdf12e3e8515023538fa20e7808.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.
Files changed (70) hide show
  1. package/dist/components/opta/cricket/scorecard/OptaCricketScorecard.js +10 -2
  2. package/dist/components/opta/cricket/scorecard/__tests__/OptaCricketScorecard.test.js +94 -17
  3. package/dist/components/opta/football/opta-match-stats/shared/styles.js +1 -8
  4. package/dist/components/opta/football/opta-match-stats/summary/OptaMatchStatsSummary.js +2 -2
  5. package/dist/components/opta/football/opta-match-stats/summary/OptaMatchStatsSummary.stories.js +1 -1
  6. package/dist/components/opta/football/opta-match-stats/summary/WidgetContainer.js +4 -13
  7. package/dist/components/opta/football/summary/OptaFootballSummary.js +10 -2
  8. package/dist/components/opta/football/summary/__tests__/OptaFootballSummary.test.js +95 -18
  9. package/dist/components/opta/rugby/summary/OptaRugbySummary.js +10 -2
  10. package/dist/components/opta/rugby/summary/__tests__/OptaRugbySummary.test.js +94 -17
  11. package/dist/components/opta/utils/__tests__/emitEvent.test.js +264 -0
  12. package/dist/components/opta/utils/emitEvent.d.ts +1 -0
  13. package/dist/components/opta/utils/emitEvent.js +9 -0
  14. package/dist/index.d.ts +0 -1
  15. package/dist/index.js +1 -2
  16. package/package.json +3 -3
  17. package/rnw.js +1 -1
  18. package/src/components/opta/cricket/scorecard/OptaCricketScorecard.tsx +13 -0
  19. package/src/components/opta/cricket/scorecard/__tests__/OptaCricketScorecard.test.tsx +126 -16
  20. package/src/components/opta/cricket/scorecard/__tests__/__snapshots__/OptaCricketScorecard.test.tsx.snap +5 -6
  21. package/src/components/opta/football/opta-match-stats/commentary/__tests__/__snapshots__/OptaMatchStatsCommentary.test.tsx.snap +1 -1
  22. package/src/components/opta/football/opta-match-stats/shared/styles.ts +0 -8
  23. package/src/components/opta/football/opta-match-stats/stats-graphs/__tests__/__snapshots__/OptaMatchStatsGraphs.test.tsx.snap +1 -1
  24. package/src/components/opta/football/opta-match-stats/summary/OptaMatchStatsSummary.stories.tsx +1 -1
  25. package/src/components/opta/football/opta-match-stats/summary/OptaMatchStatsSummary.tsx +1 -1
  26. package/src/components/opta/football/opta-match-stats/summary/WidgetContainer.tsx +3 -12
  27. package/src/components/opta/football/opta-match-stats/summary/__tests__/__snapshots__/OptaMatchStatsSummary.test.tsx.snap +1 -1
  28. package/src/components/opta/football/summary/OptaFootballSummary.tsx +13 -0
  29. package/src/components/opta/football/summary/__tests__/OptaFootballSummary.test.tsx +127 -18
  30. package/src/components/opta/football/summary/__tests__/__snapshots__/OptaFootballSummary.test.tsx.snap +5 -6
  31. package/src/components/opta/rugby/summary/OptaRugbySummary.tsx +13 -0
  32. package/src/components/opta/rugby/summary/__tests__/OptaRugbySummary.test.tsx +127 -17
  33. package/src/components/opta/rugby/summary/__tests__/__snapshots__/OptaRugbySummary.test.tsx.snap +5 -6
  34. package/src/components/opta/utils/__tests__/emitEvent.test.tsx +415 -0
  35. package/src/components/opta/utils/emitEvent.ts +11 -0
  36. package/src/index.ts +0 -3
  37. package/dist/components/opta/football/opta-match-stats/matchday-live/DesktopWidget.d.ts +0 -10
  38. package/dist/components/opta/football/opta-match-stats/matchday-live/DesktopWidget.js +0 -69
  39. package/dist/components/opta/football/opta-match-stats/matchday-live/MobileWidget.d.ts +0 -12
  40. package/dist/components/opta/football/opta-match-stats/matchday-live/MobileWidget.js +0 -90
  41. package/dist/components/opta/football/opta-match-stats/matchday-live/OptaMatchStatsMatchdayLive.d.ts +0 -12
  42. package/dist/components/opta/football/opta-match-stats/matchday-live/OptaMatchStatsMatchdayLive.js +0 -10
  43. package/dist/components/opta/football/opta-match-stats/matchday-live/OptaMatchStatsMatchdayLive.stories.js +0 -24
  44. package/dist/components/opta/football/opta-match-stats/matchday-live/__tests__/MobileWidget.test.d.ts +0 -1
  45. package/dist/components/opta/football/opta-match-stats/matchday-live/__tests__/MobileWidget.test.js +0 -57
  46. package/dist/components/opta/football/opta-match-stats/matchday-live/__tests__/OptaMatchStatsMatchdayLive.test.d.ts +0 -2
  47. package/dist/components/opta/football/opta-match-stats/matchday-live/__tests__/OptaMatchStatsMatchdayLive.test.js +0 -48
  48. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/MatchdayLiveController.d.ts +0 -1
  49. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/MatchdayLiveController.js +0 -19
  50. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/NavigationWrapper.d.ts +0 -12
  51. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/NavigationWrapper.js +0 -67
  52. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/WidgetContainer.d.ts +0 -6
  53. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/WidgetContainer.js +0 -730
  54. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/__tests__/NavigationWrapper.test.d.ts +0 -1
  55. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/__tests__/NavigationWrapper.test.js +0 -33
  56. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/__tests__/WidgetContainer.test.d.ts +0 -1
  57. package/dist/components/opta/football/opta-match-stats/matchday-live/styles/__tests__/WidgetContainer.test.js +0 -36
  58. package/src/components/opta/football/opta-match-stats/matchday-live/DesktopWidget.tsx +0 -108
  59. package/src/components/opta/football/opta-match-stats/matchday-live/MobileWidget.tsx +0 -158
  60. package/src/components/opta/football/opta-match-stats/matchday-live/OptaMatchStatsMatchdayLive.stories.tsx +0 -38
  61. package/src/components/opta/football/opta-match-stats/matchday-live/OptaMatchStatsMatchdayLive.tsx +0 -23
  62. package/src/components/opta/football/opta-match-stats/matchday-live/__tests__/MobileWidget.test.tsx +0 -69
  63. package/src/components/opta/football/opta-match-stats/matchday-live/__tests__/OptaMatchStatsMatchdayLive.test.tsx +0 -61
  64. package/src/components/opta/football/opta-match-stats/matchday-live/__tests__/__snapshots__/OptaMatchStatsMatchdayLive.test.tsx.snap +0 -61
  65. package/src/components/opta/football/opta-match-stats/matchday-live/styles/MatchdayLiveController.tsx +0 -19
  66. package/src/components/opta/football/opta-match-stats/matchday-live/styles/NavigationWrapper.tsx +0 -81
  67. package/src/components/opta/football/opta-match-stats/matchday-live/styles/WidgetContainer.tsx +0 -761
  68. package/src/components/opta/football/opta-match-stats/matchday-live/styles/__tests__/NavigationWrapper.test.tsx +0 -67
  69. package/src/components/opta/football/opta-match-stats/matchday-live/styles/__tests__/WidgetContainer.test.tsx +0 -64
  70. /package/dist/components/opta/{football/opta-match-stats/matchday-live/OptaMatchStatsMatchdayLive.stories.d.ts → utils/__tests__/emitEvent.test.d.ts} +0 -0
@@ -1,730 +0,0 @@
1
- import styled from 'styled-components';
2
- import { colours, fonts } from '@times-components/ts-styleguide';
3
- import { backgroundColor, darkBackgroundColor, darkTextColor, borderColor, textColor, maxMDBreakpoint, darkBorderColor } from '../../shared/styles';
4
- export const WidgetContainer = styled.div `
5
- ${props => props.isApp &&
6
- `
7
- @media(prefers-color-scheme: dark) {
8
- background-color: ${darkBackgroundColor} !important;
9
- color: ${darkTextColor} !important;
10
- }
11
- `} .Opta-Cf.Opta-js-main {
12
- ${props => props.isApp &&
13
- `
14
- @media(prefers-color-scheme: dark) {
15
- background-color: ${darkBackgroundColor};
16
- }
17
- `};
18
- }
19
-
20
- .Opta > .Opta_W {
21
- margin-top: 0px !important;
22
- margin-bottom: 0px !important;
23
- }
24
-
25
- .Opta-Cf {
26
- display: flex;
27
- flex-direction: column;
28
-
29
- ${props => props.isApp &&
30
- `
31
- @media(prefers-color-scheme: dark) {
32
- background-color: ${darkBackgroundColor} !important;
33
- color: ${darkTextColor} !important;
34
- }
35
- `};
36
- }
37
-
38
- .Opta-Score,
39
- .Opta-Divider {
40
- display: none !important;
41
- }
42
-
43
- // Move match data to top
44
- .Opta-Matchdata {
45
- order: -1;
46
- margin-top: 8px !important;
47
- margin-bottom: 0px !important;
48
- border-top: 1px solid ${borderColor};
49
- border-bottom: 1px solid ${borderColor};
50
- background-color: ${backgroundColor} !important;
51
-
52
- dd,
53
- dt {
54
- font-family: Roboto, sans-serif;
55
- font-weight: 400;
56
- line-height: 150%;
57
- color: #333;
58
- }
59
-
60
- ${props => props.isApp &&
61
- `
62
- @media(prefers-color-scheme: dark) {
63
- background-color: ${darkBackgroundColor} !important;
64
- border-top: 1px solid ${darkBorderColor};
65
- border-bottom: 1px solid ${darkBorderColor};
66
- dd, dt {
67
- color: ${darkTextColor};
68
- }
69
- }
70
- `};
71
- }
72
-
73
- .Opta-MatchHeader {
74
- margin-bottom: 0;
75
- tr {
76
- display: flex;
77
- gap: 20px;
78
- align-items: center;
79
- padding: 16px;
80
- }
81
-
82
- .Opta-Team {
83
- font-family: Roboto, sans-serif;
84
- font-weight: 700;
85
- font-size: 20px;
86
- line-height: 150%;
87
- color: ${textColor};
88
- display: flex;
89
- align-items: center;
90
- ${props => props.isApp &&
91
- `
92
- @media(prefers-color-scheme: dark) {
93
- color: ${darkTextColor};
94
- }
95
- `};
96
-
97
- &.Opta-Home {
98
- order: 2;
99
- }
100
-
101
- &.Opta-Away {
102
- order: 5;
103
- }
104
- }
105
-
106
- .Opta-Crest {
107
- display: contents;
108
-
109
- .Opta-Image-Team img {
110
- height: 48px;
111
- width: 48px;
112
- }
113
-
114
- .Opta-TeamFormation {
115
- font-family: Roboto, sans-serif;
116
- font-weight: 400;
117
- font-size: 14px;
118
- line-height: 150%;
119
- letter-spacing: 0.08px;
120
- color: ${textColor};
121
- ${props => props.isApp &&
122
- `
123
- @media(prefers-color-scheme: dark) {
124
- color: ${darkTextColor};
125
- }
126
- `};
127
- }
128
-
129
- &:first-of-type {
130
- .Opta-Image-Team {
131
- order: 1;
132
- }
133
- .Opta-TeamFormation {
134
- order: 3;
135
- margin: 0;
136
- margin-right: auto;
137
- }
138
- }
139
-
140
- &:last-of-type {
141
- .Opta-Image-Team {
142
- order: 6;
143
- }
144
- .Opta-TeamFormation {
145
- order: 4;
146
- margin: 0;
147
- margin-left: auto;
148
- }
149
- }
150
- }
151
- }
152
-
153
- .Opta-FootballPitch {
154
- margin-inline: 16px;
155
- margin-bottom: 16px;
156
- border-radius: 8px;
157
- background: none !important;
158
- background-image: repeating-linear-gradient(
159
- 90deg,
160
- #d4e3db 0,
161
- #d4e3db 28px,
162
- #e5f0ea 28px,
163
- #e5f0ea 56px
164
- ) !important;
165
- background-size: 56px 100% !important;
166
-
167
- circle {
168
- stroke: none !important;
169
- &.Opta-Home {
170
- fill: ${props => props.homeTeamColor.light} !important;
171
- }
172
- &.Opta-Away {
173
- fill: ${props => props.awayTeamColor.light} !important;
174
- }
175
- }
176
-
177
- .Opta-JerseyNumber {
178
- font-family: ${fonts.headline};
179
- font-weight: 800;
180
- font-size: 16px;
181
- line-height: 112.99999%;
182
- transform: translateY(-1px);
183
- }
184
-
185
- .Opta-PlayerName {
186
- fill: ${textColor} !important;
187
- filter: none;
188
- font-family: Roboto, sans-serif;
189
- font-weight: 600;
190
- font-size: 13px;
191
- line-height: 100%;
192
- }
193
- }
194
-
195
- .Opta-Subs-Wrap {
196
- border-top: 1px solid ${borderColor};
197
- ${props => props.isApp &&
198
- `
199
- @media(prefers-color-scheme: dark) {
200
- border-top: 1px solid ${darkBorderColor};
201
- }
202
- `};
203
- thead {
204
- th {
205
- background-color: ${backgroundColor} !important;
206
- color: ${textColor};
207
- font-family: Roboto, sans-serif;
208
- font-weight: 500;
209
- font-size: 18px;
210
- line-height: 112.999%;
211
- padding-block: 32px;
212
- ${props => props.isApp &&
213
- `
214
- @media(prefers-color-scheme: dark) {
215
- background-color: ${darkBackgroundColor} !important;
216
- color: ${darkTextColor};
217
- }
218
- `};
219
- }
220
- }
221
-
222
- .Opta-FootballPitch-Subplayers {
223
- margin: 0;
224
- tr {
225
- display: flex;
226
- justify-content: center;
227
- }
228
- td {
229
- display: flex;
230
- flex-direction: column;
231
- height: auto;
232
-
233
- .Opta-Sub {
234
- display: flex;
235
- align-items: center;
236
-
237
- &.Opta-Home {
238
- span.Opta-Circle {
239
- border: 2px solid ${props => props.homeTeamColor.light};
240
- color: ${props => props.homeTeamColor.light};
241
- }
242
- }
243
-
244
- &.Opta-Away {
245
- span.Opta-Circle {
246
- border: 2px solid ${props => props.awayTeamColor.light};
247
- color: ${props => props.awayTeamColor.light} !important;
248
- }
249
- }
250
-
251
- ${props => props.isApp &&
252
- `
253
- @media(prefers-color-scheme: dark) {
254
- &.Opta-Home {
255
- span.Opta-Circle {
256
- border: 2px solid ${props.homeTeamColor.dark};
257
- color: ${props.homeTeamColor.dark};
258
- }
259
- }
260
-
261
- &.Opta-Away {
262
- span.Opta-Circle {
263
- border: 2px solid ${props.awayTeamColor.dark};
264
- color: ${props.awayTeamColor.dark} !important;
265
- }
266
- }
267
- }
268
- `};
269
-
270
- &.Opta-Unused {
271
- opacity: 1;
272
- }
273
-
274
- span.Opta-Circle {
275
- background-color: ${backgroundColor};
276
- font-family: ${fonts.headline};
277
- font-weight: 800;
278
- font-size: 16px;
279
- line-height: 112.99999%;
280
- margin-bottom: 0;
281
- min-width: 32px;
282
- margin-right: 12px;
283
-
284
- ${props => props.isApp &&
285
- `
286
- @media(prefers-color-scheme: dark) {
287
- background-color: ${darkBackgroundColor};
288
- }
289
- `};
290
-
291
- & + span.Opta-PlayerName {
292
- padding-right: 4px;
293
- width: max-content;
294
- font-size: 14px !important;
295
- white-space: nowrap;
296
-
297
- & + span.Opta-PlayerName {
298
- width: max-content;
299
- font-size: 14px !important;
300
- }
301
- }
302
- }
303
-
304
- span.Opta-PlayerName {
305
- font-family: Roboto, sans-serif;
306
- font-weight: 500;
307
- font-size: 14px !important;
308
- line-height: 100%;
309
- }
310
-
311
- span.Opta-MatcheventsIcons {
312
- display: flex;
313
- gap: 4px;
314
- margin-top: 0;
315
- }
316
- }
317
- }
318
- }
319
- }
320
-
321
- .Opta-Overlay {
322
- border-radius: 8px;
323
- overflow: hidden;
324
- border: none !important;
325
- .Opta-Cf {
326
- ul {
327
- background-color: #e5f0ea;
328
- margin: 0 !important;
329
- padding: 16px;
330
- display: flex !important;
331
- flex-direction: column;
332
- align-items: center;
333
- text-align: center;
334
-
335
- .Opta-Circle {
336
- font-family: ${fonts.headline} !important;
337
- font-weight: 800 !important;
338
- font-size: 20px !important;
339
- line-height: 112.99999% !important;
340
- color: ${colours.functional.white};
341
- height: 48px !important;
342
- width: 48px !important;
343
- display: flex !important;
344
- align-items: center;
345
- justify-content: center;
346
- margin-bottom: 16px !important;
347
- &.Opta-Home {
348
- background-color: ${props => props.homeTeamColor.light} !important;
349
- }
350
-
351
- &.Opta-Away {
352
- background-color: ${props => props.awayTeamColor.light} !important;
353
- }
354
-
355
- & + li {
356
- color: ${textColor};
357
- font-family: Roboto, sans-serif;
358
- font-weight: 600;
359
- font-size: 20px;
360
- line-height: 100%;
361
- margin-bottom: 16px;
362
-
363
- & + li {
364
- color: ${textColor} !important;
365
- font-family: Roboto, sans-serif;
366
- font-weight: 500;
367
- font-size: 16px;
368
- margin-bottom: 8px;
369
- }
370
- }
371
- }
372
-
373
- .Opta-MatchEvent {
374
- display: flex;
375
- align-items: center;
376
-
377
- .Opta-Icon {
378
- &.Opta-IconGoal {
379
- margin-top: 2px;
380
- }
381
- &.Opta-IconOff,
382
- &.Opta-IconOn {
383
- margin-top: 6px;
384
- }
385
- }
386
-
387
- span {
388
- color: ${textColor} !important;
389
- font-family: Roboto, sans-serif !important;
390
- font-weight: 400 !important;
391
- font-size: 16px !important;
392
- }
393
- }
394
- }
395
- }
396
-
397
- .Opta-Flex {
398
- display: grid;
399
- grid-template-rows: 1fr;
400
- padding-inline: 32px;
401
- padding-block: 32px;
402
- padding-bottom: 16px;
403
- ${props => props.isApp &&
404
- `
405
- @media(prefers-color-scheme: dark) {
406
- background-color: ${darkBackgroundColor} !important;
407
- color: ${darkTextColor} !important;
408
- }
409
- `};
410
- }
411
-
412
- .Opta-Flex-Group {
413
- display: grid;
414
- grid-template-columns: repeat(3, 1fr);
415
- gap: 16px;
416
- }
417
-
418
- .Opta-Flex-Item {
419
- display: flex !important;
420
- width: 100% !important;
421
- height: 100% !important;
422
- padding: 0 !important;
423
- padding-bottom: 16px !important;
424
- }
425
-
426
- .Opta-Stat {
427
- flex-grow: 1 !important;
428
- background-color: #e5f0ea !important;
429
- border-radius: 8px;
430
- padding-block: 16px;
431
- padding-inline: 8px;
432
- margin: 0 !important;
433
- .Opta-Value {
434
- color: ${textColor} !important;
435
- font-family: ${fonts.headline} !important;
436
- font-weight: 800;
437
- font-size: 28px;
438
- line-height: 112.999%;
439
- padding-bottom: 4px;
440
- }
441
- .Opta-Label {
442
- color: ${textColor} !important;
443
- font-family: Roboto, sans-serif !important;
444
- font-weight: 500;
445
- font-size: 16px;
446
- line-height: 112.999%;
447
- }
448
- }
449
-
450
- .Opta-Close {
451
- background: none !important;
452
- top: 16px !important;
453
- right: 16px !important;
454
- position: relative;
455
- &::before {
456
- position: absolute;
457
- top: 0;
458
- left: 0;
459
- right: 0;
460
- bottom: 0;
461
- display: flex;
462
- justify-content: center;
463
- align-items: center;
464
- content: '\\00D7';
465
- font-size: 32px;
466
- color: ${textColor};
467
- }
468
- }
469
- }
470
-
471
- // Mobile styles
472
- @media (max-width: ${maxMDBreakpoint}px) {
473
- // General Styles
474
- .Opta-Cf {
475
- display: flex;
476
- flex-direction: column;
477
- ${props => props.isApp &&
478
- `
479
- @media(prefers-color-scheme: dark) {
480
- background-color: ${darkBackgroundColor} !important;
481
- color: ${darkTextColor} !important;
482
- }
483
- `};
484
-
485
- // Formations
486
- .Opta-MatchHeader {
487
- order: 1;
488
- border-top: 1px solid ${borderColor};
489
- border-bottom: 1px solid ${borderColor};
490
- ${props => props.isApp &&
491
- `
492
- @media(prefers-color-scheme: dark) {
493
- border-top: 1px solid ${darkBorderColor};
494
- border-bottom: 1px solid ${darkBorderColor};
495
- }
496
- `};
497
-
498
- tr {
499
- justify-content: center;
500
- }
501
-
502
- .Opta-Team {
503
- // Hide team name
504
- font-size: 0;
505
- padding: 0;
506
- }
507
-
508
- .Opta-TeamFormation {
509
- font-family: Roboto, sans-serif;
510
- font-weight: 700;
511
- font-size: 16px;
512
- line-height: 150%;
513
-
514
- &::before {
515
- content: 'Formation: ';
516
- font-size: 16px;
517
- font-family: Roboto, sans-serif;
518
- font-weight: 400;
519
- line-height: 150%;
520
- }
521
-
522
- ${props => props.isApp &&
523
- `
524
- @media(prefers-color-scheme: dark) {
525
- color: ${darkTextColor};
526
- &::before {
527
- color: ${darkTextColor};
528
- }
529
- }
530
- `};
531
- }
532
- }
533
-
534
- // Pitch
535
- .Opta-FootballPitch {
536
- order: 2;
537
- margin: 0;
538
- border-radius: 0;
539
- background: none !important;
540
- background-image: repeating-linear-gradient(
541
- 0deg,
542
- #d4e3db 0,
543
- #d4e3db 56px,
544
- #e5f0ea 56px,
545
- #e5f0ea 112px
546
- ) !important;
547
-
548
- // Resize player elements
549
- .Opta-PlayerNumber {
550
- circle {
551
- stroke: #ffffff !important;
552
- stroke-width: 3px !important;
553
- r: 26px !important;
554
- border: 2px solid ${colours.functional.white} !important;
555
- -webkit-tap-highlight-color: transparent;
556
- }
557
- .Opta-JerseyNumber {
558
- font-size: 32px;
559
- -webkit-tap-highlight-color: transparent;
560
- }
561
- }
562
- .Opta-PlayerName {
563
- font-size: 18px;
564
- transform: translateY(14px);
565
- & + .Opta-PlayerName {
566
- transform: translateY(20px);
567
- & + .Opta-Icon {
568
- transform: translateY(30px);
569
- }
570
- }
571
- }
572
- .Opta-Icon {
573
- transform: translateY(20px);
574
- }
575
- }
576
-
577
- // Referee
578
- .Opta-Matchdata {
579
- order: 3;
580
- margin: 0 !important;
581
- padding: 16px !important;
582
- border-bottom: none !important;
583
- dt {
584
- font-family: Roboto, sans-serif;
585
- font-weight: 400;
586
- font-size: 16px;
587
- line-height: 150%;
588
- }
589
- dd {
590
- font-family: Roboto, sans-serif;
591
- font-weight: 700;
592
- font-size: 16px;
593
- line-height: 150%;
594
- }
595
-
596
- ${props => props.isApp &&
597
- `
598
- @media(prefers-color-scheme: dark) {
599
- background-color: ${darkBackgroundColor} !important;
600
- dt, dd {
601
- color: ${darkTextColor};
602
- }
603
- }
604
- `};
605
- }
606
-
607
- // Substitutions
608
- .Opta-Subs-Wrap {
609
- order: 4;
610
- thead {
611
- th {
612
- font-family: ${fonts.headline};
613
- font-size: 24px;
614
- font-weight: 800;
615
- padding-block: 40px;
616
- display: flex;
617
- justify-content: center;
618
- align-items: center;
619
- ${props => props.isApp &&
620
- `
621
- @media(prefers-color-scheme: dark) {
622
- color: ${darkTextColor};
623
- background-color: ${darkBackgroundColor} !important;
624
- }
625
- `};
626
- }
627
- }
628
- tbody {
629
- tr {
630
- justify-content: flex-start;
631
-
632
- td {
633
- padding: 0;
634
- }
635
-
636
- .Opta-Sub {
637
- display: flex;
638
- flex-direction: row;
639
- align-items: center;
640
- margin-top: 0;
641
- margin-left: 16px;
642
- margin-bottom: 16px;
643
-
644
- .Opta-Circle {
645
- aspect-ratio: 1 / 1;
646
- height: 30px !important;
647
- width: 30px !important;
648
- font-size: 16px !important;
649
- display: flex;
650
- justify-content: center;
651
- align-items: center;
652
- margin-right: 8px;
653
- border-width: 1px !important;
654
- padding-top: 3px;
655
- -webkit-tap-highlight-color: transparent;
656
- }
657
-
658
- .Opta-PlayerName {
659
- padding-right: 4px !important;
660
- white-space: nowrap;
661
- font-size: 16px !important;
662
- }
663
-
664
- .Opta-MatcheventsIcons {
665
- margin-top: 0;
666
- }
667
- }
668
- }
669
- }
670
- }
671
- }
672
-
673
- .Opta-Overlay {
674
- .Opta-Circle {
675
- padding-top: 3px;
676
- }
677
- }
678
-
679
- // Need to override specific styles due to higher specificity in mobile view
680
- .Opta-Subs-Wrap
681
- .Opta-FootballPitch-Subplayers
682
- td
683
- .Opta-Sub
684
- span.Opta-Circle {
685
- color: ${textColor} !important;
686
- border-color: ${textColor} !important;
687
- ${props => props.isApp &&
688
- `
689
- @media(prefers-color-scheme: dark) {
690
- color: ${darkTextColor} !important;
691
- border-color: ${darkTextColor} !important;
692
- }
693
- `};
694
- }
695
- .Opta-Subs-Wrap
696
- .Opta-FootballPitch-Subplayers
697
- td
698
- .Opta-Sub.Opta-Away
699
- span.Opta-Circle {
700
- color: ${textColor} !important;
701
- border-color: ${textColor} !important;
702
- ${props => props.isApp &&
703
- `
704
- @media(prefers-color-scheme: dark) {
705
- color: ${darkTextColor} !important;
706
- border-color: ${darkTextColor} !important;
707
- }
708
- `};
709
- }
710
-
711
- // Home team styles
712
- &.home-widget-container {
713
- .Opta-MatchHeader {
714
- .Opta-Away {
715
- display: none;
716
- }
717
- }
718
- }
719
-
720
- // Away team styles
721
- &.away-widget-container {
722
- .Opta-MatchHeader {
723
- .Opta-Home {
724
- display: none;
725
- }
726
- }
727
- }
728
- }
729
- `;
730
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiV2lkZ2V0Q29udGFpbmVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvb3B0YS9mb290YmFsbC9vcHRhLW1hdGNoLXN0YXRzL21hdGNoZGF5LWxpdmUvc3R5bGVzL1dpZGdldENvbnRhaW5lci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxNQUFNLE1BQU0sbUJBQW1CLENBQUM7QUFDdkMsT0FBTyxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsTUFBTSxpQ0FBaUMsQ0FBQztBQUVqRSxPQUFPLEVBQ0wsZUFBZSxFQUNmLG1CQUFtQixFQUNuQixhQUFhLEVBQ2IsV0FBVyxFQUNYLFNBQVMsRUFDVCxlQUFlLEVBQ2YsZUFBZSxFQUNoQixNQUFNLHFCQUFxQixDQUFDO0FBRTdCLE1BQU0sQ0FBQyxNQUFNLGVBQWUsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUl2QztJQUNFLEtBQUssQ0FBQyxFQUFFLENBQ1IsS0FBSyxDQUFDLEtBQUs7SUFDWDs7MEJBRXNCLG1CQUFtQjtlQUM5QixhQUFhOztHQUV6QjtNQUNHLEtBQUssQ0FBQyxFQUFFLENBQ1IsS0FBSyxDQUFDLEtBQUs7SUFDWDs7MEJBRW9CLG1CQUFtQjs7R0FFMUM7Ozs7Ozs7Ozs7OztNQVlHLEtBQUssQ0FBQyxFQUFFLENBQ1IsS0FBSyxDQUFDLEtBQUs7SUFDWDs7NEJBRXNCLG1CQUFtQjtpQkFDOUIsYUFBYTs7R0FFM0I7Ozs7Ozs7Ozs7Ozs7NEJBYXlCLFdBQVc7K0JBQ1IsV0FBVzt3QkFDbEIsZUFBZTs7Ozs7Ozs7OztNQVVqQyxLQUFLLENBQUMsRUFBRSxDQUNSLEtBQUssQ0FBQyxLQUFLO0lBQ1g7OzRCQUVzQixtQkFBbUI7Z0NBQ2YsZUFBZTttQ0FDWixlQUFlOzttQkFFL0IsYUFBYTs7O0tBRzNCOzs7Ozs7Ozs7Ozs7Ozs7OztlQWlCVSxTQUFTOzs7UUFHaEIsS0FBSyxDQUFDLEVBQUUsQ0FDUixLQUFL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