Re: [w3c/webcomponents] Theming options for shadow roots (#864)

> For me it would be perfect if I could tell the component from the outside to let styles leak in.

It's unlikely anything will be accepted that allows breaking styles in arbitrary shadow roots. For component authors however it's likely they will often want to allow mixing in external styles though e.g.:

```js
<style>
  h1 {
    color: pink;
  }
</style>

<slide-show>
  <title-slide>
    <span slot="title">Welcome to Slideshow</span>
    <span slot="author">Boris the Spider</span>
    <#shadowroot>
      <style>
        :host {
          display: flex;
          align-items: center;
          justify-items: center;
          flex-direction: column;
        }

        h1 {
          /* Makes h1 within the scope to effectively be matched by
             selectors that match h1 even if they're outside the
             shadowroot
          */
          @extends :external(h1);
        }

        h2 {
          @extends :external(h2);
        }
      </style>

      <h1><slot name="title"></slot></h1>
      <h2><slot name="author"></slot></h2>
    </#shadowroot>
  </title-slide>
</slide-show>
```

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/864#issuecomment-586688949