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 On Tue, May 6, 2014 at 10:23 AM, 'Ian MacLeod' via Polymer < [email protected]> wrote: > Probably due to the codepen link - I guess I'll paste in the examples next > time :P > > > On Tue May 06 2014 at 9:32:17 AM, Rob Dodson <[email protected]> wrote: > >> Sorry this message got marked as spam. >> >> >> On Mon, May 5, 2014 at 3:13 PM, Ian MacLeod <[email protected]> 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 [email protected]. >>> To view this discussion on the web visit >>> https://groups.google.com/d/msgid/polymer-dev/9ba33b18-2bf9-41e9-8e9a-960027ce3696%40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/9ba33b18-2bf9-41e9-8e9a-960027ce3696%40googlegroups.com?utm_medium=email&utm_source=footer> >>> . >>> For more options, visit https://groups.google.com/d/optout. >>> >> >> 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 [email protected]. > To view this discussion on the web visit > https://groups.google.com/d/msgid/polymer-dev/CAKc-BFh1sQyMcA6TCy%2BMo_c5pSMvvmkz6LP45tfXsr_7gWNckg%40mail.gmail.com<https://groups.google.com/d/msgid/polymer-dev/CAKc-BFh1sQyMcA6TCy%2BMo_c5pSMvvmkz6LP45tfXsr_7gWNckg%40mail.gmail.com?utm_medium=email&utm_source=footer> > . > > For more options, visit https://groups.google.com/d/optout. > 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 [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CACGqRCA2_qKrSTz88CrAAO7%2BbNc-o5PsW_yuEBNNsytPmveRqw%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
