- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Mon, 24 Oct 2011 23:30:22 -0700
- To: Boris Zbarsky <bzbarsky@mit.edu>
- Cc: www-style@w3.org
On Mon, Oct 24, 2011 at 7:42 PM, Boris Zbarsky <bzbarsky@mit.edu> wrote: > One important thing to note there there is that we currently do not have > circular dependencies between properties. There will be nothing preventing > that in this new setup; we'll need to specify how the cycle is broken. The current Variables draft, with the @var syntax, already allows for circular dependencies and handles them. All the variable declarations that are part of the cycle become invalid variables. They still define variables, just with guaranteed-invalid values: <http://dev.w3.org/csswg/css-variables/#using-invalid-variables>. I believe I can reuse the same mechanism here. Another thought occurs to me. Since I already want to allow variables referring to other variables, for use in various functions and whatnot, it seems like it would be incredibly useful to also allow you to invoke the *inherited* value of a variable. This would allow for some *really* useful effects, such as building up an increasing value as you descend the DOM: :root { data-indent: 10px; } ul { data-indent: calc( parent-data(indent) + 10px ); } (I was recently asked about this very use-case, for an example where you can't rely on stacking margins, because it has the wrong visual effect. The only current approach for it is to build up a counter value of the approximate width you want, deploy it with the counters() function, and make it invisible.) You can imagine many other useful effects, like a color lightening or darkening (or hue-shifting!) as you descend the DOM, or a transform list being built upon gradually for a stacked scale or multiple rotations. This doesn't produce any circularity problems, either, so it's a fairly easy addition mentally. (I still want the circularity-causing ability to refer to variables of the same level, though.) ~TJ
Received on Tuesday, 25 October 2011 06:59:08 UTC