Re: [css-variables] Non-inherited custom properties (Issue 5)

One case could be if you would like to flag an element, but not have the
same applied to nested elements. For example, highlighting a moderator in a
nested list of messages:

<div class="message">
    <div class="moderator message">
        <div class="message >

.moderator {
    var-highlight-color: #fe6;
}

.message {
    background-color: var(highlight-color, #eee);
}

This would also apply the highlight to the nested message, which is not
intended. With components, this becomes even more interesting, as you would
want to inherit across the shadow boundary, but not within the main DOM
(e.g., just replace <div> with <x-message> above).

That said, there should be a workaround in that one can just reset the
variable at every applicable element and have that overridden by more
specific rules:

.message {
    var-highlight-color: initial;
    background-color: var(highlight-color, #eee);
    // using a fallback in case more specific rule may reset to 'initial'
as well
}

.message.moderator {
    var-highlight-color: #fe6;
}


- Roland



On Fri, Sep 7, 2012 at 4:11 AM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:

> On Thu, Sep 6, 2012 at 2:48 AM, François REMY <fremycompany_pub@yahoo.fr>
> wrote:
> > There have been many request for non-inherited custom properties.
> However,
> > it’s impossible to specify them in the file in a good way, which makes
> them
> > basicly impossible.
> >
> > My proposed solution (don’t necessarily assume Brian and Chris support on
> > this) would be a ‘use-declared()’ function that only takes in
> consideration
> > the specified value of the referenced property if it was explicitely
> defined
> > on the element (so, not if its initial state or inherited value are in
> use).
>
> I'm interested in solving this, either at the point of reference (as
> you suggest) or at the point of definition (in the custom property).
>
> However, I'm not sure it *needs* to be solved.  Do you have some
> examples of things that are problematic if variables always inherit?
>
> ~TJ
>
>