On small screens we are showing more headings that aren't visually necessary when on a taller screen. What options can we consider to make sure the structure makes sense regardless of what size screen you are on.
stacykon Nov 13
This only displays at small sizes, and I think it makes sense as an h2 (especially since the other "background Color" is a label and not a heading) but it is a bit weird then to have 2-3 groups of colors formats at the same heading level underneath when they should likely be <h3> but this <h2> doesn't display at larger screen sizes so Im not sure whats the better way to handle this? Maybe this isn't a heading at all and just a span with a class that makes it look like a heading?
@mirisuzanne mirisuzanne last month
I agree this is a strange situation – mainly caused by the back-and-forth background/foregroud/background/foreground source order. I wonder if we should rethink it at that level? Like what if we collapsed the format lists on mobile into a details/summary that stays connected to the correct field? Then these headings aren't needed.
On small screens we are showing more headings that aren't visually necessary when on a taller screen. What options can we consider to make sure the structure makes sense regardless of what size screen you are on.
The conversation started in https://github.com/oddbird/oddcontrast/pull/137#discussion_r1391330002 and is posted below: