mirror of
https://github.com/Crosstalk-Solutions/project-nomad.git
synced 2026-04-04 07:46:16 +02:00
Add distance scale bar and user-placed location pins to the offline maps viewer. - Scale bar (bottom-left) shows distance reference that updates with zoom level - Click anywhere on map to place a named pin with color selection (6 colors) - Collapsible "Saved Locations" panel lists all pins with fly-to navigation - Full dark mode support for popups and panel via CSS overrides - New `map_markers` table with future-proofed columns for routing (marker_type, route_id, route_order, notes) to avoid a migration when routes are added later - CRUD endpoints: GET/POST /api/maps/markers, PATCH/DELETE /api/maps/markers/:id - VineJS validation on create/update - MapMarker Lucid model Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
18 lines
430 B
TypeScript
18 lines
430 B
TypeScript
import { IconMapPinFilled } from '@tabler/icons-react'
|
|
|
|
interface MarkerPinProps {
|
|
color?: string
|
|
active?: boolean
|
|
}
|
|
|
|
export default function MarkerPin({ color = '#a84a12', active = false }: MarkerPinProps) {
|
|
return (
|
|
<div className="cursor-pointer" style={{ filter: 'drop-shadow(0 1px 2px rgba(0,0,0,0.4))' }}>
|
|
<IconMapPinFilled
|
|
size={active ? 36 : 32}
|
|
style={{ color }}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|