Fix player position regression caused by bubble wrapper adding height

This commit is contained in:
Justin Oros
2026-05-20 09:38:46 -07:00
parent aece71a0d4
commit 4d56d01c53
+3 -3
View File
@@ -483,11 +483,11 @@ html, body {
.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; } .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; } .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 */ /* Player is fixed to the viewport centre horizontally; only Y moves */
.map-player-wrap { position:absolute; text-align:center; z-index:99; } .map-player-wrap { position:absolute; text-align:center; z-index:99; width:32px; height:64px; }
.player-bubble { font-size:11px; font-family:var(--font); color:var(--black); background:#fff; border:2px solid var(--black); padding:0 4px; height:20px; display:none; align-items:center; justify-content:center; margin:0 auto 2px; border-radius:2px; white-space:nowrap; } .player-bubble { font-size:11px; font-family:var(--font); color:var(--black); background:#fff; border:2px solid var(--black); padding:0 4px; height:20px; display:none; align-items:center; justify-content:center; border-radius:2px; white-space:nowrap; position:absolute; bottom:100%; left:50%; transform:translateX(-50%); margin-bottom:4px; }
.player-bubble.visible { display:flex; animation:bounce .5s ease-in-out 3; } .player-bubble.visible { display:flex; animation:bounce .5s ease-in-out 3; }
.map-player { .map-player {
position: relative; position: absolute;
position: absolute; position: absolute;
width: 32px; width: 32px;
height: 64px; height: 64px;