Reader over scroll behavior

[viktor-yakubiv]

It would be nice to have over-scroll behavior in the Reader that also introduces CORE. The ideas is following:

When the user scrolls to the end of the pages, pages fall to the background and on the foreground related papers are showing.

The idea of branding is not in the bottom overlapping bar but in the top one. On over-scroll regular CORE toolbar should be displayed.

The example below may be more comprehensive.

Example 🚀

See at CodePen

However, the example requires a lot more work in the following steps:

• scrollbar and scrolling container should be a single one
• wheel events must be replaced with IntersectionObserver

Open questions

1. Is this good interface behavior from the UX point of view?
2. Do we need this?

@Joozty what do you think?

[viktor-yakubiv]

Without implementing things above it's better to have smaller fixes that work in the following way:

• toolbar and sidebar should stay fixed at the top if user over scrolls
• the rest of content over scrolls with user action
• if user scrolls the sidebar, its content over scrolls with user action
• gray background covers whole area, i.e. if user over scrolls, no white lines should appear on the top and the bottom

In addition, body styles should change only with componentDidMount and componentWillUnmount