Re: Feedback and questions on shadow DOM and web components

Angelina here again -

Good to know I can style the shadow DOM hosts this way. Good for styling
elements that are specifically affected by the shadow DOM magic. I can see
that being important. So:

            <style>
                @host {
                    *[is="news"] {
                        background: #ff0; // works
                    }

                    ul {
                        border: 1px solid blue; //works
                    }


                   ul a{ color: red; } // doesn't work: doesn't style
anchors found in shadow root children
                }

                ul a{
                    color: green; // works: styles anchor in shadow list
element
                }
            </style>


It bothers me that I can't style the host children, only the host. I
definitely want to be able to do this from within the shadow DOM context.
To me, I see myself using <content select="derp"></content> to pull in the
host's children by some criteria and then style them to my widget's
context. This only seems to let me select the host itself, whereas I had
interpreted it to be a rule that would let me declare styles for shadow
host children in the scope of a particular shadow/component.

Received on Wednesday, 14 November 2012 00:24:08 UTC