:recycle: Inherit component styles by cloning link/style tags.

1 files changed, 7 insertions, 6 deletions

diff --git a/src/client-component.ffi.mjs b/src/client-component.ffi.mjs
index ce8607b..e93764b 100644
--- a/src/client-component.ffi.mjs
+++ b/src/client-component.ffi.mjs
@@ -72,15 +72,16 @@ function makeComponent(init, update, view, on_attribute_change) {
     }
 
     connectedCallback() {
-      const sheet = new CSSStyleSheet();
-
-      for (const { cssRules } of document.styleSheets) {
-        for (const rule of cssRules) {
-          sheet.insertRule(rule.cssText);
+      for (const link of document.querySelectorAll("link")) {
+        if (link.rel === "stylesheet") {
+          this.#shadow.appendChild(link.cloneNode(true));
         }
       }
 
-      this.#shadow.adoptedStyleSheets = [sheet];
+      for (const style of document.querySelectorAll("style")) {
+        this.#shadow.appendChild(style.cloneNode(true));
+      }
+
       this.#application = new LustreClientApplication(
         init(),
         update,