Implement composite design (combination of map-first prototype and data-first prototype)

[nickvisut]

Context

Originally, the front end team was working on two separate prototypes. One was meant to be map-first (#808) with a height constrained to viewport height without page scroll. Other meant to be more data-first and content-heavy with a scrollable page.

UX team has begun working on a composite of these prototypes that takes design elements from both. This composite is meant to be the basis for our mobile-first design.

The (WIP) composite design is located here: https://www.figma.com/design/2yjQGc0lCYCbnfq5qotgEG/SafeHome-Design?node-id=7485-9806&t=7UN5lPCJCTkhdjbC-0

Definition of Done

• accurate look and feel
• works across breakpoints
• maintains same functionality as current app
• solves issues with page scroll vs map interaction
• well-tested

Engineering Details

• need cooperative gestures on map
• need to take the current prototype branches in these PRs: [PROTOTYPE DO NOT MERGE] turn on cooperative gestures; also make overlay more transparent than… #828 and [PROTOTYPE DO NOT MERGE] move content below map to a new page called earthquake introduction #814 and merge their relevant code into a new branch for the composite design

[nickvisut]

This is on hold until we finish the original prototypes and work on AB testing.