Notification menu - unnecessary white space

There is a UI bug in which there is unnecessary white space under the log out button/bottom of the notification menu. When you close it and open it again then it goes away, so it appears this happens on the inital request.

Opening the menu a second time it goes away:

latest version of chrome on windows

1 Like

I can repro in Chrome on Mac.

1 Like

It depends on the length of the topic titles in your drop-down menu.

That still shouldn’t create a block of empty space. If the title length of a topic is too long then it continues onto the next line, but this shouldn’t create space outside of the notifications list.

2 Likes

If you find it bothersome, feel free to submit a fix.

I’l try. It appears to be a bug and I was letting the team know first.

Awesome, more than happy with a fix here :sunny:

4 Likes

Fair warning, this is a difficult scenario, as the height has to be calculated dynamically based on the browser height, plus the rendered height of the topic titles, etc… and it’s done in JavaScript.

Looking for 100% perfection here is … unrealistic, but have at it.

3 Likes

This decision bit us as well, could I ask why you preferred this over a native-CSS solution?

2 Likes

The main reason is that we dynamically ask for a certain number of notifications based off the height. Its possible that we could amend our design to be a bit friendlier to abundance of notifications. It would be simpler just to have 50 notifications always and have CSS do its magic if it was possible, some of the new CSS structures may be able to pull this off. cc @awesomerobot

What we want is some CSS magic that displays this on large screens

[1]
[2]
[3]
[4]

And this when you size it down:

[1]
[2]
[3]

Without a scrollbar and without half rendered items.

8 Likes

That makes total sense :slight_smile:

1 Like