From ee3e217a013eddb5b81acf2c7f5cf3fb6c04ca7f Mon Sep 17 00:00:00 2001
From: Josiah Bills <josiah@adoniram.net>
Date: Fri, 10 Jul 2026 22:49:34 -0400
Subject: [PATCH] Fix scaling on sprites

For some reason, the browser decides to downscale the image box before
even applying the transform. This causes the scale and translate values
to be incorrect. Fix this by forcing width and height to the correct
values.
---
 ui/components/canvas/TextBlockLayer.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/ui/components/canvas/TextBlockLayer.tsx b/ui/components/canvas/TextBlockLayer.tsx
index 77b97acd1..51716779d 100644
--- a/ui/components/canvas/TextBlockLayer.tsx
+++ b/ui/components/canvas/TextBlockLayer.tsx
@@ -251,6 +251,8 @@ function BlockSprite({ node, scale }: { node: TextNodeEntry; scale: number }) {
   const spriteT = node.data.spriteTransform
   const x = (spriteT?.x ?? node.transform.x) * scale
   const y = (spriteT?.y ?? node.transform.y) * scale
+  const w = (spriteT?.width ?? node.transform.width) * scale
+  const h = (spriteT?.height ?? node.transform.height) * scale
   return (
     <img
       alt=''
@@ -260,8 +262,10 @@ function BlockSprite({ node, scale }: { node: TextNodeEntry; scale: number }) {
       style={{
         top: 0,
         left: 0,
+        width: w,
+        height: h,
         transformOrigin: 'top left',
-        transform: `translate(${x}px, ${y}px) scale(${scale})`,
+        transform: `translate(${x}px, ${y}px)`,
       }}
     />
   )