Re: New CSS variables syntax in latest WebKit

On Jul 25, 2008, at 2:01 PM, Tab Atkins Jr. wrote:

>  @-webkit-variables and @-webkit-define are identical in effect,  
> just different names, right?

Right.

> I haven't tested yet, but do these work intuitively within @media  
> blocks in the current implementation?  If not, are they expected to?
>

No, they don't work in @media blocks.  At the moment variables must be  
defined at the top of a stylesheet (just after the @imports).  As with  
the @import rule, variables rules support media queries built in, e.g.,

@define for print { ... }
@variables print { ... }

instead of

@media print { @define { ... } }

If we want variables to work inside @media blocks, we'd basically have  
to relax the restriction that variables rules must be at the start of  
the stylesheet.  (There is no implementation hurdle to doing so...  
this basically just comes down to syntactic preference.)

> Currently it appears that the variables syntax is only for single  
> values, to be used in the normal manner where the variable  
> dereferences into a keyword.  Is this correct?  If so, is it  
> expected that there will be a syntax for assigning entire sets of  
> values?
>

There are ongoing discussions about this, but basically yes.

@define {
	simpleVariable: green;
	complicatedVariable {
		background-color: red;
		color: blue;
	}
}

div {
	color: =simpleVariable=;
	=complicatedVariable=;
}

(Substitute in whichever syntax you like best for variable  
references.) :)

dave

Received on Friday, 25 July 2008 19:33:34 UTC