fix(study): Pencil 만 인식 + 더블탭 줌 차단

- isPenLike: 'touch' 제거. pen/mouse 만 허용 → 손가락 stroke/지우개 차단
- 페이지/툴바 영역에 touch-action: manipulation → 버튼 빠른 두 번 탭 시
  iOS Safari 더블탭 줌 차단. 지우개/펜 토글 시 화면 확대되던 현상 fix.
This commit is contained in:
Hyungi Ahn
2026-04-27 10:00:34 +09:00
parent 66c6fb6189
commit df81cd033a
2 changed files with 7 additions and 8 deletions
@@ -181,10 +181,9 @@
}
function isPenLike(e: PointerEvent): boolean {
// pen / mouse / touch 모두 stroke 허용. iPad Apple Pencil 'pen' 으로 안 들어오는
// 케이스 보고됨 (브라우저/OS 버전에 따라). 우선 입력 가능성을 넓히고, palm rejection 은
// Phase 2 에서 동시 다중 pointer 거부 등 다른 방식으로 처리.
return e.pointerType === 'pen' || e.pointerType === 'mouse' || e.pointerType === 'touch';
// 사용자 요청: Apple Pencil ('pen') 만 인식. 손가락 ('touch') 거부 — palm rejection.
// 데스크톱 테스트용 'mouse' 는 허용.
return e.pointerType === 'pen' || e.pointerType === 'mouse';
}
// ── 지우개 hit-test ──
@@ -412,9 +411,9 @@
});
</script>
<div class="flex flex-col h-full">
<!-- 툴바 -->
<div class="flex items-center gap-1 px-2 py-1 border-b border-default bg-surface shrink-0">
<div class="flex flex-col h-full" style="touch-action: manipulation;">
<!-- 툴바 — touch-action: manipulation 으로 더블탭 줌 차단 -->
<div class="flex items-center gap-1 px-2 py-1 border-b border-default bg-surface shrink-0" style="touch-action: manipulation;">
<!-- Pen / Eraser 모드 토글 -->
<button
type="button"
@@ -108,7 +108,7 @@
}
</script>
<div class="h-full flex flex-col relative">
<div class="h-full flex flex-col relative" style="touch-action: manipulation;">
<!-- 상단 헤더 -->
<div class="flex items-center justify-between gap-2 px-3 py-2 border-b border-default bg-surface shrink-0 z-10">
<Button href="/study/write" size="sm" variant="ghost" icon={ArrowLeft}>목록</Button>