ontime icon indicating copy to clipboard operation
ontime copied to clipboard

Style: scale gracefully in large screens

Open cpvalente opened this issue 2 years ago • 1 comments

The issue

Testing out ontime on screens larger than HD, we see that there is a large gap left on the right side.

localhost_3000_editor (1)

The task

The task steps are a bit up to experimentation, ideally by someone with a wide screen and some CSS patience. The task only concerns with the main app route /editor (in the screenshot)

While we might not be able to scale indefinitely there might be some things we can do:

  1. Increate root font size to 17px: this will allow the text to take more space, and potentially improve experience in high-density screens
  2. Allow rundown column to expand: Currently the rundown is capped at 44.5rem, a simple change to allow expansion could go a long way. I have tested with minmax(44.5rem, 1000px) and it seemed ok, although a real value might take some experimentation
  3. Allow central column to grow: the central column is capped at 26rem, I have not experimented but assume this could grow slightly without issues. It would take some experimentation
  4. Allow rightmost column to grow: similar as the rest, this one is capped at 800px, It would be interesting to see if we could grow this

cpvalente avatar Aug 03 '23 17:08 cpvalente

Will be looking into this next

bunday avatar Aug 07 '23 07:08 bunday

This was an issue related to v2. V3 could likely have similar issues but they should be detailed again

cpvalente avatar May 25 '24 15:05 cpvalente