aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
authorIgor Tolmachev <me@igorek.dev>2024-04-23 20:45:13 +0900
committerIgor Tolmachev <me@igorek.dev>2024-04-23 20:49:44 +0900
commit622b3504520be1b3e09d5798c5e946248fcfa8da (patch)
tree8ae9913d820c6f7c27567196f85f61bfde5f5603
parent93b7de928e8ab59396fcd5ac263aed37afc5ec85 (diff)
downloadpages-622b3504520be1b3e09d5798c5e946248fcfa8da.tar.gz
pages-622b3504520be1b3e09d5798c5e946248fcfa8da.zip
Change copy behavior
-rw-r--r--script.js8
-rw-r--r--style.css11
2 files changed, 5 insertions, 14 deletions
diff --git a/script.js b/script.js
index b16142f..2f428b9 100644
--- a/script.js
+++ b/script.js
@@ -1,16 +1,16 @@
1function copy(text, tooltip) { 1function copy(text, tooltip) {
2 return () => { 2 return () => {
3 navigator.clipboard.writeText(text); 3 navigator.clipboard.writeText(text);
4 tooltip.textContent = "[copied]"; 4 tooltip.textContent = " []";
5 setTimeout(() => (tooltip.textContent = "[click to copy]"), 1000); 5 setTimeout(() => (tooltip.textContent = " []"), 1000);
6 }; 6 };
7} 7}
8 8
9window.onload = () => { 9window.onload = () => {
10 document.querySelectorAll(".copy").forEach((element) => { 10 document.querySelectorAll(".copy").forEach((element) => {
11 const tooltip = document.createElement("span"); 11 const tooltip = document.createElement("span");
12 tooltip.classList.add("copy-tooltip"); 12 tooltip.classList.add("copy-button");
13 tooltip.textContent = "[click to copy]"; 13 tooltip.textContent = " []";
14 14
15 element.onclick = copy(element.attributes["copy-text"]?.value, tooltip); 15 element.onclick = copy(element.attributes["copy-text"]?.value, tooltip);
16 element.appendChild(tooltip); 16 element.appendChild(tooltip);
diff --git a/style.css b/style.css
index b88584d..c24e85f 100644
--- a/style.css
+++ b/style.css
@@ -40,16 +40,7 @@ a,
40} 40}
41 41
42a:active, 42a:active,
43.copy:active { 43.copy:hover {
44 cursor: pointer; 44 cursor: pointer;
45 color: #9b859d; 45 color: #9b859d;
46} 46}
47
48.copy > .copy-tooltip {
49 visibility: hidden;
50 margin-left: 1em;
51}
52
53.copy:hover > .copy-tooltip {
54 visibility: visible;
55}