•
기존 코드 블록의 복사 버튼을 클릭할 때 복사 행위에 대한 팝업 창이 출력되는 동작.
◦
팝업 창을 닫는 행위가 추가로 들어가는 불편함..
•
복사 여부를 알리는 행위를 변경!!
◦
버튼 스타일과 텍스트 변경으로 수정
◦
별도의 팝업 창을 지우는 행위가 필요 없음
<script>
(function () {
var originalAlert = window.alert;
// React에서 호출하는 모든 alert 차단
window.alert = function (message) {
console.log("React 팝업 차단됨: " + message);
};
// 복사 완료 시 버튼 스타일 변경 함수
function highlightAllCopyButtons() {
var copyButtons = document.querySelectorAll(".css-1nqc25a");
if (copyButtons.length > 0) {
copyButtons.forEach(function (copyButton) {
var originalBackgroundColor = copyButton.style.backgroundColor;
var originalColor = copyButton.style.color;
var originalText = copyButton.innerText;
// 복사 완료 시 스타일 및 텍스트 변경
copyButton.style.backgroundColor = "#319964";
copyButton.style.color = "white";
copyButton.innerText = "OK";
// 2초 후 스타일 및 텍스트 복원
setTimeout(function () {
copyButton.style.backgroundColor = originalBackgroundColor;
copyButton.style.color = originalColor;
copyButton.innerText = originalText;
}, 2000);
});
} else {
console.log("복사 버튼을 찾을 수 없습니다.");
}
}
// 복사 완료 동작을 독립적으로 실행
window.highlightAllCopyButtons = highlightAllCopyButtons;
})();
</script>
HTML
복사
# oopy head 영역에 html 코드 추가