clean

.hta_slug/image-to-base64-converter.php

@@ -0,0 +1,40 @@
+<section class="diZContainer diZmxAuto">
+    <h2 class="diZBorderBottom">Convert Image to Base64</h2>
+    <div class="diZMaxW600 diZmxAuto toolsSection diZmy20">
+        <div class="diZFlexColumn ">
+            <input type="file" class="image-input diZmt2" accept="image/*">
+            <textarea rows="10" class="base64-textarea diZmt2" readonly></textarea>
+            <p class="diZDisplayNone diZTextCenter diZmt2" id="copied-notice"></p>
+            <div class="diZmt2" id="preview" ></div>
+            <button class="copy-button diZmt2 diZmxAuto"><span>Copy Base64</span></button>
+        </div>
+    </div>
+</section>
+
+
+<script>
+    document.querySelector('.image-input').addEventListener('change', function() {
+        var file = this.files[0];
+        if (file) {
+            var reader = new FileReader();
+            reader.onload = function(e) {
+                var base64 = e.target.result;
+                var img = document.createElement('img');
+                img.src = base64;
+                img.style.width = '100%';
+                document.getElementById('preview').innerHTML = '';
+                document.getElementById('preview').appendChild(img);
+                document.querySelector('.base64-textarea').value = base64;
+            };
+            reader.readAsDataURL(file);
+        }
+    });
+
+    document.querySelector('.copy-button').addEventListener('click', function() {
+        var base64TextArea = document.querySelector('.base64-textarea');
+        base64TextArea.select();
+        document.execCommand('copy');
+        document.getElementById('copied-notice').style.display = 'block';
+        document.getElementById('copied-notice').innerHTML = 'Base64 copied to clipboard!';
+    });
+</script>