search

sidstamm / energymonitor

Monitors energy usage (and production) and displays reports through a web site.
Mozilla Public License 2.0
3 stars 0 forks source link

UI sucks on mobile devices #3

Open sidstamm opened 6 years ago

sidstamm commented 6 years ago

Need to make the UI (particularly in the paging branch) better on mobile. It's pretty crappy.

sidstamm commented 6 years ago

Fixed some of this in commit 6af04b91278773badc843141f06bd54b879ba6f8. The SVG element now resizes to fit width of the screen.

Still need to figure out how to maximize use of available space in portrait and landscape modes. Maybe there should be three modes:

  1. portrait mobile (full screen use with controls above/below graph)
  2. Landscape mobile (full screen use with controls left/right of graph)
  3. desktop mode
sidstamm commented 5 years ago

Updated UI in commit d220dad to put the legend and zoom buttons into graph, make left/right buttons bigger, and hide the header when rotating on mobile device. Still needs more deliberate design and testing.

Useful Reference: https://www.htmlgoodies.com/beyond/css/targeting-specific-devices-in-your-style-sheets.html