Responsive design - map rotation

[TianshengC]

Create “Please rotate your screen” map cover (shows when screen is too narrow)

[mferryRV]

To support mobile widths, follow this Figma design on page "Mobile wireframe...".

When a screen is too narrow, we need to display a prompt requesting the user to turn their screen for accurate viewing.

The MapSection component will need the following functionality when the screen is too narrow:

• Icons are not displayed on the map
• The map is cut off at the edges
• Nothing on the map is clickable
• The map overlay says "Please rotate your screen for a better viewing experience"

This ticket depends on #43

[mferryRV]

Per Roger - To avoid user interaction, you can overlay a transparent layer which blocks the clicks. When you rotate to the correct orientation, the layer is hidden.