Apologies, I never did a dry run from the repo, cleaned up a could things 
and should work now: 

https://github.com/jrmerz/polymer-stylesheet-loading


On Saturday, March 1, 2014 7:32:47 PM UTC-8, Justin Merz wrote:
>
> So I have attempted to put together an example, wasn't sure how to do it 
> w/ jsbin.  Here is a simple node server that will create a tree of n depth 
> with x number of elements at each depth (so you can modify app size). 
>  Finally there is a flag to include stylesheets into each node or not. 
>  Note the load difference between including a stylesheet and not including. 
>  base.css has bootstrap, font-awesome, animate.css included in it.
>
> https://github.com/jrmerz/polymer-stylesheet-loading
>
> Flags are in mkele.js:
> // how deep the element tree should be
> var depth = 3; 
> // how many elements at each level 
> var eleCount = 4; 
> // should a stylesheet be included 
> var noStyle = false;
>
> On Thursday, February 27, 2014 2:12:07 PM UTC-8, Justin Merz wrote:
>>
>> Thanks.  I'll try put together a sample of the badness for you to inspect.
>>
>> And +1 for the 'make a given (potentially document level) stylesheet 
>> apply here' flag.
>>
>> On Thursday, February 27, 2014 10:19:27 AM UTC-8, Steve Orvell wrote:
>>>
>>>
>>> -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/ebde9858-d4be-4051-b8bd-21663a105d18%40googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

Reply via email to