Skip to content

Keep mobile CSS when responsive bodies match - #96

Merged
chubes4 merged 1 commit into
mainfrom
fix/responsive-mobile-css
Aug 26, 2026
Merged

Keep mobile CSS when responsive bodies match#96
chubes4 merged 1 commit into
mainfrom
fix/responsive-mobile-css

Conversation

@chubes4

@chubes4 chubes4 commented Aug 26, 2026

Copy link
Copy Markdown
Contributor

Related work

Problem

When desktop and mobile captures had equivalent body markup but different style blocks, export kept only the desktop document. Mobile CSS was dropped entirely.

Changes

  • Keep the shared body when responsive body signatures match.
  • Wrap differing desktop styles in a desktop media query.
  • Append unscoped mobile styles in a mobile media query.
  • Preserve the existing single-document output when styles are identical.
  • Keep the existing scoped two-body behavior when body signatures differ.
  • Rebuild committed capture and MCP bundles.

Ellen Bauer is preserved as the commit author. Claude Fable 5 is preserved as co-author.

Verification

  • npm run build
  • npm test: 3,021 passed, 1 todo
  • npm run test:package
  • npm audit --omit=dev: 0 vulnerabilities

How AI was used

OpenAI GPT-5.6 Sol via OpenCode was used to compare the Studio and standalone implementations, port Ellen's source and regression tests, regenerate standalone distribution bundles, run verification, and prepare this PR.

When desktop and mobile captures share a responsive body signature but their style blocks differ, the export returned the desktop document unchanged: mobile styles were dropped entirely and desktop styles were left unwrapped, so the page shipped with no mobile CSS.

Keep the single shared body but merge CSS responsively: wrap desktop styles in media="(min-width:769px)" and append the mobile document style blocks as media="(max-width:768px)", without the .data-liberation-mobile-document scoping that only exists in two-body output. Identical bodies with identical styles keep the current single-document output, and differing bodies keep the existing two-document behavior.

Known limitation (out of scope): mobile-only body attributes/classes are still lost when the shared desktop body is kept.

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
@chubes4
chubes4 merged commit 9f4ac74 into main Aug 26, 2026
1 check passed
@chubes4
chubes4 deleted the fix/responsive-mobile-css branch August 26, 2026 21:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants