Maps on mobile cannot easily be scrolled past

[jdlrobson]

Setup

• Maps version: current master (dev)
• MW version: current master (dev)
• PHP version: 7.4.0

Issue

On a mobile device go to a page with a map e.g. https://sandbox.semantic-mediawiki.org/wiki/Berlin_map?useformat=mobile

Try to scroll to the bottom.

Expected: Easy peasy

Actual: As soon as the map comes into view, the map intercepts scrolling. It becomes near impossible to scroll, unless one knows to use the tiny margin space to the left or right of the map. This is particularly problematic for accessibility.

A potential fix for this would be to require a user to click to signal an intent to use the map (and allow exit). I see kartographer extension uses an overlay for this purpose (which would also be acceptable).

Suggested criteria of fix

• [ ] I can focus and unfocus (enter/exit) the map.
• [ ] I can scroll past the map in a similar way to an image.

Demonstration of problem: