The map marker container was being created with an inline `position:relative`, which overrode Mapbox GL's `.mapboxgl-marker` class (which applies `position:absolute`). Mapbox writes `transform: translate(<x>, <y>)` to that exact element on every zoom/pan frame to project lat/lng → screen coordinates. With the element kept in the document flow (relative), the transform is interpreted against the document origin instead of the map pane, so the pin visually drifts as the user zooms in on a tech. Removing the inline `position:relative` lets the Mapbox class win. The SVG ring and the avatar div are children with `position:absolute` inside outer; absolute children only need a positioned ancestor to form a containing block — `position:absolute` (Mapbox's value) qualifies just as well as relative, so the avatar stays centered. |
||
|---|---|---|
| .. | ||
| .quasar | ||
| infra | ||
| public/icons | ||
| src | ||
| src-pwa | ||
| deploy.sh | ||
| index.html | ||
| package-lock.json | ||
| package.json | ||
| quasar.config.js | ||