Several user menu items not present in smartphones

Hi. New user here, just to post this message, so sorry if it’s a duplicate (I haven’t found anything related to this, though).

On Discourse 2.8.0 there seems to be a problem with the user menu, either in a real smartphone with 375px x 667px screen, or in a virtual one (Firefox under Responsive Design Mode): as far as I have seen, the div id=“quick-access-profile” ul has a flex style that leads to some elements no being displayed on small screens.

As an example coming from discuss.pixls.us (but present in this very website, too) and captured with a real smartphone:

portrait

As far as I can tell, it seems that the flex style forces the first column to be almost as wide as the viewport, throwing those elements that don’t fit the vertical space out of the display (to the right).

As a curiosity, on my smartphone the logout element can’t be reached on a portrait view, while in Firefox under Responsive Design Mode it is the other way around (it’s in the landscape view where I can’t reach the logout element).

Hope this helps.

2 Likes

And this is the landscape view (as I’m a new user and can’t post 2 images in a single post):

landscape

4 Likes

Thanks for the detailed report! this sounds accurate. We’ll get it fixed.

4 Likes

This is fixed here:

4 Likes

Thanks! :smile:

It seems to work now here with my smartphone, although I don’t really get this:

(from github)
Increasing the breakpoint and decreasing the padding to get full coverage. Only applies to very tiny devices (even smaller than iPhone SE)

I guess you’re referring to the 2nd version of iPhone SE (based on the iPhone 8), but the iPhone 7 (mine) has the very same resolution (viewport), and it seems to be fixed for it too. So the fix also applies to iPhone SE, I think.

Anyway, it is solved now. Thanks again.

1 Like