Re: [polymer-dev] :host and parent style merging

[Rob Dodson]

Sorry this message got marked as spam.

On Mon, May 5, 2014 at 3:13 PM, Ian MacLeod <im...@google.com> wrote:

A common thing that I want to do is transition styles on :host, while also supporting transitions for the distributed nodes within the element.

http://codepen.io/nevir/pen/KHiDj

Ideally, the above example would transition the width, background, and color styles. On the flip side, it makes tons of sense for parent styles to win over :host in most cases...

My current approach is to have a wrapper node at the root of my element whenever I would want to transition something on :host. This approach feels pretty awkward, though...

I wonder if there's a better way?

Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/9ba33b18-2bf9-41e9-8e9a-960027ce3696%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Ian MacLeod]

Probably due to the codepen link - I guess I'll paste in the examples next time :P

[Eric Bidelman]

I can't think of a good way to do this without a wrapper element or touching JS. 

The same problem exists with CSS without web components. CSS Transforms is another case where people want to "mixin" additional properties like this.

For transitioning through light dom nodes, something like polymer-ui-animated-pages might be a useful to you:

http://www.polymer-project.org/components/polymer-ui-animated-pages/demo.html 

To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CAKc-BFh1sQyMcA6TCy%2BMo_c5pSMvvmkz6LP45tfXsr_7gWNckg%40mail.gmail.com.