Re: [css-variables] Examples

On Mon, Apr 30, 2012 at 9:10 AM, Jens O. Meiert <jens@meiert.com> wrote:
> Regarding the latest CSS variables draft [1], I recommend to revisit
> the examples, at least examples 3 and 4 [2], in order to build a
> stronger case for when and how variables are actually useful. It may
> be necessary to work with a lot more code to illustrate the usefulness
> of variables.
>
> Example 3 is a good example for the problem as there’s no benefit in
> using variables here.
>
> :root { color: blue; }
> div { color: green; }
> #alert { color: red; }
>
> has the same effect, is shorter and more efficient, and a lot easier
> to work with.

I've added a little bit of text to example 4 (now example 3) to make
it clearer than $main-color is probably used in multiple places in the
document, and that's why the use of it in var-accent-background
(rather than using the literal color) is justified.

Example 3 (now example 2), though, is simply intended to illustrate
that the cascade works with variable properties the same way that it
does with any other property.  The fact that the example itself can be
done by simply removing the vars is kind of the point.  However, if
you have any ideas for a better example that illustrates the same
concept without a ton of code, I'm open to changing it.

~TJ

Received on Friday, 1 June 2012 23:30:51 UTC