Fixes missing font and wrong path issue

Author: dkastl

src/styles/icons/custom/custom-icons-def.ts

@@ -13,18 +13,32 @@ const customIconsMeta = document.querySelector('meta[name="gtt-font-custom-icons
 const customIconsUrl = customIconsMeta ? customIconsMeta.getAttribute('content') : 'data:application/font-woff2;base64,'; // Provide a data URL for an empty font
 
 // Dynamically create the @font-face rule
-const style = document.createElement('style');
-style.type = 'text/css';
-style.innerHTML = `
-  @font-face {
-    font-family: 'custom-icons';
-    font-style: normal;
-    font-weight: 400;
-    font-display: block;
-    src: url(${customIconsUrl}) format('woff2');
+if (customIconsUrl) {
+  // Remove the existing @font-face rule
+  const styleSheets = document.styleSheets;
+  for (let i = 0; i < styleSheets.length; i++) {
+    const cssRules = styleSheets[i].cssRules || styleSheets[i].rules;
+    for (let j = 0; j < cssRules.length; j++) {
+      const rule = cssRules[j];
+      if (rule instanceof CSSFontFaceRule && rule.style.fontFamily === 'custom-icons') {
+        styleSheets[i].deleteRule(j);
+        break;
+      }
+    }
   }
-`;
-document.head.appendChild(style);
+
+  const style = document.createElement('style');
+  style.innerHTML = `
+    @font-face {
+      font-family: 'custom-icons';
+      font-style: normal;
+      font-weight: 400;
+      font-display: block;
+      src: url(${customIconsUrl}) format('woff2');
+    }
+  `;
+  document.head.appendChild(style);
+}
 
 // Define the font face
 let customFont: FontFace;

src/styles/icons/custom/custom-icons.css

@@ -1,10 +1,10 @@
-/* @font-face {
+@font-face {
   font-family: "custom-icons";
   font-style: normal;
   font-weight: 400;
   font-display: block;
   src: url("./custom-icons.woff2") format("woff2");
-} */
+}
 
 .custom-icons {
   font-weight: normal;