1.0.7

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@designestate/dees-domtools",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@designestate/dees-domtools",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "private": false,
   "description": "tools to simplify complex css structures",
   "main": "dist_ts/index.js",

ts/csstools.elementbasicsetup.ts

@@ -8,18 +8,37 @@ export const elementBasicSetup = async () => {
   if (globalThis.deesCssToolsReady) {
     await globalThis.deesCssToolsReady.promise;
   } else {
+    // lets prevent double execution
     globalThis.deesCssToolsReady = defer();
+
+    // lets make sure the dom is ready
     const documentReady = defer();
     document.onreadystatechange = () => {
-      if (document.readyState === 'interactive') {
+      if (document.readyState === 'interactive' || document.readyState === 'complete') {
         documentReady.resolve();
       }
     };
     await documentReady.promise;
+
+    // lets get started
     const head = document.querySelector('head');
+    const body = document.querySelector('body');
+
+    // material font
+    const materialFontCss = `
+      @font-face {
+        font-family: 'Material Icons';
+        font-style: normal;
+        font-weight: 400;
+        src: url(https://fonts.gstatic.com/s/materialicons/v42/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2) format('woff2');
+      }
+    `;
     const styleElement = document.createElement('style');
     styleElement.type = 'text/css';
     styleElement.appendChild(document.createTextNode(materialFontCss));
+    head.appendChild(styleElement);
+
+
     globalThis.deesCssToolsReady.resolve();
   }
 };