Re: [css-variables] Adding a default value to var()

Well if you do need defaults, I suggest that you do it using guarded
assignment like we do in Sass, instead of at read time -- the point is to
to eliminate duplication :P

:root {
  var-user-bg-color: blue;
}
:root {
  var-user-bg-color: black !default;
}
body {
  background-color: var(user-bg-color) /* blue */;
}


Chris

On Mon, Apr 2, 2012 at 10:33 PM, Tab Atkins Jr. <jackalmage@gmail.com>wrote:

> On Mon, Apr 2, 2012 at 8:24 PM, Chris Eppstein <chris@eppsteins.net>
> wrote:
> > We have default values for variables in Sass, but I do not think they are
> > necessary in CSS variables because the value is resolved after the
> cascade
> > is applied. As such, you can set the value to the default value and the
> > consumer of the "themeable" stylesheet can always override that value if
> > they choose to in their own stylesheets.
>
> The problem with that is that they need to ensure that their rule wins
> in the cascade, which isn't always trivial.  In some cases, such as
> Web Components, it may even be impossible, since you can't target
> selectors into the component (it's intended that inheritance will
> transfer variables from the component's root into the shadow tree,
> where they can be used in styles).
>
> That's also not an option if we try to merge Variables and SVG
> parameters, since the "provider" of the explicit variable values isn't
> using a stylesheet to do it at all.
>
> ~TJ
>

Received on Tuesday, 3 April 2012 06:01:25 UTC