diff --git a/index.html b/index.html
index 0016e1a..e6e1734 100644
--- a/index.html
+++ b/index.html
@@ -150,7 +150,12 @@
Result
-
Copy
+
+ Copy
+
+ Copied!
+
+
diff --git a/script.js b/script.js
index 708e023..a8f84a3 100644
--- a/script.js
+++ b/script.js
@@ -9,6 +9,15 @@ function copyResultToCB() {
resultNode.select()
resultNode.setSelectionRange(0, 99999)
navigator.clipboard.writeText(resultNode.value)
+
+ const copyBtn = document.getElementById('copy-btn')
+ const copyBlock = document.getElementById('copy-block')
+
+ copyBlock.classList.remove('hidden')
+
+ setTimeout(function() {
+ copyBlock.classList.add('hidden')
+ }, 500)
}
function buildResult() {
diff --git a/style.css b/style.css
index 7460c55..818e1f3 100644
--- a/style.css
+++ b/style.css
@@ -59,4 +59,31 @@ html {
.container {
max-width: 930px !important;
+}
+
+.blockCopy {
+ width: 100px;
+ background-color: #374151;
+ color: #fff;
+ text-align: center;
+ border-radius: 6px;
+ padding: 8px 6px;
+ position: absolute;
+ z-index: 1;
+ bottom: -40px;
+ left: 50%;
+ margin-left: -50px;
+ transition: opacity 1s;
+ white-space: nowrap;
+}
+
+.blockCopy::after {
+ content: "";
+ position: absolute;
+ bottom: 100%;
+ left: 50%;
+ margin-left: -5px;
+ border-width: 5px;
+ border-style: solid;
+ border-color: transparent transparent #374151 transparent;
}
\ No newline at end of file