Mobile responsive view

[jerome-jay]

Hi David,
Firstly: thanks for providing this on github! this is very good and well done.
Now, I'm creating this issue because when viewing the resulting page on a mobile, the graph just does not work.
I gave a try at fixing it, but I'm really bad at frontend and got nowhere ...

If you have time for this, I'd really appreciate help ;)

[dlmcpaul]

What size does it have problems at?

The graph does get rather useless on mobile phones but should still be ok rotated on ipads etc

[jerome-jay]

Good question !
From what I can see: there's no hard limit: the smaller the width gets, the less useful the graph becomes... this could make sense, BUT highchart demo looks great on mobile (and on any width for that matter).
https://www.highcharts.com/demo/line-basic

Based on stack overflow questions, it seems like the trick is to not set the width - but I haven't found any obvious place where the width is set in your project ... which is why I'm lost and I opened this issue ;)

[dlmcpaul]

All the charts are initialised here https://github.com/dlmcpaul/EnphaseCollector/blob/master/src/main/resources/static/js/initialize.js

I don't set a width but I do set a height which might not be needed anymore since I am using Bulma to handle layout.

If I remove the height: 30% value from the charts it looks better at low sizes I think. I think it is a hangover from before flex layout when I wanted the chart to be 30% of the screen height.

[dlmcpaul]

Should be fixed in 0.22