Re: Thinking about mixins as a new type of selector

On Sun, Aug 12, 2012 at 12:27 PM, L. David Baron <dbaron@dbaron.org> wrote:

...

>
>  (b) Add a new sort of selector (like a class selector, but
>      different) that doesn't match anything by default, but that
>      authors can associate with other selectors.  This is, I think,
>      quite similar to the idea of mixins present in Tab's proposal
>      [3], which is in turn similar to part of fantasai's constants
>      proposal [4], though Tab and fantasai may not have thought of
>      it as a selector.
>
....
>
>   /* box gets different styles inside the sidebar because of the
>      sidebar's background colors */
>   #sidebar $box { border: thin solid blue }
>   /* figures inside articles are all boxes */
>   .article .figure { matches: $box }
>

I believe I've implemented this idea already.
In my case these are so called style sets.
Style set covers the feature you have mentioned plus scoped styles
functionality from HTML5 spec.

Here is your example but with use of style sets:

@set box
{
   :root /* matches the element this style set is applied to */
   {
      border: thin solid blue;
   }
}

.article .figure
{
   style-set: box; /* applying style set to the figure */
}

All this works really well but with one "peculiarity":

Processing of such rules requires two step process.

1. First you need to resolve style of elements as usual.
2. In second pass, if element gets some non-empty value of 'matches'
(or 'style-set' in my case) you will need to find
corresponding rules and apply properties from them overriding
values you found at step 1.

In other words all this works as if all rules in
#sidebar $box {...}
(or in @set box {...})  have !important flag set -
such rules will have higher specificity.

Practice shows that it is not bad actually and really
makes sense.

-- 
Andrew Fedoniouk.

http://terrainformatica.com

Received on Monday, 13 August 2012 05:36:38 UTC