`; return doc; } function generate(){ applyVars(); renderPreview(); output.textContent = buildHtmlDocument(); } function bindColorPair(picker, hex){ picker.addEventListener('input', () => { hex.value = picker.value; generate(); }); hex.addEventListener('input', () => { const v = normalizeHex(hex.value); if(v){ picker.value = v; hex.value = v; generate(); } }); } [ inputText, fontFamily, fontSize, lineHeight, maxWidth, padding, radius, borderW, usePre ].forEach(ctrl => ctrl.addEventListener('input', generate)); bindColorPair(borderColor, borderColorHex); bindColorPair(bgColor, bgColorHex); bindColorPair(textColor, textColorHex); el('t2h_btnGenerate').addEventListener('click', generate); el('t2h_btnCopy').addEventListener('click', async () => { const html = output.textContent || ''; try{ await navigator.clipboard.writeText(html); }catch(e){ const ta = document.createElement('textarea'); ta.value = html; document.body.appendChild(ta); ta.select(); document.execCommand('copy'); document.body.removeChild(ta); } }); el('t2h_btnClear').addEventListener('click', () => { inputText.value = ''; generate(); inputText.focus(); }); generate(); })();