Add Custom Media Queries

[ramiy]

Spec:

• https://www.w3.org/TR/mediaqueries-5/#custom-mq
• https://www.w3.org/TR/mediaqueries-5/#at-ruledef-custom-media

Browser bugs:

• Safari: https://webkit.org/b/233820
• Firefox: https://bugzil.la/1744292
• Chrome: https://crbug.com/40781325

[captainbrosset]

Can you please also generate the dist file by running npm install and then npm run dist features/custom-media-queries.yml?
Thank you.

[ddbeck]

Thanks for opening this PR. Some suggestions to get this into a mergeable condition. Thank you!

[ddbeck]

Some nitpicky suggestions to follow our guidelines around defines/sets/etc. and passive constructions. Also, I thought it would be nice to mention CSS here, like we do for other at-rules.

Suggested change

	description: The `@custom-media` rule defines a named media query, which can then be reused in multiple `@media` rules.
	description: The `@custom-media` CSS at-rule names a media query, which you can reuse in multiple `@media` rules.

[ddbeck]

I think a comment here with predicted BCD keys would be nice. Like this:

Suggested change

	# Custom media queries are not in BCD. So, there are no BCD keys we can list here yet.
	# Not in BCD yet, but expecting something like:
	# - css.at-rules.custom-media
	# - api.CSSCustomMediaRule
	# - api.CSSCustomMediaRule.name
	# - api.CSSCustomMediaRule.query

[ddbeck]

To pass tests:

Suggested change

	spec: https://www.w3.org/TR/mediaqueries-5/#custom-mq
	spec: https://drafts.csswg.org/mediaqueries-5/#custom-mq

[ddbeck]

Since nobody has shipped this (yet), you need a status block, like this:

Suggested change

	group: media-queries
	group: media-queries
	status:
	baseline: false
	support: {}