> -Chrome 33 > Polymer as a fit, spins and spins then either Chrome dies or loads after > a very intense process (guessing bug?).
That sounds like a bug and let's separate it from the design question here. It may be related to loading and/or shimming specific stylesheets to work in the polyfill. We'll be happy to investigate a test case. I'm interested if there is a proposed solution for global styling. Our team has been discussing this but there's not yet an accepted solution. In the native implementation duplicate style elements are optimized such that they share resources. However, style elements that load remote resources (e.g. @import, link rel) cannot be shared. There's been discussion of adding an api on shadowRoot that says, 'make a given (potentially document level) stylesheet apply here'. On Thu, Feb 27, 2014 at 8:58 AM, Justin Merz <[email protected]> wrote: > Sorry if this is a repeat, most of the Global CSS discussions I have > found are quite old in comparison to the age of Polymer. I have an app > using 50+ polymer-elements and have been using the (now deprecated?) > applyAuthorStyles to bleed in my apps css. This has and continues to work > when using the polyfill Shadow Dom. Recently I have been trying to get the > app working in Canary with 'Experimental Web Platform features' turned on. > The native Shadow Dom is not allowing and global css to bleed in. I went > ahead and created a single css file which I imported as <link > rel="stylesheet"> inside my <template> tags so I would be doing things the > Web Component way. It should be noted that about 40% of my elements are now > accessing the same css file. This worked great in Canary but tanked > Polymer in Chrome 33. Here are my results from some tests: > > -Chrome 33 > Polymer as a fit, spins and spins then either Chrome dies or loads after > a very intense process (guessing bug?). > > -Chrome 33 vulcanized > Works. > > -Chrome Canary (35) w/ experimental platform features on > Works > > I'm interested if there is a proposed solution for global styling. I > understand the use case of wanting to encapsulate widgets but throwing out > the use of global css because everything is an elements seems off to me. > I'm just using standard libraries such as bootstrap, font-awesome, > animate.css and it just seems odd that I would have to import every global > css file into every widget or do something like use Grunt to pre-compress > my global css from Bower into a single file (which at least has me only > importing one stylesheet). Specially when you are building application > specific elements that are never intended to live elsewhere. > > So, this all said, what approach should I take? Is the inclusion of a > single 'app' css file the way to go in all of my elements and I should I > look to file a bug for Chrome? I am missing something about allowing > global css to pass through the Shadow Dom (w/o appending a lot of ^^ to > standard css libraries)? Or another option that I am missing? > > Thanks in advance. Love the library and all the promise it shows. > > > > 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/46769bee-b1f2-4c42-bc47-5d1255871f72%40googlegroups.com > . > For more options, visit https://groups.google.com/groups/opt_out. > 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/CA%2BrMWZhQ36_N3-VWi7PbfMArCH8YMDhxwcNVEmg-yDT0H6Kn5w%40mail.gmail.com. For more options, visit https://groups.google.com/groups/opt_out.
