From ec1a1ffc04f104f3f4981c5db60b2b52ed464b5d Mon Sep 17 00:00:00 2001
From: syuilo <4439005+syuilo@users.noreply.github.com>
Date: Wed, 17 Sep 2025 07:57:11 +0900
Subject: [PATCH] Update MkImageEffectorDialog.vue

---
 .../src/components/MkImageEffectorDialog.vue  | 26 +++++++++----------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/packages/frontend/src/components/MkImageEffectorDialog.vue b/packages/frontend/src/components/MkImageEffectorDialog.vue
index d6211bc2b9..505a38e511 100644
--- a/packages/frontend/src/components/MkImageEffectorDialog.vue
+++ b/packages/frontend/src/components/MkImageEffectorDialog.vue
@@ -219,8 +219,6 @@ watch(enabled, () => {
 const fillSquare = ref(false);
 
 function onImagePointerdown(ev: PointerEvent) {
-	const PADDING = 0; // TODO
-
 	if (canvasEl.value == null || imageBitmap == null || !fillSquare.value) return;
 
 	const AW = canvasEl.value.clientWidth;
@@ -244,11 +242,11 @@ function onImagePointerdown(ev: PointerEvent) {
 	let startY = ev.offsetY - yOffset;
 
 	if (AW / AH < BW / BH) { // 横長
-		startX = (startX - PADDING) / ((Math.max(AW, AH) / Math.max(BH / BW, 1)) - (PADDING * 2));
-		startY = (startY - PADDING) / ((Math.max(AW, AH) / Math.max(BW / BH, 1)) - (PADDING * 2));
+		startX = startX / (Math.max(AW, AH) / Math.max(BH / BW, 1));
+		startY = startY / (Math.max(AW, AH) / Math.max(BW / BH, 1));
 	} else { // 縦長
-		startX = (startX - PADDING) / ((Math.min(AW, AH) / Math.max(BH / BW, 1)) - (PADDING * 2));
-		startY = (startY - PADDING) / ((Math.min(AW, AH) / Math.max(BW / BH, 1)) - (PADDING * 2));
+		startX = startX / (Math.min(AW, AH) / Math.max(BH / BW, 1));
+		startY = startY / (Math.min(AW, AH) / Math.max(BW / BH, 1));
 	}
 
 	const id = genId();
@@ -273,11 +271,11 @@ function onImagePointerdown(ev: PointerEvent) {
 		let y = pointerY - yOffset;
 
 		if (AW / AH < BW / BH) { // 横長
-			x = (x - PADDING) / ((Math.max(AW, AH) / Math.max(BH / BW, 1)) - (PADDING * 2));
-			y = (y - PADDING) / ((Math.max(AW, AH) / Math.max(BW / BH, 1)) - (PADDING * 2));
+			x = x / (Math.max(AW, AH) / Math.max(BH / BW, 1));
+			y = y / (Math.max(AW, AH) / Math.max(BW / BH, 1));
 		} else { // 縦長
-			x = (x - PADDING) / ((Math.min(AW, AH) / Math.max(BH / BW, 1)) - (PADDING * 2));
-			y = (y - PADDING) / ((Math.min(AW, AH) / Math.max(BW / BH, 1)) - (PADDING * 2));
+			x = x / (Math.min(AW, AH) / Math.max(BH / BW, 1));
+			y = y / (Math.min(AW, AH) / Math.max(BW / BH, 1));
 		}
 
 		const scaleX = Math.abs(x - startX);
@@ -392,9 +390,11 @@ function onImagePointerdown(ev: PointerEvent) {
 	position: absolute;
 	top: 0;
 	left: 0;
-	width: 100%;
-	height: 100%;
-	padding: 0px; /* TODO */
+	width: -webkit-fill-available;
+	width: stretch;
+	height: -webkit-fill-available;
+	height: stretch;
+	margin: 20px;
 	box-sizing: border-box;
 	object-fit: contain;
 }