6926fb96bc
Logo SVGs referenced by string path (/logo.svg) were cached by CDNs and browsers after deployments. Import them with Vite's ?url suffix so the build emits content-hashed filenames that force a refresh on change. LeagueRow and StandingsPreview had duplicated StatColumn, StatDivider, and rank-change indicator helpers. Extract them into a shared StatHelpers module so both pages render rank and points identically (#3 style with consistent rank-change arrows).
59 lines
1.4 KiB
TypeScript
59 lines
1.4 KiB
TypeScript
export function StatColumn({
|
|
label,
|
|
children,
|
|
}: {
|
|
label: string;
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<div className="text-right shrink-0 flex-1 sm:flex-none">
|
|
<p className="text-xs font-semibold uppercase tracking-wide text-muted-foreground">
|
|
{label}
|
|
</p>
|
|
<div className="flex items-baseline justify-end gap-1">{children}</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export function StatDivider() {
|
|
return <div className="h-8 w-px bg-border shrink-0 self-center" />;
|
|
}
|
|
|
|
export function RankChangeIndicator({ delta }: { delta: number }) {
|
|
if (delta === 0) return null;
|
|
if (delta > 0) {
|
|
return (
|
|
<span className="text-xs font-semibold text-primary" aria-label={`up ${delta}`}>
|
|
▲{delta}
|
|
</span>
|
|
);
|
|
}
|
|
return (
|
|
<span
|
|
className="text-xs font-semibold"
|
|
style={{ color: "var(--coral-accent, #ef4444)" }}
|
|
aria-label={`down ${Math.abs(delta)}`}
|
|
>
|
|
▼{Math.abs(delta)}
|
|
</span>
|
|
);
|
|
}
|
|
|
|
export function PointChangeIndicator({ delta }: { delta: number }) {
|
|
if (delta >= 0) {
|
|
return (
|
|
<span className="text-xs font-semibold text-primary" aria-label={`+${Math.round(delta)} points`}>
|
|
▲{Math.round(delta)}
|
|
</span>
|
|
);
|
|
}
|
|
return (
|
|
<span
|
|
className="text-xs font-semibold"
|
|
style={{ color: "var(--coral-accent, #ef4444)" }}
|
|
aria-label={`${Math.round(delta)} points`}
|
|
>
|
|
▼{Math.abs(Math.round(delta))}
|
|
</span>
|
|
);
|
|
}
|