The styling guide was updated yesterday to use the latest SD css syntax. The PR is still out so the changes aren't up on the site yet.
https://github.com/Polymer/docs/pull/350 On Thu, Apr 3, 2014 at 9:09 AM, Alex Komoroske <[email protected]> wrote: > > > > On Thu, Apr 3, 2014 at 9:07 AM, Martin Kleinschrodt < > [email protected]> wrote: > >> ^ and ^^ have been replaced by /shadow/ and /shadow-deep/ in SD styling >>> spec <http://dev.w3.org/csswg/shadow-styling/#inheritance>. Chrome >>> Canary picked up native support as of a few days ago (make sure to have the >>> "experimental web platform feature" flag turned on) and polyfill support >>> works in the latest 0.2.1 release. We updated the styling >>> article<http://www.polymer-project.org/articles/styling-elements.html#style-fromoutside> >>> yesterday >>> to reflect the renames. >> >> >> I was just testing this in Canary 36 with no luck. This is what the demo >> in the styling guide looks like: >> >> >> <https://lh6.googleusercontent.com/-wVf6QJcHEYQ/Uz2FlyoZj7I/AAAAAAAAAKU/r0ylPYDk_LM/s1600/Screen+Shot+2014-04-03+at+17.57.40.png> >> >> Intriguingly I get the same result with experimental platform features >> turned off. Does this mean native shadom dom is enabled by default in the >> latest Canary? >> > Yup! It passed the Intent to Ship process in Blink about a week ago, and > began its journey along the release train towards the stable channel. > > >> The polyfill seems to work as expected (both lines red in latest chrome >> without native shadow dom). >> >> On Saturday, March 8, 2014 11:34:20 PM UTC+1, Eric Bidelman wrote: >> >>> Hi Martin, >>> >>> ^ and ^^ have been replaced by /shadow/ and /shadow-deep/ in SD styling >>> spec <http://dev.w3.org/csswg/shadow-styling/#inheritance>. Chrome >>> Canary picked up native support as of a few days ago (make sure to have the >>> "experimental web platform feature" flag turned on) and polyfill support >>> works in the latest 0.2.1 release. We updated the styling >>> article<http://www.polymer-project.org/articles/styling-elements.html#style-fromoutside> >>> yesterday >>> to reflect the renames. >>> >>> Re: SASS. I opened this bug <https://github.com/nex3/sass/issues/1071> >>> against >>> the compiler some time ago, but now it's moot. The updated /shadow/ and >>> /shadow-deep combinator names work with the sass compiler. >>> >>> The other gotcha with css pre-processors is that they strip out Polymer's >>> /*@polyfill-* */ >>> directives<http://www.polymer-project.org/docs/polymer/styling.html#directives> >>> (because >>> they're comments). To address this, we've moved to a css selector based >>> approach that should be less error prone. >>> >>> Example polyfill rule: >>> >>> /*@polyfilll :host > .foo */ >>> ::content > .foo { ... } >>> >>> Is now written using `polyfill-next-selector. The value of content is >>> the selector to replace the next rule with: >>> >>> polyfill-next-selector { content: ':host > .foo'; } >>> ::content > .foo { ... } >>> >>> We don't have documentation yet, but you can read more about it in >>> https://github.com/Polymer/platform/issues/55. >>> >>> >>> >>> >>> >>> On Sat, Mar 8, 2014 at 10:56 AM, Martin Kleinschrodt < >>> [email protected]> wrote: >>> >>>> Btw, there is one issue with using SASS: It currently does not >>>> recognize the ^ and ^^ combinators as valid syntax and will throw a >>>> compilation error if you use them. >>>> >>>> >>>> On Friday, March 7, 2014 8:12:03 PM UTC+1, Ahuth wrote: >>>>> >>>>> Thanks for linke. That's a great example. I'll definitely have to dig >>>>> into it. >>>>> >>>> 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/af308274-88e3-40a4-9620-2c439724572c% >>>> 40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/af308274-88e3-40a4-9620-2c439724572c%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/b9a2273a-6fe4-40f2-9d3c-e1056ac7a51d%40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/b9a2273a-6fe4-40f2-9d3c-e1056ac7a51d%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/CAPwaZpXbcPkimkfOL%2BR1im%2BfhMNxJKAa9gRU3yaj_q2kdS88%2Bg%40mail.gmail.com<https://groups.google.com/d/msgid/polymer-dev/CAPwaZpXbcPkimkfOL%2BR1im%2BfhMNxJKAa9gRU3yaj_q2kdS88%2Bg%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/CACGqRCCom3NAVode-W3Hkho2RkAvAVZZj8q%3D0QxETTohkEDjmQ%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
