diff --git a/.Jules/palette.md b/.Jules/palette.md index 8a5a46f6c..b9d1867dd 100644 --- a/.Jules/palette.md +++ b/.Jules/palette.md @@ -8,3 +8,6 @@ ## 2024-10-24 - CSS Bar Chart Animation **Learning:** CSS animations can enhance static data visualizations without requiring JavaScript, providing visual polish and reducing perceived loading times for data. **Action:** Use CSS keyframe animations for simple visual improvements in static reports. +## 2025-02-17 - Tabular Nums For Data Reports +**Learning:** In data-heavy static HTML reports, reading and comparing numeric values vertically is difficult when numbers lack a uniform width, especially with variable-width fonts. +**Action:** Always include `font-variant-numeric: tabular-nums;` in body styles or data-heavy components within HTML reports to ensure numbers align properly vertically for improved readability and scanning. diff --git a/CHANGELOG.md b/CHANGELOG.md index a9a94ed43..7020f7839 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -16,6 +16,7 @@ ### Changed +- Applied `font-variant-numeric: tabular-nums` to the generated diagnostics - Rust EAP scoring now defaults to GPU-preferred `auto` execution in the core, PyO3 binding, and serving API. The f64 CPU reduction remains available via `device="cpu"`; an explicit unavailable `device="gpu"` request now warns diff --git a/python/fast_mlsirm/report.py b/python/fast_mlsirm/report.py index 30ee4276b..d9dfa601f 100644 --- a/python/fast_mlsirm/report.py +++ b/python/fast_mlsirm/report.py @@ -462,6 +462,7 @@ def _css() -> str: } body { + font-variant-numeric: tabular-nums; margin: 0; background: var(--bg); color: var(--text); diff --git a/scripts/build_benchmark_report.py b/scripts/build_benchmark_report.py index 0558437fe..dc65a5812 100644 --- a/scripts/build_benchmark_report.py +++ b/scripts/build_benchmark_report.py @@ -253,6 +253,7 @@ def _report_css() -> str: box-sizing: border-box; } body { + font-variant-numeric: tabular-nums; margin: 0; } main { diff --git a/scripts/build_buyer_packet.py b/scripts/build_buyer_packet.py index d5effbebf..3d8386394 100644 --- a/scripts/build_buyer_packet.py +++ b/scripts/build_buyer_packet.py @@ -307,6 +307,7 @@ def _report_css() -> str: box-sizing: border-box; } body { + font-variant-numeric: tabular-nums; margin: 0; } main { diff --git a/scripts/build_commercial_release.py b/scripts/build_commercial_release.py index d9ebd5626..fbf127b83 100644 --- a/scripts/build_commercial_release.py +++ b/scripts/build_commercial_release.py @@ -232,6 +232,7 @@ def _report_css() -> str: box-sizing: border-box; } body { + font-variant-numeric: tabular-nums; margin: 0; } main { diff --git a/scripts/build_figma_evidence_sync.py b/scripts/build_figma_evidence_sync.py index 1deca1837..6a6eca101 100644 --- a/scripts/build_figma_evidence_sync.py +++ b/scripts/build_figma_evidence_sync.py @@ -127,7 +127,7 @@ def _report_css() -> str: return """ :root { color: #172026; background: #f5f7f8; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; } * { box-sizing: border-box; } -body { margin: 0; } +body { margin: 0; font-variant-numeric: tabular-nums; } main { max-width: 1120px; margin: 0 auto; padding: 32px 20px 56px; } .hero { background: #12343b; color: #fff; border-radius: 8px; padding: 28px; } .hero p, .hero h1 { margin: 0; } diff --git a/scripts/build_pr_queue_governance.py b/scripts/build_pr_queue_governance.py index 66a191c2b..6f0e2dba9 100644 --- a/scripts/build_pr_queue_governance.py +++ b/scripts/build_pr_queue_governance.py @@ -272,7 +272,7 @@ def _report_css() -> str: return """ :root { color: #172026; background: #f5f7f8; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; } * { box-sizing: border-box; } -body { margin: 0; } +body { margin: 0; font-variant-numeric: tabular-nums; } main { max-width: 1180px; margin: 0 auto; padding: 32px 20px 56px; } .hero { background: #12343b; color: #fff; border-radius: 8px; padding: 28px; } .hero p, .hero h1 { margin: 0; } diff --git a/scripts/build_procurement_due_diligence.py b/scripts/build_procurement_due_diligence.py index 1505f2fcc..413253ed1 100644 --- a/scripts/build_procurement_due_diligence.py +++ b/scripts/build_procurement_due_diligence.py @@ -289,7 +289,7 @@ def _report_css() -> str: return """ :root { color: #172026; background: #f5f7f8; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; } * { box-sizing: border-box; } -body { margin: 0; } +body { margin: 0; font-variant-numeric: tabular-nums; } main { max-width: 1120px; margin: 0 auto; padding: 32px 20px 56px; } .hero { background: #12343b; color: #fff; border-radius: 8px; padding: 28px; } .hero p, .hero h1 { margin: 0; } diff --git a/scripts/build_release_evidence_index.py b/scripts/build_release_evidence_index.py index 348fddf6d..fadc77962 100644 --- a/scripts/build_release_evidence_index.py +++ b/scripts/build_release_evidence_index.py @@ -260,6 +260,7 @@ def _report_css() -> str: box-sizing: border-box; } body { + font-variant-numeric: tabular-nums; margin: 0; } main {