const copyButtonSVG = ``;
const checkmarkSVG = `Copied `;
// use a class selector if available
let blocks = document.querySelectorAll("pre");
blocks.forEach((block) => {
// only add button if browser supports Clipboard API
if (navigator.clipboard) {
let button = document.createElement("button");
button.innerHTML = copyButtonSVG;
button.style.position = "absolute";
button.style.top = "5px";
button.style.right = "5px";
block.style.position = "relative";
block.appendChild(button);
button.addEventListener("click", async () => {
await copyCode(block, button);
});
}
});
async function copyCode(block, button) {
let code = block.querySelector("code");
let text = code.innerText;
await navigator.clipboard.writeText(text);
// visual feedback that task is completed
button.innerHTML = checkmarkSVG; // Checkmark symbol
button.style.backgroundColor = "green";
button.style.color = "white";
button.style.borderRadius = "4px";
setTimeout(() => {
button.innerHTML = copyButtonSVG;
button.style.backgroundColor = "";
button.style.color = "";
}, 1000);
}
let mainNav = document.getElementById("js-menu");
let navBarToggle = document.getElementById("js-nav-toggle");
navBarToggle.addEventListener("click", function() {
mainNav.classList.toggle("active");
});