W3C home > Mailing lists > Public > www-style@w3.org > June 2012

Re: [css-variables] Putting it all toegether (syntax)

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Mon, 4 Jun 2012 16:02:45 -0700
Message-ID: <CAAWBYDDCXDWmMO_z4tE03au0TpK=i8Lz3J3fFBRG1BoenaJdtQ@mail.gmail.com>
To: "Marat Tanalin | tanalin.com" <mtanalin@yandex.ru>
Cc: François REMY <fremycompany_pub@yahoo.fr>, CSS 3 W3C Group <www-style@w3.org>
On Mon, Jun 4, 2012 at 2:58 PM, Marat Tanalin | tanalin.com
<mtanalin@yandex.ru> wrote:
> I tend to consider repeating prefix (be it `my-` or any other) when using a variable somewhat redundant.

That redundancy often makes it easier to see relationships.


> Moreover, the need for prefixing itself is farfetched. Prefixing can be easily avoided while still having same advantages (inheritance, cascading, etc.) as currently drafted CSS-variables proposal has.
>
> The solution I propose is to use @-rule with scope selector passed as its _argument_:
>
>    @variables (:root) {
>        link-color: red;
>    }
>
>    @variables (header) {
>        link-color: white;
>    }
>
>    a {
>        color: $link-color;
>    }
>
> This clearly and completely removes the need for prefixing AT ALL while making variable name consistent for both defining and reading the variable.

That @variables rule is exactly identical to a normal style rule in
mechanics.  You avoid the need to put a prefix on your var names, but
in return are forced to put a prefix on your selector (the @variables
token and the parens), and probably have to repeat selectors that
you're already using to apply normal styling properties.  In order for
this to result in less typing, you have to define at least 4 (or more,
depending on the size of the repeated selector) variable properties
per block (if you're measuring against the "var-" prefix) or 15+ per
block (if you're measuring against the "$" prefix).

It also makes it less clear that variables act like every other
property, because their definitions now live in a special at-rule
instead of a normal style rule alongside the other properties.


> Also, using value in the my proposal has $ token-mark while defining value does not have $ (in the same way as recent François's proposal, but with no prefix). This clearly separates defining variable and its using.

The separation is implicit already on whether the var names is on the
left or the right of the colon.

~TJ
Received on Monday, 4 June 2012 23:03:47 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:55 GMT