Global variable declaration using `:root`

[khrise]

In this post, you introduced a mechanism to replace all occurrences of :root with :host.

The Element plus lib uses CSS var and sets it to :root which the shadow DOM doesn't have access to as they are exposed to the global scope only, this might be the issue with other libs or frameworks that use CSS var as well. Therefore, I added a bugfix to replace all :root with :host which should solve the issue for all such use cases.

You removed this feature later on with the comment Rollback changes with :root replacement as most use cases are for css variables and this does work web components . Could you elaborate on that, please? In my web components, I use a component library (telekom-scale), which provides css-variables in :root-manner. I cannot access any of these variables in my web components when using vue-web-component-wrapper. If I monkey-patch the variable declaration from :root to :host, it works. So, I would really like this feature back. Or am I missing something?