Re: Controling style of elements in Injection Points

And here's yet another version that should be usable in Stable Chrome and
Canary: http://codepen.io/anon/pen/ybEch


On Tue, Dec 10, 2013 at 4:08 PM, Daniel Freedman <dfreedm@google.com> wrote:

> I've updated your pen with the other minor syntax changes that have
> occured in Chrome Canary:
>
> @host -> :host
>
> template.content.cloneNode(true) -> document.importNode(template.content)
>
> ::content p {} will always win over ::content {}, so I moved the black
> color to the style for p { }
>
> http://codepen.io/anon/pen/tcjeh
>
>
> On Tue, Dec 10, 2013 at 2:58 PM, Enrique Moreno Tent <
> enriquemorenotent@gmail.com> wrote:
>
>> Thank you all! Finally I understand how it works :)
>>
>> I made a small pen to illustrate this better
>> http://codepen.io/dbugger/pen/Hyihd
>>
>>
>> On 1 December 2013 23:35, Daniel Freedman <dfreedm@google.com> wrote:
>>
>>> ::content is behind the "Experimental Web Platform Features" chrome
>>> flag, along with the unprefixed createShadowRoot.
>>>
>>>
>>> On Fri, Nov 29, 2013 at 6:00 AM, Enrique Moreno Tent <
>>> enriquemorenotent@gmail.com> wrote:
>>>
>>>> I have actually have gotten to work with ":-webkit-distributed(p)" but
>>>> as I read it has been deprecated and ":content p" should work (but it
>>>> doesnt).
>>>>
>>>> Do I need maybe to activate a flag? Im using Chrome 31 under Ubuntu, in
>>>> case it matters.
>>>>
>>>>
>>>> On 28 November 2013 18:39, Enrique Moreno Tent <
>>>> enriquemorenotent@gmail.com> wrote:
>>>>
>>>>> Thank you :) But it is quite confusing to understand how it works. I
>>>>> have tried to update my example, but still doesn't seem to work. Could you
>>>>> tell me, in my example, what would be the selector? I tried "p::content",
>>>>> but as you see that doesnt seem to work.
>>>>>
>>>>> My use case example, again, is here:
>>>>> http://codepen.io/dbugger/pen/Hyihd
>>>>>
>>>>>
>>>>> On 28 November 2013 09:58, Hayato Ito <hayato@google.com> wrote:
>>>>>
>>>>>> Yeah, Chrome has already implemented that. I've implemented that. :)
>>>>>>
>>>>>>
>>>>>> On Thu, Nov 28, 2013 at 6:25 PM, Enrique Moreno Tent <
>>>>>> enriquemorenotent@gmail.com> wrote:
>>>>>>
>>>>>>> Oh, interesting! Has this been implemented in any browser?
>>>>>>>
>>>>>>>
>>>>>>> On 28 November 2013 08:46, Hayato Ito <hayato@google.com> wrote:
>>>>>>>
>>>>>>>> We can use '::content' pseudo elements if we want to apply styles
>>>>>>>> to distributed nodes from a shadow tree.
>>>>>>>>
>>>>>>>> See
>>>>>>>> http://w3c.github.io/webcomponents/spec/shadow/#content-pseudo-element
>>>>>>>>
>>>>>>>>
>>>>>>>> On Thu, Nov 28, 2013 at 9:14 AM, Enrique Moreno Tent <
>>>>>>>> enriquemorenotent@gmail.com> wrote:
>>>>>>>>
>>>>>>>>> Hello, I have been experimenting with Web Components and I have an
>>>>>>>>> issue, which I think I have represented fairly clear here:
>>>>>>>>>
>>>>>>>>> (Tested on Chrome)
>>>>>>>>> http://codepen.io/dbugger/pen/Hyihd
>>>>>>>>>
>>>>>>>>> If I understood correctly, one of the points of web components is
>>>>>>>>> to control the presentation of our component. That is why we have the
>>>>>>>>> Shadow Boundary. BUT what happens with the elements that are represented
>>>>>>>>> with <content>? They are not considered part of the shadow, therefore the
>>>>>>>>> styles that the author decides to apply on them, will "invade" the Web
>>>>>>>>> Component.
>>>>>>>>>
>>>>>>>>> Any thought on this?
>>>>>>>>>
>>>>>>>>> --
>>>>>>>>> Enrique Moreno Tent, Web developer
>>>>>>>>> http://enriquemorenotent.com
>>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>> --
>>>>>>>> Hayato
>>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>> --
>>>>>>> Enrique Moreno Tent, Web developer
>>>>>>> http://enriquemorenotent.com
>>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>> --
>>>>>> Hayato
>>>>>>
>>>>>
>>>>>
>>>>>
>>>>> --
>>>>> Enrique Moreno Tent, Web developer
>>>>> http://enriquemorenotent.com
>>>>>
>>>>
>>>>
>>>>
>>>> --
>>>> Enrique Moreno Tent, Web developer
>>>> http://enriquemorenotent.com
>>>>
>>>
>>>
>>
>>
>> --
>> Enrique Moreno Tent, Web developer
>> http://enriquemorenotent.com
>>
>
>