Re: @else in Media Queries

> 
> On Jun 14, 2016, at 04:13, Tab Atkins Jr. <[email protected]> wrote:
> 
> On Sat, Jun 11, 2016 at 12:54 AM, Mark Brown <[email protected]> wrote:
>> On Sat, Jun 11, 2016 at 5:42 PM, Daniel Glazman
>> <[email protected]> wrote:
>>> On 11/06/2016 09:34, Sebastian Zartner wrote:
>>> 
>>>> Coming back to this option, why is nesting the @else rule that bad? Sure, in
>>>> other languages you have it outside of the first block, but it clearly
>>>> connects both visually and avoids the problems of a dangling @else
>>>> block.
>>> 
>>> Because an invalid MQ would trash the whole thing including the nested
>>> @else, per error handling rules...
>> 
>> Has anyone considered something like
>> 
>> @switch {
>>     @case C1 { ... }
>>     @case C2 { ... }
>>     @default { ... }      /* optional */
>> }
>> 
>> ?
> 
> That's identical to the current proposal, just with an extra level of
> nesting.  I don't believe the current proposal is error-prone enough
> to justify adding an additional rule.  (People don't screw up their
> if-else chains regularly in other languages.)

There would be some benefit if you compare these two things

@media screen {
 /*foo*/
}
@when media(width < 400px) {
 /*bar*/
}
@else {
 /*tweedledee*/
}

vs

@media screen {
 /*foo*/
}
@switch {
 @case media(width < 400px) {
   /*bar*/
 }
 @default {
   /*tweedledee*/
 }
}

They do exactly the same, but the later one is more robust to naive removal (via javascript or otherwise) of the conditional enclosing "bar". In the @when case, the @else gets mistakenly attached to the @media rule, while in the switch case it doesn't.

Not that I am convinced this is worth the increase in verbosity, but it does have this advantage.

- Florian