shx-3d-render

snippets/shx-3d-render-input.liquid

@@ -91,6 +91,16 @@
         overflow: hidden;
     } 
 
+    .shx-mat-container {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+
+        overflow: hidden;
+    }
+
     .shx-mat-matte, .shx-mat-silk {
         position: absolute;
         top: 0;
@@ -356,7 +366,9 @@
                 <input type="radio" id="${inputID}-${color}" form="product-form-${section_id}" name="properties[${inputName}]" value="${FilamentList[color].name} #${color}" ${inputVal === color ? 'checked' : ''}>
                 <label for="${inputID}-${color}" style="background-color: ${FilamentList[color].hex};">
             `;
-
+            
+            
+            html += `<div class="shx-mat-container">`;
             if(FilamentList[color].matte) {
                 html += `<span class="shx-mat-matte"></span>`;
             }
@@ -364,6 +376,7 @@
             if(FilamentList[color].silk) {
                 html += `<span class="shx-mat-silk"></span>`;
             }
+            html += `</div>`;
 
             html += `</label>`;
         }