mdn / yari

The platform code behind MDN Web Docs
Mozilla Public License 2.0
1.19k stars 508 forks source link

Consider adding a legend to CSS formal syntax #6962

Open wbamberg opened 2 years ago

wbamberg commented 2 years ago

Currently we explain various bits of the formal syntax by making parts of it (combinators and multipliers, for example) into links to the relevant section of https://developer.mozilla.org/en-US/docs/Web/CSS/Value_definition_syntax. We could perhaps make this more discoverable by including a legend in the formal syntax box.

From https://github.com/orgs/mdn/discussions/207 and in particular https://github.com/orgs/mdn/discussions/207#discussioncomment-3478066:

I imagine a little (i) icon or the word "Legend" at the top right corner of the syntax box. It would be sticky positioned so it's always visible. Clicking on it would show the legend explaining the different combinators and multipliers and also link to the syntax definition page.

caugner commented 2 years ago

We would definitely welcome any contribution that makes those explanations more discoverable.

Ideally we should discuss a mock-up of how it could look in this issue, before we go ahead and open this for PR contributions.