Jako, że mam lekko uszkodzoną myszkę, ciągle mi odznacza zaznaczany tekst to trudno mi jest skopiować czasem kod, który użytkownicy wrzucają.
Napisałem prosty skrypt, który dodaje do strony element przy każdym code elemencie i pozwala go łatwo skopiować jednym kliknięciem.
Nie dodałem efektu hover więc nie widać jak się skopiowało, ale dałem notification.
Array.from(document.querySelectorAll(".card-post code")).filter((el) => el.childElementCount > 0).forEach((el) => {
let img = document.createElement('img')
img.src = 'https://cdn.icon-icons.com/icons2/1875/PNG/512/copy_120015.png'
img.width = 50
img.height = 50
img.setAttribute('style', 'border: 1px solid black; border-radius: 10px; position: absolute; top: 0px; right: 10px; cursor: pointer')
img.addEventListener('click', (e) => {
let selection = document.getSelection()
let range = document.createRange()
range.selectNodeContents(el)
selection.removeAllRanges()
selection.addRange(range)
navigator.clipboard.writeText(selection.toString())
selection.removeAllRanges()
document.querySelector('.card-post').__vue__.$notify("Kod skopiowany")
})
el.append(img)
})
Można coś podobnego dodać do forum, czasem spotkałem na kilku forach taką opcję, że można było skopiować kod do schowka bez specjalnego zaznaczania myszką całego kodu.