From aa032bea43b778dd0dc18baaa9bae975fbfa72c8 Mon Sep 17 00:00:00 2001
From: claustra01 <shinya430.g@gmail.com>
Date: Thu, 15 Aug 2024 23:00:16 +0900
Subject: [PATCH] fix: target overlay image style

---
 src/components/Yatai/TargetOverlay.module.css | 7 ++++++-
 src/components/Yatai/TargetOverlay.tsx        | 4 +---
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/components/Yatai/TargetOverlay.module.css b/src/components/Yatai/TargetOverlay.module.css
index 4388050..c285a00 100644
--- a/src/components/Yatai/TargetOverlay.module.css
+++ b/src/components/Yatai/TargetOverlay.module.css
@@ -3,5 +3,10 @@
     z-index: 1;
     width: 100px;
     height: 100px;
+    transform: translate(calc(-50%+50px), calc(-50%+50px));
+}
+
+.image {
+    width: 100%;
+    height: 100%;
 }
-  
\ No newline at end of file
diff --git a/src/components/Yatai/TargetOverlay.tsx b/src/components/Yatai/TargetOverlay.tsx
index d539fcb..f5ffe29 100644
--- a/src/components/Yatai/TargetOverlay.tsx
+++ b/src/components/Yatai/TargetOverlay.tsx
@@ -43,14 +43,12 @@ export const TargetOverlay = () => {
 			style={{
 				left: `${aim?.x}px`,
 				top: `${aim?.y}px`,
-				transform: "translate(-50%, -50%)",
 			}}
 		>
 			<img
 				src="/2D_material/target.webp"
 				alt="照準の表示"
-				width="100%"
-				height="100%"
+				className={styles.image}
 			/>
 		</div>
 	);