3a4d4db48a
The Driver scrolls a legend to the end on a phone and the last rows sit under the hamburger circle. The circle is .vtl-fab: 44px, pinned bottom-left, rendered only when narrow and headerless with the drawer shut. It wins on paint for a reason no z-index can fix. The FAB lives in the LAYOUT, outside every plugin's shadow root, so it and the legend sheet are in different stacking contexts; the sheet is z-index 1000 and still loses. Raising the sheet would not have worked, which is why this reserves space instead. The layout now publishes --map-fab-clearance, and only while the button is actually on screen; custom properties inherit through the flattened tree, so it reaches inside each plugin's shadow root. The mobile legend's scroll area adds that to its bottom padding, defaulting to zero. No circle, no reserved space, and a plugin used without this layout is unchanged. The padding is additive, so nothing that works today moves. The button's v-if and the clearance are now ONE computed rather than two copies of the same condition. Two copies is the bug waiting to happen: drift one way and the legend ends under the circle again, drift the other and there is a strip of dead whitespace with no circle to justify it. Neither has a symptom any gate can see, so disagreement is made impossible rather than tested for. Measured, not guessed: the earlier reading of this card found the top-left map control at top:8px and concluded the geometry did not match the report. It did not — that is a second, real collision in two plugins, and a different bug. |
||
|---|---|---|
| .. | ||
| charts | ||
| dashboards | ||
| hints | ||
| legends | ||
| map-controls | ||
| poster | ||
| qa | ||
| regions | ||
| search | ||
| tables | ||
| PeopleGroupDetail.vue | ||
| README.md | ||
| ResearchMapFilterPanel.vue | ||
| ResearchMapSideMenu.vue | ||
| SideMenuDrawer.vue | ||
| ViewSelect.vue | ||
| WARNING.md | ||
library/components/ — shared Vue components
The map UI, built from parameterized pieces every app-profile reuses. Fix one here and every map benefits — never edit a shared component to customize one map.
library/components/
┌───────────────────────────────────────────┐
│ legends/ map-controls/ poster/ │
│ charts/ tables/ │
│ PeopleGroupDetail.vue SideMenuDrawer.vue │
│ ResearchMapFilterPanel.vue …SideMenu.vue │
└───────────────────────────────────────────┘
reused by every app-profile via @map/components/…
legends/,map-controls/,poster/each have their own README.- Every component uses
<script setup>, callsuseShadowStyles(), and reaches stores viainject('mapStore' | 'uiStore' | 'dataStore')— never a direct store import.
Full catalog + conventions:
../../documentation/architecture/components.md ·
per-file roles: ../../documentation/reference.md.