@times-components/ts-components 1.103.4 → 1.103.6-alpha.2

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 (6) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/components/opta/football/fixtures-ticker/styles.js +33 -5
  3. package/package.json +16 -16
  4. package/rnw.js +1 -1
  5. package/src/components/opta/football/fixtures-ticker/__tests__/__snapshots__/OptaFootballFixturesTicker.test.tsx.snap +8 -8
  6. package/src/components/opta/football/fixtures-ticker/styles.ts +32 -4
package/src/components/opta/football/fixtures-ticker/__tests__/__snapshots__/OptaFootballFixturesTicker.test.tsx.snap CHANGED
@@ -3,7 +3,7 @@
3
3
  exports[`OptaFootballFixturesTicker with flags should render correctly 1`] = `
4
4
  <DocumentFragment>
5
5
  <div
6
- class="sc-htpNat sc-ifAKCX glDXkH"
6
+ class="sc-htpNat sc-ifAKCX bAJiFM"
7
7
  />
8
8
  <div
9
9
  class="sc-bwzfXH uxFfR"
@@ -17,7 +17,7 @@ exports[`OptaFootballFixturesTicker with flags should render correctly 1`] = `
17
17
  exports[`OptaFootballFixturesTicker with flags should render correctly 2`] = `
18
18
  <DocumentFragment>
19
19
  <div
20
- class="sc-htpNat sc-ifAKCX glDXkH"
20
+ class="sc-htpNat sc-ifAKCX bAJiFM"
21
21
  >
22
22
  <div>
23
23
  Widget
@@ -29,7 +29,7 @@ exports[`OptaFootballFixturesTicker with flags should render correctly 2`] = `
29
29
  exports[`OptaFootballFixturesTicker without flags should render correctly 1`] = `
30
30
  <DocumentFragment>
31
31
  <div
32
- class="sc-htpNat sc-ifAKCX glDXkH"
32
+ class="sc-htpNat sc-ifAKCX bAJiFM"
33
33
  />
34
34
  <div
35
35
  class="sc-bwzfXH uxFfR"
@@ -43,7 +43,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly 1`] =
43
43
  exports[`OptaFootballFixturesTicker without flags should render correctly 2`] = `
44
44
  <DocumentFragment>
45
45
  <div
46
- class="sc-htpNat sc-ifAKCX glDXkH"
46
+ class="sc-htpNat sc-ifAKCX bAJiFM"
47
47
  >
48
48
  <div>
49
49
  Widget
@@ -55,7 +55,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly 2`] =
55
55
  exports[`OptaFootballFixturesTicker without flags should render correctly with fixturesPageUrl 1`] = `
56
56
  <DocumentFragment>
57
57
  <div
58
- class="sc-htpNat sc-ifAKCX glDXkH"
58
+ class="sc-htpNat sc-ifAKCX bAJiFM"
59
59
  />
60
60
  <div
61
61
  class="sc-bwzfXH uxFfR"
@@ -69,7 +69,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly with f
69
69
  exports[`OptaFootballFixturesTicker without flags should render correctly with fixturesPageUrl 2`] = `
70
70
  <DocumentFragment>
71
71
  <div
72
- class="sc-htpNat sc-ifAKCX glDXkH"
72
+ class="sc-htpNat sc-ifAKCX bAJiFM"
73
73
  >
74
74
  <div>
75
75
  Widget
@@ -81,7 +81,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly with f
81
81
  exports[`OptaFootballFixturesTicker without flags should render correctly with isApp property 1`] = `
82
82
  <DocumentFragment>
83
83
  <div
84
- class="sc-htpNat sc-ifAKCX ghnTHZ"
84
+ class="sc-htpNat sc-ifAKCX cFbGTH"
85
85
  />
86
86
  <div
87
87
  class="sc-bwzfXH uxFfR"
@@ -95,7 +95,7 @@ exports[`OptaFootballFixturesTicker without flags should render correctly with i
95
95
  exports[`OptaFootballFixturesTicker without flags should render correctly with isApp property 2`] = `
96
96
  <DocumentFragment>
97
97
  <div
98
- class="sc-htpNat sc-ifAKCX ghnTHZ"
98
+ class="sc-htpNat sc-ifAKCX cFbGTH"
99
99
  >
100
100
  <div>
101
101
  Widget
package/src/components/opta/football/fixtures-ticker/styles.ts CHANGED
@@ -43,6 +43,8 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
43
43
  isApp?: boolean;
44
44
  showButtons?: boolean;
45
45
  }>`
46
+ height: 80px !important;
47
+
46
48
  .Opta {
47
49
  font-family: Roboto !important;
48
50
  }
@@ -175,14 +177,14 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
175
177
  isApp &&
176
178
  `
177
179
  @media (prefers-color-scheme: dark) {
178
- background-color: black !important;
179
- border: 1px solid white !important;
180
+ background-color: #1D1D1B !important;
181
+ border: 1px solid #AAA !important;
180
182
 
181
183
  &:hover {
182
- background-color: #303030 !important;
184
+ border: 1px solid #333 !important;
183
185
  }
184
186
  &:active {
185
- background-color: #4f4f4f !important;
187
+ border: 1px solid #696969 !important;
186
188
  }
187
189
  &::after {
188
190
  background-position-y: -57px !important;
@@ -220,17 +222,29 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
220
222
  color: #696969 !important;
221
223
  border-start-start-radius: 4px;
222
224
  border-start-end-radius: 4px;
225
+
226
+ @media (prefers-color-scheme: dark) {
227
+ color: #E4E4E4 !important;
228
+ }
223
229
  }
224
230
 
225
231
  .Opta-timings .Opta-Time * {
226
232
  font-weight: 700;
227
233
  color: #01000d !important;
234
+
235
+ @media (prefers-color-scheme: dark) {
236
+ color: #FFF !important;
237
+ }
228
238
  }
229
239
 
230
240
  .Opta-TeamName,
231
241
  .Opta-Team-Score {
232
242
  color: #01000d !important;
233
243
  font-family: 'Roboto-Medium' !important;
244
+
245
+ @media (prefers-color-scheme: dark) {
246
+ color: #FFF !important;
247
+ }
234
248
  }
235
249
 
236
250
  .Opta-Away {
@@ -242,6 +256,10 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
242
256
  &.Opta-prematch {
243
257
  > div {
244
258
  background-color: #f5f5f5 !important;
259
+
260
+ @media (prefers-color-scheme: dark) {
261
+ background-color: #333 !important;
262
+ }
245
263
  }
246
264
  .Opta-Team-Score::after {
247
265
  content: '-';
@@ -255,6 +273,11 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
255
273
  &.Opta-result > div {
256
274
  border: 1px solid #ccc !important;
257
275
 
276
+ @media (prefers-color-scheme: dark) {
277
+ background-color: #1D1D1B !important;
278
+ border: 1px solid #333 !important;
279
+ }
280
+
258
281
  &.Opta-timings {
259
282
  border-bottom: none !important;
260
283
  }
@@ -269,6 +292,11 @@ export const WidgetContainer = styled(WidgetContainerBase)<{
269
292
  &.Opta-live > div {
270
293
  border: 1px solid #01000d !important;
271
294
 
295
+ @media (prefers-color-scheme: dark) {
296
+ background-color: #121212 !important;
297
+ border: 1px solid #E4E4E4 !important;
298
+ }
299
+
272
300
  &.Opta-timings {
273
301
  border-bottom: none !important;
274
302
  }