Page MenuHomePhabricator

Incorrect padding and lack of design in the scrollbar for tools
Closed, DeclinedPublic

Description

Now the scrollbar does not have its own design, which makes it feel like this is an interface bug. Also on the first screen, you can see that there is a huge space on top, and long words rest against the scrollbar itself.

image.png (926×1 px, 360 KB)

The screenshot below shows that the scrollbar cannot be scrolled to the very bottom, or rather, it does not display what is at the bottom, since it is outside the screen.
image.png (929×1 px, 365 KB)

Win10, the latest Chrome
https://ru.wikipedia.org/wiki/Заглавная_страница

Event Timeline

ovasileva triaged this task as Medium priority.Mar 20 2023, 3:44 PM
ovasileva moved this task from Not ready to estimate to Current Quarter on the Web-Team-Backlog board.
LGoto changed the task status from Open to Stalled.May 18 2023, 5:30 PM

Also on the first screen, you can see that there is a huge space on top, and long words rest against the scrollbar itself.

This is fixed in the new zebra design

The screenshot below shows that the scrollbar cannot be scrolled to the very bottom, or rather, it does not display what is at the bottom, since it is outside the screen.

This is by design because page tools is a sticky element, once you scroll down so that the sticky positioning is activated, the entire element and scrollbar will be fully visible inside the viewport. Note, even if we tried to work around this, things like banners would push page tools down causing this issue again.

This is by design because page tools is a sticky element, once you scroll down so that the sticky positioning is activated, the entire element and scrollbar will be fully visible inside the viewport. Note, even if we tried to work around this, things like banners would push page tools down causing this issue again.

I understand correctly that you do not have the ability to adjust the height and thereby fix this bug?

I understand correctly that you do not have the ability to adjust the height and thereby fix this bug?

Not exactly, we can set the height of page tools. The issue is that we set the height of the element based off its sticky position, i.e. when you scroll down the page. Notice page tools is entirely inside the viewport when scrolled down F37084504.

If we changed the height so that the entire element is inside the viewport at the top of the page (i.e. F37084506), the page tools element would be too small when scrolled down, and wouldnt take up the entire height of the page. Even if we did that, the solution would immediately break whenever there is a page banner or campaign. We also cant change the height of the element based off if it is sticky or not. We've also discussed this behavior with our designer, and he confirmed it is expected.

Let me know if that answers your questions. If you notice any other issues with the scrollbars in the new zebra design please feel free to comment here: https://phabricator.wikimedia.org/T332600

Thanks for answers! I don't like this solution, but I don't see how to solve it either.