From 63918633cb0edfb51db30b01aa0feaba11da3f72 Mon Sep 17 00:00:00 2001 From: kim Date: Thu, 11 Jun 2026 18:04:41 +0900 Subject: [PATCH] =?UTF-8?q?Arduino=20emulator:=20=EB=B3=B4=EB=93=9C=20?= =?UTF-8?q?=ED=8C=A8=EB=84=90=20340px=20=ED=99=95=EC=9E=A5=20+=20canvas=20?= =?UTF-8?q?pixelated=20=EB=A0=8C=EB=8D=94=EB=A7=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 좌측 패널 280→340px 로 넓혀 OLED 캔버스가 256×128 CSS px 1:1 렌더링되도록 수정. max-width:100% 스케일 다운 시 bilinear 번짐 방지를 위해 image-rendering:pixelated 추가. overflow:hidden → overflow-y:auto 로 변경해 패널 내용 클리핑 방지. Co-Authored-By: Claude Sonnet 4.6 --- web-ui/arduino-emulator.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/web-ui/arduino-emulator.html b/web-ui/arduino-emulator.html index c236e23..f0dd871 100644 --- a/web-ui/arduino-emulator.html +++ b/web-ui/arduino-emulator.html @@ -36,7 +36,7 @@ .main { flex:1; display:flex; gap:0; overflow:hidden; } /* Board panel */ - .board-panel { width:280px; flex-shrink:0; background:#111122; border-right:1px solid #2d2d4a; display:flex; flex-direction:column; overflow:hidden; } + .board-panel { width:340px; flex-shrink:0; background:#111122; border-right:1px solid #2d2d4a; display:flex; flex-direction:column; overflow-y:auto; overflow-x:hidden; } .board-title { padding:10px 14px; font-size:11px; color:var(--muted); font-weight:600; letter-spacing:.08em; border-bottom:1px solid #1e1e36; flex-shrink:0; } .board-svg { padding:16px; flex-shrink:0; } .board-svg svg { width:100%; } @@ -58,7 +58,7 @@ .oled-dot { width:6px; height:6px; border-radius:50%; background:#333; flex-shrink:0; } .oled-dot.on { background:#60a5fa; box-shadow:0 0 4px #60a5fa; } .oled-wrap { background:#000; border:2px solid #222; border-radius:4px; padding:4px; position:relative; } - #oled-canvas { display:block; max-width:100%; height:auto; } + #oled-canvas { display:block; max-width:100%; height:auto; image-rendering:pixelated; } .oled-placeholder { position:absolute; inset:4px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; pointer-events:none; } .oled-placeholder span { font-size:10px; color:#333; letter-spacing:.05em; } .oled-placeholder .oled-ph-grid { width:100%; height:2px; background:repeating-linear-gradient(90deg,#1a1a1a 0,#1a1a1a 4px,transparent 4px,transparent 8px); }