mirror of
https://github.com/tomfran/typo.git
synced 2025-04-25 04:59:54 +03:00
Revert "fix: copy button position"
This commit is contained in:
parent
f56961a5c4
commit
9128fe46e3
2 changed files with 24 additions and 34 deletions
|
@ -66,7 +66,7 @@ li {
|
|||
list-style-type: none;
|
||||
}
|
||||
|
||||
&>input[type="checkbox"] {
|
||||
& > input[type="checkbox"] {
|
||||
width: var(--li-checkbox-size);
|
||||
height: var(--li-checkbox-size);
|
||||
margin: 0 0.2em 0.15em -1.25em;
|
||||
|
@ -86,24 +86,17 @@ input {
|
|||
|
||||
/* Code blocks */
|
||||
|
||||
.highlight {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
.copy-code-container {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.copy-code-button {
|
||||
background-color: var(--background);
|
||||
font-family: var(--font-mono);
|
||||
padding: 3px 6px;
|
||||
font-size: .8em;
|
||||
font-size: 0.8em;
|
||||
border-radius: var(--copy-code-button-border-radius);
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
z-index: 1;
|
||||
display: none;
|
||||
border: 1px solid var(--code-border);
|
||||
}
|
||||
|
||||
|
@ -606,4 +599,4 @@ blockquote {
|
|||
blockquote p {
|
||||
margin-left: 1rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,37 +1,34 @@
|
|||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const codeBlocks = document.querySelectorAll(".highlight")
|
||||
const codeBlocks = document.querySelectorAll("pre");
|
||||
|
||||
codeBlocks.forEach((codeBlock) => {
|
||||
if (codeBlock.className == "mermaid") return
|
||||
const copyButton = document.createElement("button")
|
||||
copyButton.className = "copy-code-button"
|
||||
copyButton.textContent = "copy"
|
||||
const copyButtonContainer = document.createElement("div")
|
||||
copyButtonContainer.className = "copy-code-container"
|
||||
copyButtonContainer.appendChild(copyButton)
|
||||
if (codeBlock.className == "mermaid") return;
|
||||
const copyButton = document.createElement("button");
|
||||
copyButton.className = "copy-code-button";
|
||||
copyButton.textContent = "copy";
|
||||
|
||||
// Insert the button inside the <pre> block
|
||||
codeBlock.appendChild(copyButton)
|
||||
codeBlock.appendChild(copyButton);
|
||||
|
||||
copyButton.addEventListener("click", function () {
|
||||
const code = codeBlock.querySelector("code")
|
||||
const code = codeBlock.querySelector("code");
|
||||
// Get the code content
|
||||
const textToCopy = code.textContent || code.innerText
|
||||
const textToCopy = code.textContent || code.innerText;
|
||||
|
||||
// Use the Clipboard API to copy the text
|
||||
navigator.clipboard
|
||||
.writeText(textToCopy)
|
||||
.then(() => {
|
||||
// Change button text to "Copied"
|
||||
copyButton.textContent = "copied"
|
||||
copyButton.textContent = "copied";
|
||||
|
||||
setTimeout(() => {
|
||||
copyButton.textContent = "copy"
|
||||
}, 2000) // Reset the button text after 2 seconds
|
||||
copyButton.textContent = "copy";
|
||||
}, 2000); // Reset the button text after 2 seconds
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error("Unable to copy text:", err)
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
console.error("Unable to copy text:", err);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue