Skip to content

v2.1.1 — Safari print compatibility fixes

Choose a tag to compare

View all tags
@O0000-code O0000-code released this 27 May 17:26
v2.1.1
8b576ef

Patch release — Safari print rendering fixes

This release improves print fidelity, especially for Safari users, with three coordinated @media print improvements. Screen view is byte-identical to v2.1.0 across all changes — every rule lives inside @media print.

1. Safari-only hero zoom compensation

Safari WebKit silently ignores @page { size: 1240px 1754px } (WebKit Bug #250685, MDN BCD #28626) and falls back to A4 default. The SwissTop hero (designed at maxWidth: 1240) was printing 1.57x larger physically than Chrome's equivalent.

Fix: A new safari-detect.ts module UA-tags <html> with .is-safari at load. A scoped print rule then uses width: 1240px !important; zoom: 0.64 to force layout at design width and visually scale down — restoring physical parity with Chrome without touching any font, padding, or grid primitive in SwissTop.

2. Paper list left-edge alignment in print

Section names (FOUNDATIONAL / HIGH / ...) and #NN rank prefixes now sit flush at the container left edge, aligned vertically with FINDINGS / FILTER tabs above. Uses :has() (Safari 15.4+, Chrome 105+, Firefox 121+). The TierDot color bullet is hidden in print only; on-screen it remains as a visual hierarchy marker.

3. Browser-injected URL / title / date / page-number suppression

Added CSS Paged Media Module Level 3 §6 @top-* / @bottom-* margin-box content overrides. Result:

Browser Status
Chrome 105+ / Edge 105+ / Firefox 99+ 🟢 Auto-suppressed (zero user action)
Safari (all versions) 🟡 Untick "Print headers and footers" once in print dialog — Safari remembers per-host indefinitely

Safari WebKit doesn't honor margin-box content override yet, but its per-host setting persistence makes the one-time user action negligible.

Other

  • Pre-existing responsive @media (max-width: 860px) / (max-width: 480px) blocks now scoped to screen and ... so they don't accidentally fire in Chrome's narrower print viewport.

What's NOT changed

  • Search pipeline, helper scripts, RCS rubric, PRISMA-S logger, classifier prompt — all untouched
  • React component tree — only main.tsx adds a single detectSafari() call
  • Screen layout — byte-identical to v2.1.0 on every browser
  • Skill API, CLI flags, output file structure — all backwards-compatible

Upgrade

Re-install the Skill (or git pull if local clone) — no migration steps required.

Full Changelog: v2.1.0...v2.1.1

Assets 2
Loading