Fix NPC rendering on top of path — move NPC to viewport layer, convert world-px to screen-px each tick

This commit is contained in:
Justin Oros
2026-05-14 10:42:10 -07:00
parent b81958a56d
commit 34a9bae50c
3 changed files with 25 additions and 17 deletions
+2 -1
View File
@@ -395,6 +395,7 @@ html, body {
top: 0; bottom: 0; left: 0;
width: 400%;
will-change: transform;
z-index: 5;
}
.map-trees {
position: absolute;
@@ -436,7 +437,7 @@ html, body {
filter: drop-shadow(0 0 4px rgba(248,192,48,.6));
}
/* NPC lives inside .map-inner, positioned in world-px via JS */
.map-npc-wrap { position:absolute; text-align:center; }
.map-npc-wrap { position:absolute; text-align:center; z-index: 30; }
.npc-bubble { font-size:14px; font-family:var(--font); color:var(--black); background:var(--yellow); border:2px solid var(--black); width:20px; height:20px; display:flex; align-items:center; justify-content:center; margin:0 auto 2px; animation:bounce .7s ease-in-out infinite; }
.map-npc { font-size:clamp(36px,10vw,52px); filter:drop-shadow(2px 3px 0 rgba(0,0,0,.35)); cursor:pointer; }
/* Player is fixed to the viewport centre horizontally; only Y moves */