Pages that are responsive when logged out are not responsive when logged in

[Yorwba]

Context
Someone joined the XMPP chat to ask whether we have a mobile website/complain about the lack of mobile-friendly design ("if I have to zoom it's not a mobile website" – good rule of thumb, I think.) I asked about their thoughts regarding our search results page, sending the screenshot below:

They said that this wasn't what they were seeing, and after some troubleshooting, we realized that this was because I wasn't logged in on my phone.
After logging in, the same page looks like this:

I'm not quite sure, but I think this is because the menu at the top is different for logged-in users and doesn't have a responsive version yet. Since this menu appears on every page, logged-in users effectively see no benefit from the responsive design work that has already been completed.

Idea
Cram the menu for logged-in users into the space where the language selector icon would be.

[Yorwba]

This would be part of of the Responsive UI project, but it turns out that I can't add issues to the project board.

[Yorwba]

I've had a closer look at this today and found out that my guess about the menu was wrong: it does adapt reasonably well when I force the viewport to 360×640 using the responsive design tools in Firefox:

So now I'm wondering why the responsive design on the search page is only enabled for guest users. I didn't find an explanation in a comment or commit message or GitHub discussion, although #2473 does mention in the description that it only applies to non-authenticated users. @trang do you remember why?

[trang]

@Yorwba It's because we would also need to ensure that the various contributors features look fine (translating, editing, adding transcriptions, review, adding to list, and maybe other things). Maybe there would not be much to adjust, but that was additional effort that I didn't want to deal with at the time :)

[Yorwba]

Thank you for the explanation.
I did some testing locally with isResponsive forced to true.

The old design definitely doesn't look fine:

The sentence blocks expand the width of the page, requiring zooming out to see everything:

On the other hand, the new design looks OK:

The menu does appear a bit weird if it can't fit all icons into a single row:

I think it would be better to have the review buttons in a second row rather than stacking into a tall column.

While testing, I ran into some other outstanding bugs (#1614, #2355) and usability issues (when expanding the menu that includes the copy button, it's very enticing to try tapping onto the newly created whitespace to close it, but one needs to tap the sentence text instead) but the former are independent of the screen size and the latter also applies to unauthenticated users, so they shouldn't be an obstacle to making the responsive design available to authenticated users.

Since making the old design mobile-friendly is probably out of the question, how about serving the responsive search results page only if the new design is being used? (Possibly after redesigning the sentence menu so the icons wrap better.)