@sensiblestats/widget-embed 0.29.0 → 0.29.1

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/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @sensiblestats/widget-embed
2
2
 
3
+ ## 0.29.1
4
+
5
+ ### Patch Changes
6
+
7
+ - 33dacf8: Restore the live club dashboard cards to the approved mockup's sizing and detail: a larger 36px scoreline, 38px crests with a soft drop shadow, 15px team names and stat values, the timeline's football-style goal mark (was a plain dot), and the momentum wave's full 56px height (was vertically squashed at 50px). Also adds a `club-fandash-live` devserver scenario so the live phase can be previewed without a live match.
8
+
3
9
  ## 0.29.0
4
10
 
5
11
  ### Minor Changes
@@ -561,24 +561,24 @@ Error generating stack: `+o.message+`
561
561
  tokens (--ss-w-home / --ss-w-away / --ss-w-track) are defined above -- the timeline and stats
562
562
  cards reuse them. */
563
563
  .ss-w-fandash-live-top { display: flex; align-items: center; gap: 8px; }
564
- .ss-w-fandash-live-pill { display: inline-flex; flex: none; align-items: center; gap: 5px; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #fff; background: var(--ss-w-neg); border-radius: 6px; padding: 3px 7px; }
564
+ .ss-w-fandash-live-pill { display: inline-flex; flex: none; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #fff; background: var(--ss-w-neg); border-radius: 6px; padding: 3px 8px; }
565
565
  .ss-w-fandash-live-dot { width: 5px; height: 5px; border-radius: 50%; background: #fff; animation: ss-w-fandash-live-pulse 1.3s ease-in-out infinite; }
566
566
  @keyframes ss-w-fandash-live-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
567
567
  @media (prefers-reduced-motion: reduce) {
568
568
  .ss-w-fandash-live-dot { animation: none; }
569
569
  }
570
- .ss-w-fandash-live-minute { flex: none; font-size: 12px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ss-w-ink); }
570
+ .ss-w-fandash-live-minute { flex: none; font-size: 13.5px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ss-w-ink); }
571
571
  .ss-w-fandash-live-competition { margin-left: auto; font-size: 11px; font-weight: 650; color: var(--ss-w-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
572
- .ss-w-fandash-live-main { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
573
- .ss-w-fandash-live-side { display: flex; align-items: center; gap: 8px; min-width: 0; }
572
+ .ss-w-fandash-live-main { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; }
573
+ .ss-w-fandash-live-side { display: flex; align-items: center; gap: 10px; min-width: 0; }
574
574
  .ss-w-fandash-live-side--away { flex-direction: row-reverse; text-align: right; }
575
- .ss-w-fandash-live-crest { width: 30px; height: 30px; border-radius: 8px; flex: none; display: grid; place-items: center; color: #fff; font-weight: 800; font-size: 10.5px; object-fit: cover; }
575
+ .ss-w-fandash-live-crest { width: 38px; height: 38px; border-radius: 10px; flex: none; display: grid; place-items: center; color: #fff; font-weight: 800; font-size: 12.5px; object-fit: cover; box-shadow: 0 2px 6px rgba(0, 0, 0, .18); }
576
576
  .ss-w-fandash-live-crest--fallback.ss-w-fandash-live-crest--home { background: var(--ss-w-home); }
577
577
  .ss-w-fandash-live-crest--fallback.ss-w-fandash-live-crest--away { background: var(--ss-w-away); }
578
- .ss-w-fandash-live-team-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 700; color: var(--ss-w-ink); }
579
- .ss-w-fandash-live-score-main { display: flex; align-items: baseline; justify-content: center; font-size: 26px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1; white-space: nowrap; color: var(--ss-w-ink); }
580
- .ss-w-fandash-live-score-sep { color: var(--ss-w-faint); font-weight: 500; margin: 0 4px; }
581
- .ss-w-fandash-live-scorers { margin-top: 2px; display: flex; justify-content: flex-end; gap: 6px; align-items: center; font-size: 11.5px; color: var(--ss-w-faint); overflow-wrap: anywhere; }
578
+ .ss-w-fandash-live-team-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; font-weight: 700; line-height: 1.15; color: var(--ss-w-ink); }
579
+ .ss-w-fandash-live-score-main { display: flex; align-items: baseline; justify-content: center; font-size: 36px; font-weight: 850; font-variant-numeric: tabular-nums; line-height: 1; white-space: nowrap; color: var(--ss-w-ink); }
580
+ .ss-w-fandash-live-score-sep { color: var(--ss-w-faint); font-weight: 500; margin: 0 5px; }
581
+ .ss-w-fandash-live-scorers { margin-top: 12px; display: flex; justify-content: flex-end; gap: 7px; align-items: center; font-size: 12.5px; color: var(--ss-w-faint); overflow-wrap: anywhere; }
582
582
  .ss-w-fandash-live-scorers-icon { flex: none; color: var(--ss-w-away); }
583
583
 
584
584
  /* live timeline: a compact two-sided event list down a centre spine -- each club's events sit on
@@ -587,18 +587,18 @@ Error generating stack: `+o.message+`
587
587
  .ss-w-fandash-live-tl { position: relative; display: flex; flex-direction: column; gap: 6px; }
588
588
  .ss-w-fandash-live-tl::before { content: ""; position: absolute; left: 50%; top: 1px; bottom: 1px; width: 2px; background: var(--ss-w-line); transform: translateX(-1px); }
589
589
  .ss-w-fandash-live-tl-ev { display: grid; grid-template-columns: 1fr 32px 1fr; align-items: center; gap: 6px; }
590
- .ss-w-fandash-live-tl-txt { display: flex; align-items: center; gap: 6px; font-size: 12.5px; min-width: 0; }
590
+ .ss-w-fandash-live-tl-txt { display: flex; align-items: center; gap: 7px; font-size: 13px; min-width: 0; }
591
591
  .ss-w-fandash-live-tl-ev--home .ss-w-fandash-live-tl-txt { grid-column: 1; justify-content: flex-end; }
592
592
  .ss-w-fandash-live-tl-ev--away .ss-w-fandash-live-tl-txt { grid-column: 3; justify-content: flex-start; flex-direction: row-reverse; }
593
593
  .ss-w-fandash-live-tl-who { font-weight: 650; color: var(--ss-w-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
594
594
  .ss-w-fandash-live-tl-off { font-weight: 500; color: var(--ss-w-faint); }
595
595
  .ss-w-fandash-live-tl-ev--goal .ss-w-fandash-live-tl-who { font-weight: 800; }
596
- .ss-w-fandash-live-tl-badge { grid-column: 2; justify-self: center; min-width: 27px; height: 18px; padding: 0 4px; border-radius: 6px; display: grid; place-items: center; font-size: 10.5px; font-weight: 800; color: var(--ss-w-ink); background: var(--ss-w-bubble); border: 1px solid var(--ss-w-line); font-variant-numeric: tabular-nums; z-index: 1; }
596
+ .ss-w-fandash-live-tl-badge { grid-column: 2; justify-self: center; min-width: 29px; height: 19px; padding: 0 4px; border-radius: 6px; display: grid; place-items: center; font-size: 11px; font-weight: 800; color: var(--ss-w-ink); background: var(--ss-w-bubble); border: 1px solid var(--ss-w-line); font-variant-numeric: tabular-nums; z-index: 1; }
597
597
  .ss-w-fandash-live-tl-ev--goal .ss-w-fandash-live-tl-badge { background: var(--ss-w-accent); color: #fff; border-color: transparent; }
598
- .ss-w-fandash-live-tl-ico { width: 16px; height: 16px; flex: none; display: grid; place-items: center; }
598
+ .ss-w-fandash-live-tl-ico { width: 17px; height: 17px; flex: none; display: grid; place-items: center; }
599
599
  .ss-w-fandash-live-tl-ico--goal { border-radius: 50%; background: color-mix(in srgb, var(--ss-w-away) 16%, transparent); }
600
- .ss-w-fandash-live-tl-ball { width: 11px; height: 11px; border-radius: 50%; background: var(--ss-w-ink); border: 1px solid var(--ss-w-ink); }
601
- .ss-w-fandash-live-tl-card { width: 8px; height: 11px; border-radius: 2px; display: block; }
600
+ .ss-w-fandash-live-tl-ball { width: 12px; height: 12px; border-radius: 50%; background: radial-gradient(circle at 50% 42%, #fff 0 34%, transparent 36%), var(--ss-w-ink); border: 1px solid var(--ss-w-ink); }
601
+ .ss-w-fandash-live-tl-card { width: 9px; height: 12px; border-radius: 2px; display: block; }
602
602
  .ss-w-fandash-live-tl-card--yellow { background: var(--ss-w-cta); }
603
603
  .ss-w-fandash-live-tl-card--red { background: var(--ss-w-away); }
604
604
  .ss-w-fandash-live-tl-subarrows { font-size: 11px; font-weight: 900; line-height: 1; letter-spacing: -1px; color: var(--ss-w-accent); }
@@ -610,21 +610,21 @@ Error generating stack: `+o.message+`
610
610
  bar, plus an optional momentum wave (or its text fallback) and a club/opponent colour legend.
611
611
  No side signal reaches this card, so the club is always the home token and the opponent is
612
612
  always the away token -- see LiveStatsCard.tsx. */
613
- .ss-w-fandash-live-stat-rows { display: flex; flex-direction: column; gap: 14px; }
614
- .ss-w-fandash-live-stat { display: flex; flex-direction: column; gap: 6px; }
613
+ .ss-w-fandash-live-stat-rows { display: flex; flex-direction: column; gap: 15px; }
614
+ .ss-w-fandash-live-stat { display: flex; flex-direction: column; gap: 7px; }
615
615
  .ss-w-fandash-live-stat-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: baseline; gap: 8px; }
616
- .ss-w-fandash-live-stat-value { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ss-w-ink); }
616
+ .ss-w-fandash-live-stat-value { font-size: 15px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ss-w-ink); }
617
617
  .ss-w-fandash-live-stat-value--home { color: var(--ss-w-home); }
618
618
  .ss-w-fandash-live-stat-value--away { color: var(--ss-w-away); text-align: right; }
619
- .ss-w-fandash-live-stat-label { font-size: 10px; font-weight: 700; text-align: center; color: var(--ss-w-faint); text-transform: uppercase; letter-spacing: .04em; }
620
- .ss-w-fandash-live-bar { position: relative; height: 7px; border-radius: 999px; background: var(--ss-w-track); overflow: hidden; display: flex; }
619
+ .ss-w-fandash-live-stat-label { font-size: 10.5px; font-weight: 700; text-align: center; color: var(--ss-w-faint); text-transform: uppercase; letter-spacing: .04em; }
620
+ .ss-w-fandash-live-bar { position: relative; height: 8px; border-radius: 999px; background: var(--ss-w-track); overflow: hidden; display: flex; }
621
621
  .ss-w-fandash-live-bar-home { height: 100%; background: var(--ss-w-home); }
622
622
  .ss-w-fandash-live-bar-away { height: 100%; background: var(--ss-w-away); margin-left: auto; }
623
623
 
624
624
  .ss-w-fandash-live-momentum { font-size: 11.5px; font-weight: 650; color: var(--ss-w-accent); }
625
625
  .ss-w-fandash-live-mom { margin-top: 15px; padding-top: 13px; border-top: 1px solid var(--ss-w-line); }
626
626
  .ss-w-fandash-live-mom-caption { display: block; margin-bottom: 5px; font-size: 10.5px; font-weight: 600; color: var(--ss-w-faint); }
627
- .ss-w-fandash-live-mom-svg { width: 100%; height: 50px; display: block; overflow: visible; }
627
+ .ss-w-fandash-live-mom-svg { width: 100%; height: 56px; display: block; overflow: visible; }
628
628
  .ss-w-fandash-live-mom-home { fill: var(--ss-w-home); fill-opacity: .85; }
629
629
  .ss-w-fandash-live-mom-away { fill: var(--ss-w-away); fill-opacity: .85; }
630
630
  .ss-w-fandash-live-mom-line { fill: none; stroke: color-mix(in srgb, var(--ss-w-ink) 55%, transparent); stroke-width: 1.5; }