Hide the top bar in post template on mobile devices when the viewer continues to scroll down

[linhandev]

Checklist

• I have read the contributing guidelines.
• There is no similar request on existing issues (including closed ones).
• I have read the project progress and know the current progress of the project.
• I was in the master branch of the latest code.

Is your feature request related to a problem? Please describe

No. I'd consider this as an enhancement when viewing blog content on horizontal small screens.

Describe the solution you'd like

Automatically hide the top bar when

1. content is displayed on a small screen
2. the user keeps scrolling down for a certain distance

And display the top bar back when the viewer start scrolling up.

Describe alternatives you've considered

Additional context

I was doing some note taking. The post contains many long bullet lines so it's more preferable to view then horizontally on mobile devices. The address bar for chrome will hide itself when I'm scrolling down, giving the content more space. I think if we can implement something similar with the top bar of the post page, it will give even more space for the content and would make reading easier.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[cotes2020]

It is a good idea to automatically hide the top bar on mobile devices, but I think this is only necessary for landscape orientation, not for portrait orientation, because now mobile phone screens have a large aspect ratio.

[linhandev]

I agree, it should be very nice to have this feature in landscape.

[LouisTay]

有没有办法把这个功能关闭啊？我就是想要一直有top bar，本来这个top bar的设计我就觉得很好啊，很简洁也不占地方，为啥要隐藏？这样在手机上反而不方便到主页，还需要上滑一下调出top bar。
而且我看这个在电脑端也有bug，有时候会回到顶部了，top bar还自动消失了。

2022-03-22.12.40.00.mp4