ONSvisual/Simple-charts

Desktop / mobile view automation not really fit for purpose

FrankDonnarumma opened this issue · 1 comments

Might be good to re-visit the widths we are using.

  • do we need 3? maybe we could get away with 2?
  • however many we have, revisit pixel values.
  • could do with looking at what happens to annotations and direct line labels on mobile. Do they always need to fall off or can we be more subtle?

I've had a think already, I think the widths we should use are

  • 320px (iPhone 5)
  • 375px (iPhone 6/7/8)
  • 414px (iPhone 6/7/8+)
  • 700px (ONS website standard embed)
  • 944px (ONS website full width)
    Source: https://www.screensizemap.com/

Having these five widths means we can use these as bootstrap grid sizes xs,s,m,l,xl.

The only issue is that when we I frame things into the ONS website, it add padding so for example if we get a chart working down to 320px, it actually needs to be squeezed into 288px after the iframe's padding has been taken into account.