fix(ld-icon): make sure shadow dom style element is not removed

Resolves #124
emdgroup-liquid · Nov 20, 2021 · 7cb5746 · 7cb5746
1 parent 982a509
commit 7cb5746
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/src/liquid/components/ld-icon/ld-icon.tsx b/src/liquid/components/ld-icon/ld-icon.tsx
@@ -32,8 +32,15 @@ export class LdIcon {
     const div = document.createElement('div')
     const iconString = await fetchIcon(this.name)
 
-    div.innerHTML = iconString.replace('<svg', '<svg part="icon"')
-    this.element.shadowRoot.innerHTML = ''
+    div.innerHTML = iconString.replace(
+      '<svg',
+      '<svg class="ld-icon__svg" part="icon"'
+    )
+    Array.from(this.element.shadowRoot.children).forEach((child) => {
+      if (child.tagName !== 'STYLE') {
+        this.element.shadowRoot.removeChild(child)
+      }
+    })
     this.element.shadowRoot.appendChild(div.firstChild)
   }
 

diff --git a/src/liquid/components/ld-tabs/ld-tab/ld-tab.css b/src/liquid/components/ld-tabs/ld-tab/ld-tab.css
@@ -49,6 +49,8 @@
   min-height: var(--ld-tab-min-height);
   color: var(--ld-tab-text-col);
   background-color: var(--ld-tab-bg-col);
+  box-sizing: border-box;
+  margin: 0;
 
   &[aria-disabled='true'] {
     color: var(--ld-tab-disabled-text-col);