Responsive CSS themes

[pakricard]

Hi all:
After I rolled the newest CSS themes into my installation, users complained about how ugly webERP looks on mobile devices.

Has anyone done any research or work on how to turn any of the current themes into fully responsive?

Does it imply a rewriting of the php scripts, or just the css files?

Any input would be appreciated
R

[andrewcouling]

I did some work on this some years ago using a bootstrap lite css framework. I have a feeling its still installed on a webserver. I'll try to locate it and share a link. My conclusion at the time was that all PHP scripts would need to be revised.
My more recent research has been related to progressive we apps. In addition to being responsive (in most cases), one of the main benefits of a PWA is the ability to install a web app as an 'app' on a mobile device. I think this would be a very cool feature for webERP.

[andrewcouling]

Here is the site: https://weberp.couling.org/
I only worked on a few PHP scripts as an experiment. UserSettings.php was one of them.
Not a great example as I managed to break the navigation functionality, but it shows what can be done visually with little effort.
I'm sure CSS frameworks have moved on since I played with this 4+ years ago.

[dalers]

Here is the site: https://weberp.couling.org/

Amazing! Very nice look @andrewcouling! :-)

[hinjolicious]

I like it. It looks good. Time to make it happen!

[hinjolicious]

The sub-menu is not displayed correctly; maybe it is caused by a simple typo in the code.
To display an 'inventory' menu, I can type this manually: https://weberp.couling.org/index.php?Application=stock.

Strangely, after I tried that, opening the other menus seems to work fine.

The problem arises again after opening an option; it fails to open other modules.

It works again after selecting 'Settings'.
I think this issue is related to some variables not being re-initialized correctly.

[pakricard]

Many thanks, @andrewcouling.

That is what I was looking for. Even if maybe not 100% responsive, it is a massive improvement from the current themes, when used in small mobile devices (below the 10'' screen).

But you mentioned PWA. I had no idea it even existed…

In your opinion, what is the best course of action? Move to a responsive theme as a first step, and as a second step, move towards PWA? Or going directly into PWA? Just do a fully responsive theme?

it shows what can be done visually with little effort.

: In terms of coding changes in any given (average) script: Which are the changes required?

[hinjolicious]

Bootstrap css is a responsive css, but the menu presentation should be structured accordingly.
The real problem is with the data presentation which can be large and wide, maybe we could display it in a scroll-able window?