Map has wrong size on Report details screen

[schlos]

Describe the bug

Map has wrong size on Report details screen (see under screesnhots).

To Reproduce Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior

As per Figma design:

• desktop: https://www.figma.com/proto/OrvZfg5BsfdOzeL7nhRpEI/Popravi.to?node-id=464%3A3676&scaling=min-zoom&page-id=25%3A186&hide-ui=1
• mobile: https://www.figma.com/proto/OrvZfg5BsfdOzeL7nhRpEI/Popravi.to?node-id=550%3A9750&scaling=min-zoom&page-id=25%3A186&hide-ui=1

Map on Report details screen should be fixed to visible part of a screen and non scrollable (on Desktop). Text details on left side of a screen should be possible to scroll is there is content that does not fit on a visible part of a screen - see example on a FixMyStreet:

• details with no scrollbars on left side: https://www.fixmystreet.com/report/62000
• details with scrollbar on left side (map is always fixed on a screen): https://www.fixmystreet.com/report/62020

Screenshots

Current problem with map size:

Desktop (please complete the following information):

• OS: [e.g. Windows]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context

First development version with static HTML can be fetched on our internal drive (this screen is report_details.html): https://drive.google.com/file/d/1wS_feNEopHBk9Ji2u66Bex3okye27azd/view?usp=sharing

[schlos]

For working reference, refer to the original FMS web and how it's working as a progressive mobile app and how map is displayed on a mobile screen: https://github.com/mysociety/fixmystreet/issues/1996#issuecomment-365895609

[schlos]

How to contribute? Read our contribution guidelines at https://codeforcroatia.org/popravito-contribution-guidelines.