diff --git a/src/components/RatingHistogram.tsx b/src/components/RatingHistogram.tsx index 433f07f..db57285 100644 --- a/src/components/RatingHistogram.tsx +++ b/src/components/RatingHistogram.tsx @@ -180,7 +180,13 @@ export default function RatingHistogram({ marginBottom: "12px", }} > - + {rating.toFixed(1)}
@@ -192,6 +198,7 @@ export default function RatingHistogram({ marginLeft: "auto", color: "var(--muted)", fontSize: "0.75rem", + fontVariantNumeric: "tabular-nums", }} > {total} {total === 1 ? "review" : "reviews"} @@ -220,6 +227,7 @@ export default function RatingHistogram({ textAlign: "right", color: "var(--text)", whiteSpace: "nowrap", + fontVariantNumeric: "tabular-nums", }} > {star} ★ @@ -248,6 +256,7 @@ export default function RatingHistogram({ width: "28px", textAlign: "right", color: "var(--muted)", + fontVariantNumeric: "tabular-nums", }} > {count} diff --git a/src/index.css b/src/index.css index 1b3ba58..db8edd5 100644 --- a/src/index.css +++ b/src/index.css @@ -2206,6 +2206,7 @@ code, color: var(--text); font-size: 1rem; font-weight: 700; + font-variant-numeric: tabular-nums; line-height: 1.3; white-space: nowrap; } diff --git a/src/styles/typography.css b/src/styles/typography.css index 251c195..6801f38 100644 --- a/src/styles/typography.css +++ b/src/styles/typography.css @@ -11,25 +11,6 @@ font-variant-numeric: tabular-nums; } -/* Ensure amounts/counts inside TagChip use tabular-nums */ -.tag-chip { - font-variant-numeric: tabular-nums; -} - -/* ── MarketplacePage count bar ────────────────────────────────────────────── - Belt-and-suspenders container rule so every numeric descendant inside the - "Showing X–Y of N APIs" label is automatically tabular, even if a span is - added in the future without the explicit .numeric-tabular class. - Individual wrappers remain the canonical - mechanism — this rule is a defensive fallback (GrantFox FWC26). */ -.marketplace-count { - font-variant-numeric: tabular-nums; -} - -/* ── Marketplace filter-active badge ──────────────────────────────────────── - The numeric count of active filters shown on the mobile "Filters" button - must also use tabular numerals so single-digit and double-digit counts - don't shift the badge width unexpectedly. */ -.marketplace-filter-badge { +.numeric-tabular { font-variant-numeric: tabular-nums; } \ No newline at end of file