How do I modify the block copy button？

[chuxinyuan]

Comment out the following code

hugo-theme-stack/assets/ts/main.ts

Lines 65 to 92 in 130e2f6

	const highlights = document.querySelectorAll('.article-content div.highlight');
	const copyText = `Copy`,
	copiedText = `Copied!`;
	highlights.forEach(highlight => {
	const copyButton = document.createElement('button');
	copyButton.innerHTML = copyText;
	copyButton.classList.add('copyCodeButton');
	highlight.appendChild(copyButton);
	const codeBlock = highlight.querySelector('code[data-lang]');
	if (!codeBlock) return;
	copyButton.addEventListener('click', () => {
	navigator.clipboard.writeText(codeBlock.textContent)
	.then(() => {
	copyButton.textContent = copiedText;
	setTimeout(() => {
	copyButton.textContent = copyText;
	}, 1000);
	})
	.catch(err => {
	alert(err)
	console.log('Something went wrong', err);
	});
	});
	});

Add the following code

layouts/partials/footer/custom.html add the following code

<script src="https://cdn.jsdelivr.net/npm/@xiee/utils/js/copy-button.min.js" defer></script>
<link href="https://cdn.jsdelivr.net/npm/@xiee/utils/css/copy-button.min.css" rel="stylesheet">

Refer to this article: https://yihui.org/en/2023/09/copy-button/

Problems arising

There are two copy buttons, one is near the code line number 1, the other copy button is not in the upper right corner, how to adjust it?