Improving automatic switching of mobile/desktop modes

Historically, Discourse has had two distinct views for mobile and desktop. Over the years, these have tended to converge towards more modern viewport-width-based design. Those modern patterns are documented here.

In the latest version of Discourse, we are replacing the user-agent-based detection of mobile/desktop modes, in favour of a purely viewport-width-based solution. This will make things much more intuitive for users and developers. In particular, this is a significant improvement for tablet users, who never really fit into either of the old modes.

All existing code which references mobileView/desktopView in templates/JS, or .mobile-view/.desktop-view in CSS, will continue to work. Those JS booleans and CSS classes are now automatically changed based on the width of the browser.

Similarly, dedicated mobile/desktop stylesheets are now loaded with a media= attribute, so that they only apply to specific viewport widths.

Essentially: “mobile mode” is now an alias for “browser width is less than 40rem”.

Initially, this change can be reverted by toggling the “viewport based mobile mode” site setting to false. However, this setting will be removed in the near future. So if you find the need to use it, please let us know the reason.

As always, please let us know if you have any questions or feedback below.

13 Likes

Had to uncheck as recent updates show mobile view on foldable phones when folded and desktop view when opened full

1 Like

Folding phones is one of the reasons that we made this change. The feedback we’ve received elsewhere is that folding phones should show more on the screen when unfolded. Showing the ‘desktop view’ there is intentional.

Is there a particular part of the UI which didn’t work well when the phone was unfolded?

3 Likes

Font size decreases, clicking on a thread or category changes from tapping anywhere on the entire line (mobile) to must tap on text (desktop), Menu goes from drop down (mobile) to taking up 1/3 of the screen on the left (desktop) thus erasing any gain in screen size. These are just a few off the top of my head. I will gather more user feedback from those with tablets.

3 Likes

We just upgraded to the most recent version and started getting complaints from users until I realised I needed to uncheck the viewport based mobile mode admin setting. A substantial number of our older community members prefer to view topics by category, so we have a navigation link to ?mobile_view=1. Will there be any way for us to give them that option once the admin setting is removed?

The viewport based mobile mode setting will be removed soon, and ?mobile_view=1 will stop working. So if you can collect some more specific feedback from users (or direct them here to share it), that would be great.

Why do you need the mobile mode for that? Can’t you link them to /categories? :thinking:

4 Likes

If it isn’t the case already, setting the site to Desktop category page style to Categories with featured topics will get the layout most like the mobile categories view (shows the categories with a few topics each).

Individuals can also go to their account preferences /my/preferences/interface and set their “Default home page” setting to categories

2 Likes

A site layout should be intuitive, as an Admin I shouldn’t need to direct any user to any page, they should just be able to find it honestly, but humans are funny, and like things the way they are.

I am not quite sure why, but this feels RUSHED. The change was forced upon everyone within the past few weeks. How soon is “soon”?

I get it, things change, but when you literally give us a checkbox to re-enable a feature that has made the site feel consistent for years and say “If you find the need to turn it off, please let us know on Meta”, expect feedback that may not align with the thought process for removing said feature.

The user interface should be consistent between having my phone folded and opened. I literally will open my phone to type a reply or see a larger image and now the way I must interact with the sites is different.

Lets not even get into the hate I got from users for Markdown Editor, or it being re-enabled with last weeks update after it was disabled in the admin the previous update.

I believe it’s to cut down on overwhelm. I can’t screenshot the forum because we handle confidential information, but there’s a lot more clutter in the Categories with featured topics mode in desktop view compared to the categories page in mobile view.

1 Like