Closed
Bug 1486527
Opened 6 years ago
Closed 4 years ago
Use :is(…) selector and PostCSS to improve indicator snugging
Categories
(developer.mozilla.org Graveyard :: Design, enhancement, P5)
Tracking
(Not tracked)
RESOLVED
WONTFIX
People
(Reporter: e7358d9c, Assigned: e7358d9c)
References
Details
(Keywords: in-triage, Whiteboard: [specification][type:feature][points:1])
Attachments
(1 file)
What problem would this feature solve?
======================================
Right now, the indicator snugging stylesheet only snugs up indicators which match the following selectors:
- .warning + .warning
- .warning + .overheadIndicator
- .overheadIndicator + .overheadIndicator
- .note + .note
Who has this problem?
=====================
All visitors to MDN
How do you know that the users identified above have this problem?
==================================================================
Places where some, but not all indicators are snugged look ugly.
How are the users identified above solving this problem now?
============================================================
By wrapping all indicators in a <div> to avoid empty <p>s, using ugly CSS hacks and adding the `overheadIndicator` class to every indicator present.
Do you have any suggestions for solving the problem? Please explain in detail.
==============================================================================
- Use the :matches(…) selector
- For browsers which don’t support the :matches(…) selector (i.e. Firefox and bug 906353), use the PostCSS postcss-selector-matches plugin to expand the :matches(…) selector into all possible combinations (depends on bug 1366868).
Is there anything else we should know?
======================================
Comment 2•6 years ago
|
||
Commit pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/df9f8d444d0535690e81cc8576097f348dfaec71
bug 1486527: Improve indicator snugging
Multiple indicator sections are separated by whitespace unless hacks and
CSS classes are applied. Use the :matches selector to add some more
automatic "snugging", with auto-expanded rules for browsers (like
Firefox) that don't support :matches, since PostCSS will require
additional work to integrate into the asset pipeline (bug 1366868).
Comment 3•6 years ago
|
||
Commits pushed to master at https://github.com/mozilla/kuma
https://github.com/mozilla/kuma/commit/982a64f58f41e07f0ceded537adc65133ba31397
bug 1486527: Improve indicator snugging
Multiple indicator sections are separated by whitespace unless hacks and
CSS classes are applied. Use the :matches selector to add some more
automatic "snugging", with auto-expanded rules for bowsers (like
Firefox) that don't support :matches, since PostCSS will require
additional work to integrate into the asset pipeline (bug 1366868).
https://github.com/mozilla/kuma/commit/b8ce8cdb12585a58ad260ec2091ed18ac1d437d3
Merge pull request #4958 from jwhitlock/indicator-snugging-1486527
bug 1486527: Improve indicator snugging
Comment 4•6 years ago
|
||
Expanded CSS pushed to production. I'm not sure if we should close this bug, or leave it open and blocked by bug 1366868.
(In reply to John Whitlock [:jwhitlock] from comment #4)
> Expanded CSS pushed to production. I’m not sure if we should close this bug,
> or leave it open and blocked by bug 1366868.
We can leave it open.
Updated•6 years ago
|
Priority: -- → P5
Whiteboard: [specification][type:feature] → [specification][type:feature][points:1]
Summary: Use :matches(…) selector and PostCSS to improve indicator snugging → Use :is(…) selector and PostCSS to improve indicator snugging
Comment 6•4 years ago
|
||
MDN Web Docs' bug reporting has now moved to GitHub. From now on, please file content bugs at https://github.com/mdn/sprints/issues/ and platform bugs at https://github.com/mdn/kuma/issues/.
Status: ASSIGNED → RESOLVED
Closed: 4 years ago
Resolution: --- → WONTFIX
Updated•4 years ago
|
Product: developer.mozilla.org → developer.mozilla.org Graveyard
You need to log in
before you can comment on or make changes to this bug.
Description
•