mlbserver 2026.5.27 → 2026.7.22-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 (4) hide show
  1. package/index.js +1089 -396
  2. package/package.json +1 -1
  3. package/session.js +15 -0
  4. package/style.css +1119 -0
package/style.css ADDED
@@ -0,0 +1,1119 @@
1
+ :root {
2
+ --card-width: 320px;
3
+ --team-indent: calc(var(--card-width) - (var(--card-width) / 1.65));
4
+ --color-bg: #0e0e0e;
5
+ --color-panel: #1a1c21;
6
+ --color-panel-header: #202c37;
7
+ --color-panel-border: #263340;
8
+ --color-card-border: #292b2e;
9
+ --color-info-bg: #22262d;
10
+ --color-info-border: #3a4654;
11
+ --color-text: LightGray;
12
+ --color-text-strong: #d7d9dc;
13
+ --color-text-muted: #8f969f;
14
+ --color-accent: goldenrod;
15
+ --color-accent-hover: #e4bd55;
16
+ --color-disabled: darkgray;
17
+ --color-pill-accent-bg: rgba(218, 165, 32, 0.08);
18
+ --color-pill-accent-bg-hover: rgba(218, 165, 32, 0.14);
19
+ --color-pill-accent-border: rgba(218, 165, 32, 0.6);
20
+ --level-mlb: #d6aa34;
21
+ --level-mlb-bg: rgba(214, 170, 52, 0.1);
22
+ --level-aaa: #58a6ff;
23
+ --level-aaa-bg: rgba(88, 166, 255, 0.12);
24
+ --level-aa: #c084fc;
25
+ --level-aa-bg: rgba(192, 132, 252, 0.12);
26
+ --level-a-plus: #2dd4bf;
27
+ --level-a-plus-bg: rgba(45, 212, 191, 0.12);
28
+ --level-a: #86efac;
29
+ --level-a-bg: rgba(134, 239, 172, 0.12);
30
+ --level-winter: #fb923c;
31
+ --level-winter-bg: rgba(251, 146, 60, 0.12);
32
+ }
33
+
34
+ html,
35
+ body {
36
+ background-color: var(--color-bg);
37
+ color: var(--color-text);
38
+ font-family: Verdana, Tahoma, Roboto, sans-serif;
39
+
40
+ }
41
+
42
+ .modal {
43
+ display: none;
44
+ position: fixed;
45
+ z-index: 9999;
46
+ inset: 0;
47
+ width: 100%;
48
+ height: 100%;
49
+ background-color: rgba(0, 0, 0, 0.4);
50
+ align-items: center;
51
+ justify-content: center;
52
+ }
53
+
54
+ .modal-content {
55
+ background-color: #fefefe;
56
+ border: 1px solid #888;
57
+ overflow-y: auto;
58
+ color: black;
59
+ box-sizing: border-box;
60
+ padding: 2px;
61
+ max-height: 90dvh;
62
+ border-radius: 7px;
63
+ }
64
+
65
+ h1 {
66
+ margin: 0;
67
+ color: var(--color-accent);
68
+ }
69
+
70
+ .tinytext {
71
+ font-size: 0.8rem;
72
+ }
73
+
74
+ #highlights {
75
+ overflow-y: auto;
76
+ }
77
+
78
+ #highlights a {
79
+ color: black;
80
+ }
81
+
82
+ .close {
83
+ color: black;
84
+ float: right;
85
+ font-size: 28px;
86
+ font-weight: bold;
87
+ padding-right: 5px;
88
+ cursor: pointer;
89
+ }
90
+
91
+ #highlights a:hover,
92
+ #highlights a:focus,
93
+ .close:hover,
94
+ .close:focus {
95
+ color: gray;
96
+ text-decoration: none;
97
+ cursor: pointer;
98
+ }
99
+
100
+ .section {
101
+ margin: 20px 10px;
102
+ display: flex;
103
+ flex-wrap: wrap;
104
+ justify-content: center;
105
+ align-items: stretch;
106
+ align-content: stretch;
107
+ max-width: 100dvw;
108
+ gap: 30px 20px;
109
+ }
110
+
111
+ .gameContent {
112
+ padding: 0 5px 0 15px;
113
+ margin: 5px 0;
114
+
115
+ }
116
+
117
+ .cardContainer {
118
+ width: var(--card-width);
119
+ display: grid;
120
+ grid-template-rows: auto 1fr auto;
121
+ padding: 5px 10px;
122
+ border-radius: 3px;
123
+ border-top: 1px solid var(--color-card-border);
124
+ border-right: 1px solid var(--color-card-border);
125
+ border-bottom: 1px solid var(--color-card-border);
126
+ border-left: 2px solid var(--color-accent)
127
+ }
128
+
129
+ .cardContainer.level-mlb,
130
+ .cardContainer.level-aaa,
131
+ .cardContainer.level-aa,
132
+ .cardContainer.level-a,
133
+ .cardContainer.level-a-plus,
134
+ .cardContainer.level-winter {
135
+ border-left: 2px solid var(--level-color) !important;
136
+ }
137
+
138
+ .backgroundRegular {
139
+ background-color: var(--color-panel);
140
+ }
141
+
142
+ .backgroundBlackout {
143
+ background-color: var(--color-panel);
144
+ opacity: 0.8;
145
+ background: repeating-linear-gradient(45deg, #f7446230 0, #f7446230 20px, var(--color-panel) 20px, var(--color-panel)40px);
146
+ }
147
+
148
+ .menuContainer {
149
+ background-color: var(--color-panel);
150
+ display: grid;
151
+ grid-template-rows: auto 1fr auto;
152
+ border-radius: 3px;
153
+ border: 1px solid var(--color-panel-border);
154
+ width: 80vw;
155
+ }
156
+
157
+
158
+ .cardHeader {
159
+ font-size: 0.78rem;
160
+ padding: 2px 0;
161
+ color: var(--color-accent);
162
+ align-items: center;
163
+ }
164
+
165
+ .cardMenuHeader {
166
+ background-color: var(--color-panel-header);
167
+ font-size: 0.75rem;
168
+ font-weight: bold;
169
+ text-align: center;
170
+ padding: 2px 0;
171
+ }
172
+
173
+ .menuContent {
174
+ margin: 10px;
175
+ }
176
+
177
+ .settingsContainer {
178
+ max-width: 980px;
179
+ }
180
+
181
+ .settingsContent {
182
+ display: grid;
183
+ gap: 16px;
184
+ }
185
+
186
+ .settingsGroup {
187
+ display: grid;
188
+ gap: 6px;
189
+ padding: 2px;
190
+ }
191
+
192
+ .settingRow {
193
+ display: grid;
194
+ grid-template-columns: minmax(120px, 160px) 1fr;
195
+ gap: 5px 12px;
196
+ align-items: center;
197
+ padding: 0;
198
+ }
199
+
200
+ .settingLabel {
201
+ color: var(--color-text-strong);
202
+ font-size: 0.86rem;
203
+ font-weight: bold;
204
+ }
205
+
206
+ .settingControl {
207
+ display: flex;
208
+ flex-wrap: wrap;
209
+ align-items: center;
210
+ gap: 5px;
211
+ }
212
+
213
+ .settingInlineLabel {
214
+ color: var(--color-text-strong);
215
+ font-size: 0.86rem;
216
+ font-weight: bold;
217
+ }
218
+
219
+ .settingsDivider {
220
+ color: var(--color-text-muted);
221
+ font-size: 0.78rem;
222
+ margin: 0 3px;
223
+ }
224
+
225
+ .settingsMeta {
226
+ color: var(--color-text-muted);
227
+ font-size: 0.78rem;
228
+ }
229
+
230
+ .settingsDisclosure {
231
+ margin-top: 4px;
232
+ }
233
+
234
+ .settingsDisclosure summary {
235
+ align-items: center;
236
+ background: var(--color-pill-accent-bg);
237
+ border-radius: 4px;
238
+ color: var(--color-accent);
239
+ cursor: pointer;
240
+ display: inline-flex;
241
+ font-size: 0.82rem;
242
+ font-weight: bold;
243
+ gap: 7px;
244
+ list-style: none;
245
+ padding: 5px 8px;
246
+ user-select: none;
247
+ }
248
+
249
+ .settingsDisclosure summary::-webkit-details-marker {
250
+ display: none;
251
+ }
252
+
253
+ .settingsDisclosure summary::after {
254
+ color: var(--color-text-muted);
255
+ content: "+";
256
+ font-size: 1rem;
257
+ line-height: 1;
258
+ }
259
+
260
+ .settingsDisclosure[open] summary::after {
261
+ content: "-";
262
+ }
263
+
264
+ .settingsDisclosure summary:hover {
265
+ background: var(--color-pill-accent-bg-hover);
266
+ color: var(--color-accent-hover);
267
+ }
268
+
269
+ .settingsDisclosureContent {
270
+ display: grid;
271
+ gap: 5px;
272
+ padding-top: 6px;
273
+ }
274
+
275
+ .channelContent {
276
+ display: grid;
277
+ gap: 10px;
278
+ }
279
+
280
+ .channelScanMode,
281
+ .channelRow {
282
+ display: grid;
283
+ grid-template-columns: minmax(180px, 290px) 1fr;
284
+ gap: 8px 16px;
285
+ align-items: center;
286
+ }
287
+
288
+ .channelScanMode>div:first-child,
289
+ .channelRow>div:first-child {
290
+ display: contents;
291
+ }
292
+
293
+ .channelLabel {
294
+ display: flex;
295
+ flex-wrap: wrap;
296
+ align-items: center;
297
+ color: var(--color-text-strong);
298
+ font-size: 0.86rem;
299
+ font-weight: bold;
300
+ }
301
+
302
+ .channelRow .infoContainer,
303
+ .channelScanMode .infoContainer {
304
+ grid-column: 1 / -1;
305
+ order: 2;
306
+ }
307
+
308
+ .channelLinks {
309
+ display: flex;
310
+ flex-wrap: wrap;
311
+ align-items: center;
312
+ gap: 6px;
313
+ order: 1;
314
+ }
315
+
316
+ .channelLink {
317
+ border: 1px solid var(--color-pill-accent-border);
318
+ border-radius: 4px;
319
+ color: var(--color-accent);
320
+ font-size: 0.8rem;
321
+ font-weight: bold;
322
+ padding: 3px 7px;
323
+ text-decoration: none;
324
+ white-space: nowrap;
325
+ }
326
+
327
+ .channelLink:hover,
328
+ .channelLink:focus {
329
+ background: var(--color-pill-accent-bg-hover);
330
+ color: var(--color-accent-hover);
331
+ }
332
+
333
+ .channelNote {
334
+ color: var(--color-text-muted);
335
+ font-size: 0.78rem;
336
+ }
337
+
338
+ .multiviewContent {
339
+ display: grid;
340
+ gap: 10px;
341
+ }
342
+
343
+ .multiviewHeader {
344
+ display: flex;
345
+ flex-wrap: wrap;
346
+ justify-content: space-between;
347
+ align-items: center;
348
+ gap: 8px 16px;
349
+ }
350
+
351
+ .multiviewActions {
352
+ display: flex;
353
+ flex-wrap: wrap;
354
+ gap: 6px;
355
+ }
356
+
357
+ .multiviewInfoButton {
358
+ display: inline-flex;
359
+ align-items: center;
360
+ justify-content: center;
361
+ vertical-align: text-bottom;
362
+ }
363
+
364
+ .multiviewAction {
365
+ border: 1px solid var(--color-pill-accent-border);
366
+ border-radius: 4px;
367
+ color: var(--color-accent);
368
+ font-size: 0.86rem;
369
+ font-weight: bold;
370
+ min-width: 5.5rem;
371
+ padding: 4px 10px;
372
+ text-align: center;
373
+ text-decoration: none;
374
+ }
375
+
376
+ .multiviewActionPrimary {
377
+ background: var(--color-pill-accent-bg);
378
+ }
379
+
380
+ #stopmultiview {
381
+ border-color: var(--color-info-border);
382
+ color: var(--color-text-muted);
383
+ }
384
+
385
+ .multiviewAction:hover,
386
+ .multiviewAction:focus {
387
+ background: var(--color-pill-accent-bg-hover);
388
+ color: var(--color-accent-hover);
389
+ }
390
+
391
+ #stopmultiview:hover,
392
+ #stopmultiview:focus {
393
+ border-color: var(--color-pill-accent-border);
394
+ }
395
+
396
+ .multiviewIntro {
397
+ display: flex;
398
+ align-items: center;
399
+ gap: 10px;
400
+ color: var(--color-text-muted);
401
+ font-size: 0.82rem;
402
+ }
403
+
404
+ .multiviewStreamRow {
405
+ display: grid;
406
+ grid-template-columns: 1.5rem minmax(0, 1fr) 4rem;
407
+ gap: 6px;
408
+ align-items: center;
409
+ }
410
+
411
+ .multiviewStreamRow label {
412
+ color: var(--color-text-strong);
413
+ font-size: 0.86rem;
414
+ font-weight: bold;
415
+ }
416
+
417
+ .multiviewStreamRow textarea {
418
+ width: 100%;
419
+ box-sizing: border-box;
420
+ }
421
+
422
+ .multiviewStreamRow input {
423
+ width: 100%;
424
+ box-sizing: border-box;
425
+ font-size: 0.8em;
426
+ }
427
+
428
+ .multiviewAudioRow {
429
+ display: grid;
430
+ grid-template-columns: minmax(0, 1fr) 4rem;
431
+ gap: 6px;
432
+ align-items: center;
433
+ }
434
+
435
+ .multiviewAudioRow textarea {
436
+ width: 100%;
437
+ box-sizing: border-box;
438
+ }
439
+
440
+ .multiviewAudioRow input {
441
+ width: 100%;
442
+ box-sizing: border-box;
443
+ font-size: 0.8em;
444
+ }
445
+
446
+ .multiviewWatchLinks {
447
+ display: flex;
448
+ flex-wrap: wrap;
449
+ align-items: center;
450
+ gap: 6px;
451
+ }
452
+
453
+ .streamFinderContent {
454
+ display: grid;
455
+ gap: 12px;
456
+ }
457
+
458
+ .streamFinderSteps {
459
+ display: grid;
460
+ gap: 10px;
461
+ }
462
+
463
+ .streamFinderStep {
464
+ display: grid;
465
+ grid-template-columns: 1.6rem 1fr;
466
+ gap: 10px;
467
+ align-items: start;
468
+ }
469
+
470
+ .streamFinderStepNumber {
471
+ display: inline-flex;
472
+ align-items: center;
473
+ justify-content: center;
474
+ width: 1.4rem;
475
+ height: 1.4rem;
476
+ border: 1px solid var(--color-pill-accent-border);
477
+ border-radius: 50%;
478
+ color: var(--color-accent);
479
+ font-size: 0.78rem;
480
+ font-weight: bold;
481
+ }
482
+
483
+ .streamFinderStepContent {
484
+ display: grid;
485
+ justify-items: start;
486
+ gap: 5px;
487
+ }
488
+
489
+ .streamFinderStepTitle {
490
+ color: var(--color-text-strong);
491
+ font-size: 0.86rem;
492
+ font-weight: bold;
493
+ }
494
+
495
+ .streamFinderStepText {
496
+ color: var(--color-text-muted);
497
+ font-size: 0.82rem;
498
+ }
499
+
500
+ .infoContainer {
501
+ font-size: small;
502
+ max-height: 0;
503
+ overflow: hidden;
504
+ transition: max-height 0.2s ease-out;
505
+ }
506
+
507
+ .infoContent {
508
+ margin: 10px 0 12px 0;
509
+ padding: 12px 14px 12px 14px;
510
+ background: var(--color-info-bg);
511
+ border: 1px solid var(--color-info-border);
512
+ border-left: 4px solid var(--color-accent);
513
+ border-radius: 8px;
514
+ color: var(--color-text-strong);
515
+ font-size: 0.92rem;
516
+ line-height: 1.45;
517
+ }
518
+
519
+ .infoContainer .infoContent {
520
+ padding: 15px;
521
+ }
522
+
523
+ .infoContainer p {
524
+ margin-top: 2px;
525
+ }
526
+
527
+ .videos {
528
+ min-height: 0.9rem;
529
+ text-align: center;
530
+ font-weight: bold;
531
+ border-radius: 5px;
532
+ font-size: 0.7rem;
533
+ padding: 2px;
534
+ color: var(--color-accent);
535
+ border: 1px solid var(--color-accent);
536
+ margin: 2px;
537
+ display: inline-flex;
538
+ align-items: center;
539
+ gap: 5px;
540
+ white-space: nowrap;
541
+ }
542
+
543
+ .regularButton {
544
+ width: 90px;
545
+ }
546
+
547
+ .shortButton {
548
+ width: 40px;
549
+ }
550
+
551
+ .videos a,
552
+ .streamAction {
553
+ color: var(--color-accent);
554
+ text-decoration: none;
555
+ }
556
+
557
+ .streamAction {
558
+ border: 1px solid var(--color-accent);
559
+ border-radius: 5px;
560
+ display: inline-flex;
561
+ align-items: center;
562
+ justify-content: center;
563
+ font-size: 0.7rem;
564
+ font-weight: bold;
565
+ min-height: 0.9rem;
566
+ margin: 2px;
567
+ padding: 2px 6px;
568
+ white-space: nowrap;
569
+ }
570
+
571
+ .streamAction:hover,
572
+ .streamAction:focus,
573
+ .videos a:hover,
574
+ .videos a:focus {
575
+ color: var(--color-accent-hover);
576
+ }
577
+
578
+ .streamActionInactive,
579
+ .streamActionInactive:hover,
580
+ .streamActionInactive:focus {
581
+ border-color: var(--color-disabled);
582
+ color: var(--color-disabled);
583
+ cursor: not-allowed;
584
+ }
585
+
586
+ .prePostIndicator {
587
+ display: inline-flex;
588
+ align-items: center;
589
+ isolation: isolate;
590
+ margin-left: 4px;
591
+ vertical-align: middle;
592
+ }
593
+
594
+ .prePostCircle {
595
+ width: 0.5rem;
596
+ height: 0.5rem;
597
+ background: var(--color-panel);
598
+ border: 1px solid var(--color-accent);
599
+ border-radius: 50%;
600
+ box-sizing: border-box;
601
+ box-shadow: 0 0 0 1px var(--color-panel);
602
+ }
603
+
604
+ .prePostCircle + .prePostCircle {
605
+ margin-left: -0.1rem;
606
+ }
607
+
608
+ .prePostCircleActive {
609
+ background: var(--color-accent);
610
+ position: relative;
611
+ z-index: 1;
612
+ }
613
+
614
+ .prePostCircleInactive {
615
+ border-color: var(--color-disabled);
616
+ opacity: 0.45;
617
+ }
618
+
619
+ .prePostLegend {
620
+ color: var(--color-text-muted);
621
+ display: flex;
622
+ flex-wrap: wrap;
623
+ font-size: 0.72rem;
624
+ gap: 8px;
625
+ margin: 2px 0 6px;
626
+ }
627
+
628
+ .prePostLegend span {
629
+ display: inline-flex;
630
+ align-items: center;
631
+ }
632
+
633
+ .prePostLegendIndicator {
634
+ margin-left: 0;
635
+ margin-right: 4px;
636
+ }
637
+
638
+ .videosInactive {
639
+ min-height: 0.9rem;
640
+ text-align: center;
641
+ font-weight: bold;
642
+ border-radius: 5px;
643
+ font-size: 0.7rem;
644
+ padding: 2px;
645
+ color: var(--color-disabled);
646
+ border: 1px solid var(--color-disabled);
647
+ margin: 2px;
648
+ display: inline-flex;
649
+ align-items: center;
650
+ gap: 5px;
651
+ white-space: nowrap;
652
+ cursor: not-allowed;
653
+ }
654
+
655
+ .time {
656
+ display: inline-flex;
657
+ align-items: center;
658
+ gap: 5px;
659
+ min-height: 1rem;
660
+ line-height: 1;
661
+ white-space: nowrap;
662
+ color: var(--color-text);
663
+ }
664
+
665
+ .info {
666
+ width: 1rem;
667
+ height: 1rem;
668
+ font-weight: bold;
669
+ text-align: center;
670
+ border: 1px solid var(--color-accent);
671
+ line-height: 1rem;
672
+ border-radius: 1rem;
673
+ color: var(--color-accent);
674
+ cursor: pointer;
675
+ user-select: none;
676
+ }
677
+
678
+ .infoPadding {
679
+ margin: 0 5px 0 5px;
680
+ }
681
+
682
+ .subscriptionStream {
683
+ display: flex;
684
+ align-items: center;
685
+ font-size: 0.9rem;
686
+ }
687
+
688
+ .subscriptionStream span {
689
+ display: flex;
690
+ align-items: center;
691
+ }
692
+
693
+ .subscriptionLabel {
694
+ display: inline-flex;
695
+ align-items: center;
696
+ gap: 2px;
697
+ }
698
+
699
+ .subscriptionLabel .info {
700
+ display: inline-flex;
701
+ align-items: center;
702
+ justify-content: center;
703
+ }
704
+
705
+ .is-flex {
706
+ display: flex;
707
+ flex-wrap: wrap;
708
+ align-items: center;
709
+ }
710
+
711
+ .flex-between {
712
+ display: flex;
713
+ justify-content: space-between;
714
+ align-items: center;
715
+ }
716
+
717
+ .flex-center {
718
+ display: flex;
719
+ justify-content: center;
720
+ }
721
+
722
+ .cardTags {
723
+ display: flex;
724
+ flex-wrap: wrap;
725
+ justify-content: flex-end;
726
+ align-items: center;
727
+ gap: 4px;
728
+ }
729
+
730
+ .row {
731
+ display: flex;
732
+ font-size: 1rem;
733
+ color: GhostWhite;
734
+ align-items: center;
735
+ justify-content: space-between;
736
+ margin-top: 3px;
737
+ }
738
+
739
+ .MLB {
740
+ display: flex;
741
+ font-size: 1rem;
742
+ color: GhostWhite;
743
+ align-items: center;
744
+ justify-content: space-between;
745
+ margin-top: 3px;
746
+ }
747
+
748
+
749
+ .MLB~.MLB {
750
+ margin-top: 14.2px;
751
+ }
752
+
753
+ .AAA {
754
+ display: flex;
755
+ font-size: 1rem;
756
+ color: GhostWhite;
757
+ align-items: center;
758
+ justify-content: space-between;
759
+ margin-top: 3px;
760
+ }
761
+
762
+ .team {
763
+ display: flex;
764
+ align-items: baseline;
765
+ }
766
+
767
+ .teamName {
768
+ min-width: 140px;
769
+ max-width: 250px;
770
+ font-weight: bold;
771
+ font-size: 0.9rem;
772
+ }
773
+
774
+ .pitcher {
775
+ width: var(--team-indent);
776
+ font-size: 0.75rem;
777
+ color: #bdbdbd;
778
+ }
779
+
780
+ .parentOrg {
781
+ font-size: 0.65rem;
782
+ line-height: 0.7rem;
783
+ color: rgba(211, 211, 211, 0.50);
784
+ margin-left: var(--team-indent);
785
+ }
786
+
787
+ .score {
788
+ font-weight: bold;
789
+ }
790
+
791
+ .streamContent {
792
+ font-size: 0.8rem;
793
+ display: flex;
794
+ align-items: center;
795
+ justify-content: space-between;
796
+
797
+ }
798
+
799
+ .tag {
800
+ display: inline-flex;
801
+ align-items: center;
802
+ justify-content: center;
803
+ text-align: center;
804
+ min-width: 30px;
805
+ min-height: 1rem;
806
+ border-radius: 5px;
807
+ font-size: 0.7rem;
808
+ line-height: 1;
809
+ padding: 0 2px;
810
+ }
811
+
812
+ span.innings {
813
+ min-width: 30px;
814
+ }
815
+
816
+ .level {
817
+ color: var(--level-color, var(--color-accent));
818
+ background-color: var(--level-bg, var(--color-pill-accent-bg));
819
+ border: 1px solid var(--level-color, var(--color-accent));
820
+ }
821
+
822
+ .level-mlb {
823
+ --level-color: var(--level-mlb);
824
+ --level-bg: var(--level-mlb-bg);
825
+ }
826
+
827
+ .level-aaa {
828
+ --level-color: var(--level-aaa);
829
+ --level-bg: var(--level-aaa-bg);
830
+ }
831
+
832
+ .level-aa {
833
+ --level-color: var(--level-aa);
834
+ --level-bg: var(--level-aa-bg);
835
+ }
836
+
837
+ .level-a-plus {
838
+ --level-color: var(--level-a-plus);
839
+ --level-bg: var(--level-a-plus-bg);
840
+ }
841
+
842
+ .level-a {
843
+ --level-color: var(--level-a);
844
+ --level-bg: var(--level-a-bg);
845
+ }
846
+
847
+ .level-winter {
848
+ --level-color: var(--level-winter);
849
+ --level-bg: var(--level-winter-bg);
850
+ }
851
+
852
+
853
+ /* limited innings game */
854
+ .innings {
855
+ color: #ecc6ff;
856
+ border: 1px solid #ecc6ff;
857
+ }
858
+
859
+ /* for double headers: G1 or G2 */
860
+ .gameno {
861
+ color: #b4dcff;
862
+ border: 1px solid #b4dcff;
863
+ }
864
+
865
+ /* schedule between days: Makeup, resumed, postponed games */
866
+ .schedule {
867
+ color: #ffcbae;
868
+ border: 1px solid #ffcbae;
869
+ }
870
+
871
+ /* Perfect game or no-hitter */
872
+ .noteworthy {
873
+ color: rgb(255, 209, 43);
874
+ border: 1px solid rgb(255, 209, 43);
875
+ }
876
+
877
+ .blackout {
878
+ color: rgb(255, 87, 87);
879
+ border: 1px solid rgb(255, 87, 87);
880
+ }
881
+
882
+ .favorite {
883
+ color: rgb(255, 209, 43);
884
+ border: 1px solid rgb(255, 209, 43);
885
+ }
886
+
887
+ .freegame {
888
+ color: rgb(121, 255, 87);
889
+ border: 1px solid rgb(121, 255, 87);
890
+ }
891
+
892
+ .blackoutstation {
893
+ text-decoration: line-through;
894
+ }
895
+
896
+ .is-invisible {
897
+ display: none;
898
+ }
899
+
900
+ .is-invisible>span {
901
+ display: none;
902
+ }
903
+
904
+ a {
905
+ color: var(--color-accent);
906
+ }
907
+
908
+ input[type="checkbox"] {
909
+ opacity: 0.85;
910
+ }
911
+
912
+ button {
913
+ color: black;
914
+ background-color: lightgray;
915
+ min-width: 3rem;
916
+ min-height: 1.5rem;
917
+ border: none;
918
+ padding: 1px 5px 1px 5px;
919
+ text-align: center;
920
+ text-decoration: none;
921
+ display: inline-block;
922
+ font-size: 0.9rem;
923
+ border-radius: 4px;
924
+ cursor: pointer;
925
+ margin: 2px;
926
+ }
927
+
928
+ button.default {
929
+ color: black;
930
+ background-color: var(--color-accent);
931
+ font-weight: bold;
932
+ }
933
+
934
+ textarea {
935
+ width: 70%;
936
+ height: 2rem;
937
+ margin: 2px;
938
+ background-color: var(--color-bg);
939
+ color: var(--color-text);
940
+ border: 1px solid var(--color-disabled);
941
+ }
942
+
943
+ .tooltip {
944
+ position: relative;
945
+ display: inline-flex;
946
+ align-items: center;
947
+ cursor: help;
948
+ }
949
+
950
+ .tooltip .tooltiptext {
951
+ font-size: 0.75rem;
952
+ visibility: hidden;
953
+ background-color: rgb(0, 0, 0);
954
+ border: 1px solid grey;
955
+ color: white;
956
+ text-align: center;
957
+ padding: 5px;
958
+ border-radius: 5px;
959
+ position: absolute;
960
+ z-index: 1;
961
+ margin-top: 0.25em;
962
+ min-width: 80px;
963
+ right: -50%;
964
+ top: 1rem;
965
+ }
966
+
967
+ /* tooltip positioning */
968
+ .right {
969
+ left: 20%;
970
+ }
971
+
972
+ /* tooltip positioning */
973
+ .left {
974
+ right: 20%;
975
+ }
976
+
977
+ .tooltip:hover .tooltiptext {
978
+ visibility: visible;
979
+ }
980
+
981
+ /* multiview grid */
982
+ .square-grid {
983
+ display: grid;
984
+ grid-template-columns: 1fr 1fr;
985
+ grid-template-rows: 1fr 1fr;
986
+ width: 100px;
987
+ height: 50px;
988
+ border: 1px solid darkgray;
989
+ }
990
+
991
+ .square-grid div {
992
+ display: flex;
993
+ align-items: center;
994
+ justify-content: center;
995
+ border: 1px solid darkgray;
996
+ box-sizing: border-box;
997
+ }
998
+
999
+ #snackbar {
1000
+ visibility: hidden;
1001
+ min-width: 250px;
1002
+ margin-left: -125px;
1003
+ background-color: #3fc3ee;
1004
+ color: #000000;
1005
+ text-align: center;
1006
+ border-radius: 2px;
1007
+ padding: 16px;
1008
+ position: fixed;
1009
+ z-index: 1;
1010
+ left: 50%;
1011
+ bottom: 20%;
1012
+ }
1013
+
1014
+ #snackbar.show {
1015
+ visibility: visible;
1016
+ -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
1017
+ animation: fadein 0.5s, fadeout 0.5s 2.5s;
1018
+ }
1019
+
1020
+ @-webkit-keyframes fadein {
1021
+ from {
1022
+ bottom: 0;
1023
+ opacity: 0;
1024
+ }
1025
+
1026
+ to {
1027
+ bottom: 20%;
1028
+ opacity: 1;
1029
+ }
1030
+ }
1031
+
1032
+ @keyframes fadein {
1033
+ from {
1034
+ bottom: 0;
1035
+ opacity: 0;
1036
+ }
1037
+
1038
+ to {
1039
+ bottom: 20%;
1040
+ opacity: 1;
1041
+ }
1042
+ }
1043
+
1044
+ @-webkit-keyframes fadeout {
1045
+ from {
1046
+ bottom: 20%;
1047
+ opacity: 1;
1048
+ }
1049
+
1050
+ to {
1051
+ bottom: 0;
1052
+ opacity: 0;
1053
+ }
1054
+ }
1055
+
1056
+ @keyframes fadeout {
1057
+ from {
1058
+ bottom: 20%;
1059
+ opacity: 1;
1060
+ }
1061
+
1062
+ to {
1063
+ bottom: 0;
1064
+ opacity: 0;
1065
+ }
1066
+ }
1067
+
1068
+ @media screen and (max-width: 480px) {
1069
+
1070
+ :root {
1071
+ --team-indent: 120px;
1072
+ }
1073
+
1074
+ html,
1075
+ body {
1076
+ margin: 0;
1077
+ }
1078
+
1079
+ .modal {
1080
+ align-items: stretch;
1081
+ justify-content: stretch;
1082
+ }
1083
+
1084
+ .modal-content {
1085
+ max-width: 100vw;
1086
+ border-radius: 0;
1087
+ overflow-y: auto;
1088
+ }
1089
+
1090
+ .cardContainer {
1091
+ width: 90vw;
1092
+ }
1093
+
1094
+ .menuContainer {
1095
+ width: 90vw;
1096
+ }
1097
+
1098
+ .settingRow {
1099
+ grid-template-columns: 1fr;
1100
+ }
1101
+
1102
+ .channelScanMode,
1103
+ .channelRow {
1104
+ grid-template-columns: 1fr;
1105
+ }
1106
+
1107
+ .infoContent {
1108
+ width: 70vw;
1109
+ }
1110
+
1111
+ .teamName {
1112
+ min-width: 140px;
1113
+ }
1114
+
1115
+ .pitcher {
1116
+ width: var(--team-indent);
1117
+ }
1118
+
1119
+ }