web: body should not exceed viewport height, and scroll action should always be captured by middle column

[llllvvuu]

Describe the bug

• If your mouse goes over left or right sidebar, you stop scrolling
• You can scroll past the bottom of the middle column if the left nav is taller than browser

To Reproduce

Steps to reproduce the behavior:

1. Make your browser height really small
2. Scroll to the bottom of the feed and then scroll further, OR scroll while hovered over side bars (if browser is not small, this just blocks, which is also not ideal)

Expected behavior

Should be able to scroll poasts with mouse anywhere. Should not go offscreen.

Screenshots

Details

• Platform: MacOS Chrome Version 113.0.5672.92 (Official Build) (arm64)
• Platform version:
• App version: main 0ca09613

Additional context

If we agree on the expected behavior, I would be happy to provide a fix.

[pfrazee]

agree this is an issue, accepting a fix depends on how the fix is implemented

[llllvvuu]

Unfortunately I was only able to fix the first part of this (overflowing): #762

The scroll capture part is trickier because the <ScrollView>/<CenteredView> is a sibling of the <LeftNav> and scrolling only bubbles up to the parent.

The reason it works on Twitter Desktop is that they put the super long <main> container directly under the parent, so that the parent can just overflow: scroll. But we can't do that, because React Native ScrollView is a fixed-height wrapper.