Re: [css-cascade][mediaqueries] Allow custom mq before @import?

On Wed, Apr 1, 2015 at 10:21 PM, Glen Huang <curvedmark@gmail.com> wrote:
> Currently, the CSS Cascading and Inheritance Level 4 spec says the only rule allowed before @import is @charset. I wonder if custom mq could be allowed too?
>
> ```css
> @custom-media --narrow-window (max-width: 30em);
> @import “style.css” (--narrow-window);
> ```

I get where you're coming from, but this partially defeats the purpose
of the "@import must come first" restriction, which is to keep the
interleaving of imported stylesheets simple.  Right now, you can
pretend that @import'd stylesheets are completely separate sheets that
appear just before the importing sheet in document order (except for
the effects of @charset).  This makes implementation simpler - all
rules/etc from a given sheet are guaranteed to be totally before/after
the rules in any other sheet, not interleaved in ways that require
more complicated tracking.

If we allowed @custom-media first, though, then we have to worry about
this more complicated interleaving, since the imported sheet might
define --narrow-window as well (overriding the definition in the
importing sheet).  This isn't circular or anything, but it is
complicated in ways that we currently don't have to handle in
implementations.

That said, I think it's valuable to be able to use custom MQs in very
wide contexts, including in HTML (for <link media>, <picture><source
media></picture>, etc), and so I think I need to define a <meta> value
that defines a custom MQ as well, so you can easily define
document-wide MQs.  (This would also make them accessible to the
preload scanner for <picture> purposes, which is great.)

~TJ

Received on Wednesday, 8 April 2015 00:38:29 UTC