fix: target overlay image style

claustra01 · Aug 15, 2024 · aa032be · aa032be
1 parent 70bcda3
commit aa032be
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git 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%;
 }
-
diff --git 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>
 	);