fix(meme-generator): match preview and server render text sizing

- Preview font size now calculated from actual container width, not viewport
- Preview stroke scales proportionally with font size (4% ratio)
- Server stroke reduced from 6% to 4% to match preview
- Added ResizeObserver to track container width for accurate sizing
- Added paint-order: stroke fill to CSS preview for consistent rendering
This commit is contained in:
SnapOtter
2026-05-08 18:17:17 +08:00
parent a157af2ea9
commit dac30f14f0
2 changed files with 30 additions and 16 deletions
+1 -1
View File
@@ -213,7 +213,7 @@ export function renderMemeTextSvg(opts: MemeTextOptions): Buffer {
const fontSize = fixedFontSize ?? autoSizeFontToFit(text, fontFamily, bw, bh);
const lineHeight = fontSize * LINE_HEIGHT_FACTOR;
const lines = wrapText(text, fontFamily, fontSize, bw);
const strokeWidth = Math.max(1, Math.round(fontSize * 0.06));
const strokeWidth = Math.max(1, Math.round(fontSize * 0.04));
const fillAttr = escapeXmlAttr(textColor);
const strokeAttr = escapeXmlAttr(strokeColor);