Opened 6 years ago

Last modified 6 years ago

#6464 assigned Bug/Something is broken

roundcube skins for mobile use

Reported by: Owned by:
Priority: Medium Component: Tech
Keywords: roundcube mobile-browser Cc:
Sensitive: no


#6462 suggests (among other issues) that roundcube's webmail UI doesn't work well on mobile devices.

There is some upstream discussion about that.

We should try to make this work for our members who are stuck with low-resolution screens and touchscreen interfaces.

Change History (7)

comment:1 Changed 6 years ago by

fwiw, i also find roundcube awkward to use from my laptop, which has a resolution of 1024×768.

However, the experience improves dramatically if i switch to the "Classic" skin instead of the default "Larry" skin.

You can switch skins by choosing "Settings" (usually all the way in the upper-right), and then "Preferences" and "User Interface". The dropdown is labeled as "Interface Skin".

comment:2 Changed 6 years ago by

Sorry, those instructions are not helpful for the iPhone 3G. My Settings don't lead me to an option to choose Preferences, and then User interface. Perhaps an iPhone user could take a look at their device, and then advise with instructions. Thank you.

comment:3 Changed 6 years ago by

To be clear: i'm talking about the "Settings" button within the roundcube web page, not any sort of "Settings" option on the iPhone itself.

comment:4 Changed 6 years ago by

  • Owner set to
  • Status changed from new to assigned

comment:5 Changed 6 years ago by

  • Owner deleted

Sorry, i don't have any sort of mobile phone at all to test with. I'm pretty sure i'm not the best person to take responsibility for this ticket.

comment:6 Changed 6 years ago by

One idea that occurred to me (which i don't plan on implementing myself) is a roundcube plugin which just injects a bit of javascript and session state. The goal would be to help users of mobile browsers and other constrained environments switch into the "classic" skin.

It would do the following:

It adds a tri-state session variable (maybe store it as a cookie?) called maybe "mobileskin" -- "yes,no,unknown" which defaults to "unknown".

It also adds a position: fixed div named "mobileskinquery" to the DOM. That div says something like "you've got a small browser. [Switch to classic skin?] [x]" (the [x] is a "dismiss" button). mobileskinquery is initially display: none.

  • if the current skin is *not* "classic:
    • if mobileskin is "unknown" and the current page has a horizontal scrollbar, show the floating div
  • if the user clicks on "Switch to classic skin", change the choice of skin, set mobileskin to "yes", and change the text in mobileskinquery to describe how to change it back if the user wants.
  • whenever the "dismissed" button is clicked, set mobileskin to "no" and hide the mobileskinquery div.

It might be nice at some point to do user-agent sniffing as well, but the above seems like a reasonably-principled and simple approach.

comment:7 Changed 6 years ago by

#6599 proposes a change that might make the current skin slightly more usable.

Please login to add comments to this ticket.

Note: See TracTickets for help on using tickets.