Open domenic opened 5 years ago
Another thing to think about - W3C uses that same margin gutter, but entirely for its sidebar ToC. Is this something WHATWG will ever want to do? I've come to appreciate and depend on having the ToC around at all times; I often get annoyed that I have to scroll back to the top of a WHATWG document just to navigate elsewhere.
It feels like you have to decide between a margin-ToC and other marginalia.
We are growing an increasing number of margin annotations on our specs. HTML is leading the way, but others are following.
Types of annotations
Caniuse boxes
Although perhaps soon to be obsoleted by MDN boxes (see below), we have this in HTML right now: see e.g. https://html.spec.whatwg.org/multipage/workers.html#navigator.hardwareconcurrency
Fingerprinting annotations
Again see https://html.spec.whatwg.org/multipage/workers.html#navigator.hardwareconcurrency . Currently only in HTML, although there were attempts to generalize in https://github.com/whatwg/infra/pull/115.
MDN boxes
Coming to HTML in https://github.com/whatwg/html-build/pull/184. See e.g. https://arcane-cove-57093.herokuapp.com/multipage/workers.html#the-workerglobalscope-common-interface . Currently only in HTML, but I believe @sideshowbarker is working with @tabatkins on bring it to Bikeshed in general
Web platform test annotations
Coming to HTML in https://github.com/whatwg/wattsi/pull/90. I haven't seen the styles in action successfully, but judging by https://github.com/whatwg/whatwg.org/pull/230 the intent is a purple-ish box in the margin. @zcorpan is already using the Bikeshed version in e.g. https://quirks.spec.whatwg.org/#the-hashless-hex-color-quirk, where it is full-width (not a margin annotation). I like the margin annotation version.
Goals
It would be nice to design our markup/stylesheets with the following in mind:
Consistency. I think these should all look and behave roughly the same, with the same width (or just max-width?), background color, borders, collapsibility-or-not. Ideally this extends under the surface too, e.g. all of them using
<aside>
, but that's less important.Non-overlapping. Ideally these should not overlap the content of the spec, or overlap each other. At least in their default mode; perhaps when expanded overlapping is OK.
Mobile-friendly. On mobile the caniuse boxes already look back, and it just gets worse the more we add. What is a good solution here?
Proposal
A rough sketch of a proposal:
float: right
, instead of absolute positioning, so that when there are many of these things together, they stack instead of overlap each other.I'd welcome thoughts on the above.
To get from here to the above, I'd suggest:
<aside>
. This would probably require Bikeshed changes. Keep existing styles while doing so.<details>
, which is available on all mobile browsers... hmm.)