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

On Thu, Apr 16, 2015 at 1:07 AM, Florian Rivoal <florian@rivoal.net> wrote:
> Looking at this example,
>
> @custom-media --schrodinger false; /*1*/
> @media not (--schrodinger) {
>   @custom-media --schrodinger true; /*2*/
> }
>
> The *2* custom media is clearly circular, making it invalid, and
> undefining the custom media query. However, *1* is not circular, so it
> looks like we could make --schrodinger be false. However I don't think
> that we should allow that. It's not only the *2* @custom-media that needs
> to be removed due to the circularity, but all @custom-media attempting to
> define --schrodinger. As for why, look at this one for example:
>
> @custom-media --schrodinger false; /*1*/
> @custom-media --heisenberg false; /*2*/
> @media not (--heisenberg) {
>   @custom-media --schrodinger true; /*3*/
> }
> @media not (--schrodinger) {
>   @custom-media --heisenberg true; /*4*/
> }
>
> If we invalidated rule by rule, removing any of 1, 2, 3 or 4 would
> remove the circularity. But it is very unclear which of the 4 that should be.
> It's much more predictable to invalidate all of them.
>
> I think the spec wording is correct, but I am not sure it is sufficiently
> clear to make this obvious. Maybe we should add the above example(s) to the spec?

Ooh, I think you're right.  Yeah, circularity should "taint" any
involved custom media names, and invalidate all definitions for them.

>>> Also, being able to using custom media in other places sounds wonderful, but does it have to be specified in a <meta>? Could a <style>, placed at an early position of <head>, containing the custom media definitions, be enough to make the custom media queries available document wide?
>>
>> Maybe; the issue is just making it easy enough for the preload scanner
>> in browsers (which is intentionally fairly dumb and fast) to get hold
>> of it.  Parsing a stylesheet enough to find the @custom-media rules
>> might be too much, which is why I'm currently thinking of using a
>> <meta>.  But maybe it's ok!  We'll find out.
>
> I'm not sure there's a meaningful difference between @custom-media and
> @viewport in this scenario.
>
> If this works
>  <style>@viewport {width: 500px; }</style>
>  <link rel="stylesheet" media="(max-width: 800px)" href="foo.css">
>
> Then this should work
>  <style>@custom-media --foo true }</style>
>  <link rel="stylesheet" media="(--foo)" href="foo.css">

I'm not sure that @viewport is parsed for the preloader!  Yoav, any
insight here?

~TJ

Received on Thursday, 16 April 2015 20:38:05 UTC