File size: 2,343 Bytes
b309c22 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 |
<!DOCTYPE html>
<html>
<head>
<title>Copy Functionality Test</title>
</head>
<body>
<h1>Copy Functionality Test</h1>
<div style='background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-radius: 10px; padding: 15px; margin: 10px 0; color: white;'>
<div style='margin-bottom: 10px;'>
<strong>💡 Test Suggestion:</strong>
</div>
<div id='suggestion-1' style='background: rgba(255,255,255,0.1); padding: 10px; border-radius: 5px;
margin: 10px 0; font-style: italic; line-height: 1.4; user-select: text;'>
This is a test suggestion that should be copyable to clipboard.
</div>
<div style='margin-top: 10px;'>
<button onclick='
const text = document.getElementById("suggestion-1").innerText;
navigator.clipboard.writeText(text).then(() => {
this.innerHTML = "✅ Copied!";
this.style.backgroundColor = "#10b981";
setTimeout(() => {
this.innerHTML = "📋 Copy to Clipboard";
this.style.backgroundColor = "rgba(255,255,255,0.2)";
}, 2000);
}).catch(() => {
alert("Failed to copy to clipboard");
});
'
style='background: rgba(255,255,255,0.2); border: none; color: white;
padding: 8px 16px; border-radius: 5px; cursor: pointer;
font-size: 14px; transition: all 0.2s;'
onmouseover='this.style.backgroundColor="rgba(255,255,255,0.3)"'
onmouseout='this.style.backgroundColor="rgba(255,255,255,0.2)"'>
📋 Copy to Clipboard
</button>
</div>
</div>
<p>Click the button above to test if copy functionality works in your browser.</p>
<div style='margin-top: 20px; padding: 10px; background: #f0f0f0; border-radius: 5px;'>
<h3>Troubleshooting:</h3>
<ul>
<li>Make sure you're using HTTPS or localhost</li>
<li>Check browser console for errors</li>
<li>Try in a different browser</li>
<li>Ensure clipboard permissions are granted</li>
</ul>
</div>
</body>
</html>
|