justin/pokeazure
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix diagonal corner artifact — map-talk-hint was animating at 0,0 before JS positioned it

Browse Source
This commit is contained in:
Justin Oros
2026-05-20 12:49:33 -07:00
parent a304b97fe8
commit a74f2a28a9
2 changed files with 9 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
game.js
+2 -2
View File
@@ -436,9 +436,9 @@ class Game {
const hint = document.getElementById('map-talk-hint'); const hint = document.getElementById('map-talk-hint');
const bub = document.getElementById('npc-bubble'); const bub = document.getElementById('npc-bubble');
if (hint) { if (hint) {
hint.style.display = near ? 'block' : 'none';
hint.style.left = (viewW / 2 - 28) + 'px'; hint.style.left = (viewW / 2 - 28) + 'px';
hint.style.bottom = (viewH * 0.50) + 'px'; hint.style.bottom = (viewH * 0.50) + 'px';
hint.classList.toggle('visible', near);
} }
if (bub) bub.style.opacity = near ? '0' : '1'; if (bub) bub.style.opacity = near ? '0' : '1';
this._updateDirArrow(near); this._updateDirArrow(near);
@@ -503,7 +503,7 @@ class Game {
} }
this._applyCamera(); this._applyCamera();
const hint = document.getElementById('map-talk-hint'); const hint = document.getElementById('map-talk-hint');
if (hint) hint.style.display = 'none'; if (hint) hint.classList.remove('visible');
} }
/* ══════════════════════════════════════════════════════════ /* ══════════════════════════════════════════════════════════
style.css
+7 -2
View File
@@ -498,7 +498,7 @@ html, body {
background-position: 0 0; background-position: 0 0;
image-rendering: pixelated; image-rendering: pixelated;
filter: drop-shadow(2px 3px 0 rgba(0,0,0,.4)); filter: drop-shadow(2px 3px 0 rgba(0,0,0,.4));
z-index: 99; z-index: 9999;
font-size: 0; font-size: 0;
color: transparent; color: transparent;
} }
@@ -519,8 +519,13 @@ html, body {
padding: 3px 6px; padding: 3px 6px;
white-space: nowrap; white-space: nowrap;
z-index: 11; z-index: 11;
animation: talkBubble .6s ease-in-out infinite;
pointer-events: none; pointer-events: none;
display: none;
bottom: -9999px;
}
.map-talk-hint.visible {
display: block;
animation: talkBubble .6s ease-in-out infinite;
} }
/* Desktop: show "Press E", hide "Press A" */ /* Desktop: show "Press E", hide "Press A" */
.hint-touch { display: none; } .hint-touch { display: none; }