different target for the touch event

sticker.js

@@ -4,8 +4,8 @@ const stickerContainer = document.getElementById("sticker-container");
 infoList = Array.from(informations.children);
 loopIndex = 0;
 
-let windowWidth;
+let windowWidth = stickerContainer.clientWidth;
-let windowHeight;
+let windowHeight = stickerContainer.clientHeight;
 
 let palette = ["#9EDAE2", "#9FD3A8", "#F7D8E8", "#F9F5B0", "#FFC496"];
 
@@ -31,15 +31,15 @@ function percentagePosition(e, target) {
 	return { x: ((x / windowWidth) * 100).toFixed(2), y: ((y / windowHeight) * 100).toFixed(2) };
 }
 
-window.addEventListener("click", (e) => {
+stickerContainer.addEventListener("click", (e) => {
 	getInput(e);
 });
 
 // Test for trick Safari mobile
-window.addEventListener("touchstart", () => {});
+stickerContainer.addEventListener("touchstart", () => {});
-window.addEventListener("touchend", () => {});
+stickerContainer.addEventListener("touchend", () => {});
-window.addEventListener("touchcancel", () => {});
+stickerContainer.addEventListener("touchcancel", () => {});
-window.addEventListener("touchmove", () => {});
+stickerContainer.addEventListener("touchmove", () => {});
 
 function getInput(e) {
 	placeSticker(percentagePosition(e, stickerContainer), infoList[loopIndex]);

style.css

@@ -69,8 +69,8 @@ body {
 
 .sticker.deco {
 	background-color: white;
-	min-width: 64px;
+	min-width: 48px;
-	min-height: 64px;
+	min-height: 48px;
 	padding: 16px;
 }