Skip to content

fix: reset transform scale on TTS PNG export to prevent large transparent region#181

Open
MouthsheepZZZ wants to merge 1 commit intooatear:mainfrom
MouthsheepZZZ:fix/tts-grid-layout
Open

fix: reset transform scale on TTS PNG export to prevent large transparent region#181
MouthsheepZZZ wants to merge 1 commit intooatear:mainfrom
MouthsheepZZZ:fix/tts-grid-layout

Conversation

@MouthsheepZZZ
Copy link
Copy Markdown

Before:

image ## After: image

Problem

In TTS mode, exporting to PNG produces an image where ~90% of the area is transparent. The card sheet only appears in the top-left corner.

Root Cause

The #cardSheets element has a CSS transform: scale(N) applied for preview scaling. When html-to-image captures the element, it allocates a canvas based on the full layout dimensions (paperWidth * paperDpi), but the scaled-down content only occupies the top-left corner — leaving the rest of the canvas transparent.

Fix

Override transform: scale(1) and transformOrigin: top left in the html-to-image export options so the capture reflects the actual full-size content instead of the scaled preview.

…egions

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
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.

1 participant