Re: Media Query Variables

On 11/13/13 10:18 PM, "Tab Atkins Jr." <jackalmage@gmail.com> wrote:

>On Wed, Nov 13, 2013 at 8:48 PM, Bruno Racineux <bruno@hexanet.net> wrote:
>> Any possible prospect or technical ability to apply them to classes
>> directly? Such as:
>>
>> .myclass@('small'){
>> }
>
>Can you elaborate on what you mean by this?

Having a MQ var could have the benefit of declaring "MQ dependent" styles
individually by using a media-var shortcut in a "pseudo" fashion.

So with:

<style>
  @media-var 'small' (max-width: 20em);
</style>

Doing:

.myclass@('small'){
}

Becomes the shorter syntax equivalent to:

@media('small'){
  .myclass{
  }
  /*...*/
}

It would free the need to having to double wrap everything in single large
MQs. And a convenient way to isolate and identify a class attached
specifically to an MQ set and nothing else.


Or rather, think of it as a perhaps more appropriate syntax:

.myclass@media('small'){
}

Though the long form becomes much less of a shortcut.

Received on Thursday, 14 November 2013 07:10:08 UTC