Tracking issue: Mobile Grapher

[sophiamersmann]

• [x] https://github.com/owid/owid-grapher/issues/3010
• [x] https://github.com/owid/owid-grapher/issues/2887
• [x] https://github.com/owid/owid-grapher/issues/3011
• [x] #3136 is also related
• [x] StackedBar: Display legend on top of the chart on mobile

Other issues:

"Show selection only" toggle almost overlaps with content switchers

Example chart: https://ourworldindata.org/grapher/electricity-as-a-share-of-primary-energy?tab=table

On data pages, Grapher should bleed onto the edges horizontally, similar to how it's done on Grapher pages and in articles

Example chart: https://ourworldindata.org/grapher/electricity-as-a-share-of-primary-energy?tab=table

Unnecessary single-item legend takes up vertical space

Example chart: https://ourworldindata.org/grapher/death-rate-by-cause-who-mdb?facet=metric

• Related: https://github.com/owid/owid-grapher/issues/2594

Tooltip overflows

Example charts:

• https://ourworldindata.org/grapher/co2-emissions-fossil-land
• https://ourworldindata.org/grapher/distribution-of-population-between-different-poverty-thresholds-up-to-30-dollars

Entity selector: Allow to clear the input field

Slack: https://owid.slack.com/archives/C0149NKLZAM/p1705351087477649

Unused space next to the legend on the right

Example chart: https://ourworldindata.org/grapher/number-of-nuclear-weapons-tests

Scatter legend is scrambled

Mobile static DiscreteBar chart: Labels too big and slightly misaligned

Full screen button appears/disappears when scrolling up and down

Example: https://ourworldindata.org/grapher/remaining-life-expectancy-at-different-ages-males

This happens because we use the innerHeight to determine whether the full screen button should be shown. But the innerHeight updates when the URL bar is shown/hidden on mobile.