Testing a mobile-friendly Beeminder

I’ll try to reply to everyone in one message here rather than spamming with multiple messages…

Thank you for all the reports! Please keep them coming even if it’s something you think we already know about, or is by design and therefore wouldn’t fix - we want to know about all of the use cases and preserve as many as possible.

After @wswld and @dreev objected and pointed out that the cramped goal names happen on their screens (and not just the screen width that I’d assumed was an intermediate width that few people used - that’s what I meant by “imperfections”), I reverted the fix for the misalignment that @scarabaea reported. I think there’s still a way to make this work by taking the width from the recent data column instead, but for now it’s back to the way it was. The difficulty here stems from the fact that there’s inherently misalignment if you have the graph at different sizes in different rows - if you allow for the large graph in non-expanded rows, it’s wasted space, but if you don’t, things are not going to line up.

@strickvl I’m assuming you mean the margins on the dashboard? It could be just a matter of getting used to it - after a few weeks of using beeta with the full bleed rows, going back to the fixed width in the center felt weird and arbitrarily constrained.

@johannesgaetjen I’d noticed this too but didn’t realize just how easy it would be to fix :slight_smile: Check it out now? I just set the max width of the graph to be the true width of the image. I believe that addresses all three of your concerns. Let me know if not or if there’s anything else that looks wonky to your eye.

@apolyton:

  • agree on the javascript graphs :slight_smile: I think we’re constrained by YBHP being done before that can happen.
  • what specifically would you change on the goal page?
  • similarly, what specifically would you change about the header on mobile? The links and user avatar won’t all fit on one line.
  • the forum header is based on CSS that I’m pretty sure we don’t have control over. I’d never noticed it before on mobile but I’m interpreting it as either an example of “responsive design is hard” and/or an argument for “the header on beeminder.com is actually fine because Discourse does it too” :slight_smile:
3 Likes