[css-cascade] Allowing @import to be conditional on @supports queries

Right now, @import can only be made conditional on Media Queries, by
putting a media query after the URL in the rule.

However, it would also be useful to let it be conditional on the
result of an @supports query.  That way, for example, one could send
some small, compact code using modern features, and if an @supports
query returns false, instead @import larger, more complicated code
(perhaps generated by a preprocessor from your base code) to do the
styling instead.  This avoids having to send both sets of styles to
most people; only down-level browses would have to spend the
additional bandwidth.

I propose that we allow this by adding a
"supports(<supports-condition>)" function to the end @import grammar,
like:

```
@import [ <url> | <string> ] [ <media-query-list> ||
supports(<supports-condition>) ]? ;
```

In other words, you can supply a media condition and/or a supports
condition.  If we add more conditional rules, we can add more to this
clause as well.

Thoughts?

~TJ

Received on Friday, 16 January 2015 00:36:45 UTC