X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Fcommon%2FZeldaIcon.js;fp=resources%2Fjs%2Fcomponents%2Fcommon%2FZeldaIcon.js;h=457e6e91ba177c933dcb92cfe3bf39486f376a22;hb=1a3d040147c19d24b8d02ec8e594eb06b8efc1ff;hp=3504dcf17b719bb1b483f63fca3170f26b1dca44;hpb=05862d3235a4472abe49ae994bd927943744e451;p=alttp.git

diff --git a/resources/js/components/common/ZeldaIcon.js b/resources/js/components/common/ZeldaIcon.js
index 3504dcf..457e6e9 100644
--- a/resources/js/components/common/ZeldaIcon.js
+++ b/resources/js/components/common/ZeldaIcon.js
@@ -141,6 +141,14 @@ const getIconURL = name => {
 	}
 };
 
+const isHalfWidth = name => [
+	'blue-boomerang',
+	'fire-rod',
+	'ice-rod',
+	'hookshot',
+	'red-boomerang',
+].includes(name);
+
 const ZeldaIcon = ({ name, svg, title }) => {
 	const { t } = useTranslation();
 
@@ -153,14 +161,18 @@ const ZeldaIcon = ({ name, svg, title }) => {
 	if (svg) {
 		const clipX = getItemMapX(strippedName);
 		const clipY = getItemMapY(strippedName);
+		const cropX = isHalfWidth(strippedName) ? 0.25 : 0.02;
+		const cropY = 0.02;
+		const cropW = 1 - (2 * cropX);
+		const cropH = 1 - (2 * cropY);
 		return <image
 			href={isOnItemMap(strippedName) ? ITEM_MAP_URL : src}
 			width={ITEM_MAP_WIDTH}
 			height={ITEM_MAP_HEIGHT}
 			x="0"
 			y="0"
-			transform={`translate(-${clipX} -${clipY})`}
-			clipPath={`xywh(${clipX + 0.02} ${clipY + 0.02} 0.96 0.96)`}
+			transform={`translate(-${clipX + 0.5} -${clipY + 0.5})`}
+			clipPath={`xywh(${clipX + cropX} ${clipY + cropY} ${cropW} ${cropH})`}
 		>
 			{realTitle ?
 				<title>{realTitle}</title>