Add copy buttons to code tags

This commit is contained in:
Saifeddine ALOUI
2025-01-24 17:19:18 +01:00
committed by GitHub
parent 7b42601ab8
commit c52dd6a8ec

View File

@@ -384,6 +384,43 @@
}
});
function addCopyButtons() {
// Adds a copy button to all code tags
document.querySelectorAll('pre').forEach(pre => {
if (!pre.querySelector('.copy-button')) {
const button = document.createElement('button');
button.className = 'copy-button absolute top-2 right-2 p-2 bg-slate-700 text-white rounded-md opacity-0 group-hover:opacity-100 transition-opacity';
button.innerHTML = `
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" />
</svg>
`;
pre.style.position = 'relative';
pre.classList.add('group');
button.addEventListener('click', () => {
navigator.clipboard.writeText(pre.querySelector('code').textContent);
button.innerHTML = `
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
`;
setTimeout(() => {
button.innerHTML = `
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" />
</svg>
`;
}, 2000);
});
pre.appendChild(button);
}
});
}
queryForm.addEventListener('submit', async (e) => {
e.preventDefault();
@@ -451,6 +488,8 @@
queryResponse.innerHTML = '<p class="text-slate-600">No response data received</p>';
}
// Call this after loading markdown content
addCopyButtons();
// Optional: Add sources if available
if (data.sources && data.sources.length > 0) {
const sourcesHtml = `