theyosh / TerrariumPI

Home automated terrarium/aquarium or other enclosed environment with a Raspberry Pi
https://terrarium.theyosh.nl
GNU General Public License v3.0
408 stars 98 forks source link

[BUG]: Mobile responsive view #893

Closed manolof closed 6 months ago

manolof commented 7 months ago

Setup:

Describe the bug The mobile version of the app is not fully responsive; the user cannot access certain parts of the app. For example, the navbar is not visible due to it being set to display none.

Screenshot 2024-02-19 at 20 13 58

In addition, charts are not loading nicely.

Screenshot 2024-02-19 at 20 14 14

To Reproduce / Installation steps Run the app and navigate to the main page. Use either a mobile phone browser or devtools on a desktop browser.

Expected behavior Mobile users, especially those on the go using dataplicity or pitunnel, need to access more features of the app, in order to manage it more effectively.

Additional context Not sure if this is intentional for any specific reason, or if there wasn't enough time or interest in making it more mobile friendly, but I'd be happy to contribute to fixing this eventually.

theyosh commented 7 months ago

Yeah, I am a back-end developer. Learned Svelte for front-end. But still I am not a skilled front end developer. And mobile even worse. The screens are just to small ;). So I did not pay that much attention to mobile. Goal was an iPad size screen.

Also, some parts of the code, like the gauges, are old javascript code, which is not mine. But those gauge do not scale well, as they use SVG canvas.

So I have not enough front-end knowledge to make this better.

But if you are handy with front-end, and has some experience with javascript front-end frameworks, you could try to setup the svelte code and update the javascript code. For me, it will take to much time, and I do not own an Android or iPhone. So testing is also a bit harder for me.

theyosh commented 6 months ago

So thanks for the PR. Will update the docker containers once more