Responsive support for dashboard?
Opened this issue · 8 comments
The current dashboard is built on Bootstrap (v2 originally, and v3 with my fork), which means responsive support should be easy if not out of the box. Problem is, the way the datetime navigator is currently structured -- .btn-group mixing with a dynamically-created progressbar -- makes things ugly and even wrong on a smaller screen:
Anyone has an idea how to fix this? I'd be happy to implement the solution.
Hard to figure a nice solution with this buttons...
Maybe single line table with table-responsive div wrapping them?
Hmm... div.table-responsive is not a bad idea actually. But then we'll need to implement at least 2 of them: the one wrapping those btn, and another for the progress bar above it.
Then, because the bar actually corresponds to the charts underneath it, we may need to wrap them into div.table-responsive as well... And how do (or should) we sync them when user scrolls horizontally?
Final concern: If users need to scroll anyway, what's the point of a "responsive" layout?
Anyway I'll find some time to implement this and let you guys know.
Final concern: If users need to scroll anyway, what's the point of a "responsive" layout?
Well, I agreed with that. But how do you want to render responsive a line of 26 buttons without some scroll ? :)
Well, I agreed with that. But how do you want to render responsive a line of 26 buttons without some scroll ? :)
Exactly. But is it a must that we use buttons? Is there another way to achieve the same purpose without them?
@phanan what is your proposition?
I don't have any :(... that's why I raised this question up. Then again, will try your solution and see how well it goes.
I've tried something, its far from perfect.
https://github.com/brantje/uptime/tree/responsive
Sooo... still not being responsive? 😢