fix #1: insert styles via appendChild

robinloeffel · Mar 9, 2020 · 62a8108 · 62a8108
1 parent 3daa5e9
commit 62a8108
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 18 deletions.
diff --git a/dist/cosha.iife.js b/dist/cosha.iife.js
diff --git a/index.js b/index.js
@@ -8,24 +8,24 @@ const cosha = ({
 } = {}) => {
     if (NodeList.prototype.forEach) {
         const images = document.querySelectorAll(`.${className}`);
+        const styles = document.createElement('style');
 
-        document.head.insertAdjacentHTML('beforeend', `
-            <style>
-                .${className}-wrapper {
-                    position: relative;
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
-                }
+        styles.textContent = `
+            .${className}-wrapper {
+                position: relative;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+            }
 
-                .${className}-clone {
-                    filter: blur(${blur}) brightness(${brightness}) saturate(${saturation});
-                    position: absolute;
-                    z-index: -1;
-                    transform: translate3d(${x}, ${y}, 0);
-                }
-            </style>
-        `);
+            .${className}-clone {
+                filter: blur(${blur}) brightness(${brightness}) saturate(${saturation});
+                position: absolute;
+                z-index: -1;
+                transform: translate3d(${x}, ${y}, 0);
+            }
+        `;
+        document.head.appendChild(styles);
 
         images.forEach(image => {
             const clone = image.cloneNode();

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "cosha",
-    "version": "0.3.4",
+    "version": "0.3.5",
     "description": "Colorful shadows for your images",
     "homepage": "npm.robinloeffel.ch/cosha",
     "repository": "robinloeffel/cosha",