Fixed : Copy button Enhancement

OneBusAway · Mar 18, 2024 · e260a12 · e260a12
1 parent a824461
commit e260a12
Showing 1 changed file with 8 additions and 8 deletions.
diff --git a/frontend/javascript/code_snippets.js b/frontend/javascript/code_snippets.js
@@ -38,9 +38,9 @@ export function insertCodeSnippetCopyButtons() {
   codeBlocks.forEach(function (block) {
     const pre = block.parentNode;
     const copyButton = document.createElement('button');
-    const svgIcon = `<svg width="16px" height="16px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M6 11C6 8.17157 6 6.75736 6.87868 5.87868C7.75736 5 9.17157 5 12 5H15C17.8284 5 19.2426 5 20.1213 5.87868C21 6.75736 21 8.17157 21 11V16C21 18.8284 21 20.2426 20.1213 21.1213C19.2426 22 17.8284 22 15 22H12C9.17157 22 7.75736 22 6.87868 21.1213C6 20.2426 6 18.8284 6 16V11Z" stroke="#B4B4B8" stroke-width="1.5"/>
-    <path d="M6 19C4.34315 19 3 17.6569 3 16V10C3 6.22876 3 4.34315 4.17157 3.17157C5.34315 2 7.22876 2 11 2H15C16.6569 2 18 3.34315 18 5" stroke="#B4B4B8" stroke-width="1.5"/>
+    const svgIcon = `<svg width="18px" height="18px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M6 11C6 8.17157 6 6.75736 6.87868 5.87868C7.75736 5 9.17157 5 12 5H15C17.8284 5 19.2426 5 20.1213 5.87868C21 6.75736 21 8.17157 21 11V16C21 18.8284 21 20.2426 20.1213 21.1213C19.2426 22 17.8284 22 15 22H12C9.17157 22 7.75736 22 6.87868 21.1213C6 20.2426 6 18.8284 6 16V11Z" stroke="var(--tw-prose-code)" stroke-width="1.5"/>
+    <path d="M6 19C4.34315 19 3 17.6569 3 16V10C3 6.22876 3 4.34315 4.17157 3.17157C5.34315 2 7.22876 2 11 2H15C16.6569 2 18 3.34315 18 5" stroke="var(--tw-prose-code)" stroke-width="1.5"/>
     </svg>`
 
     copyButton.innerHTML = svgIcon;
@@ -53,12 +53,12 @@ export function insertCodeSnippetCopyButtons() {
     copyButton.style.top = '10px';
     copyButton.style.zIndex = '1';
     copyButton.style.border = '1px solid var(--tw-prose-code-bg)'; // Add border style
-    copyButton.style.backgroundColor = '#21262d';
-    copyButton.style.padding = '6px';
+    copyButton.style.padding = '10px';
+    copyButton.style.backdropFilter = 'blur(20px)';
     copyButton.style.cursor = 'pointer';
     copyButton.style.fontSize = '14px';
-    copyButton.style.borderRadius='6px';
-    copyButton.style.boxShadow= 'inset 0 0 0 1px var(--tw-prose-code-ring)';
+    copyButton.style.borderRadius='10px';
+    copyButton.style.boxShadow= 'inset 0 0 0 1.5px var(--tw-prose-code-ring)';
 
     copyButton.addEventListener('click', function () {
       const contentToCopy = block.innerText;
@@ -69,7 +69,7 @@ export function insertCodeSnippetCopyButtons() {
       document.execCommand('copy');
       document.body.removeChild(tempTextarea);
       const copiedIcon = `<svg width="16px" height="16px" viewBox="0 -0.5 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path d="M5.5 12.5L10.167 17L19.5 8" stroke="#00FF00" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+      <path d="M5.5 12.5L10.167 17L19.5 8" stroke="#22b322" stroke-width="5" stroke-linecap="round" stroke-linejoin="round"/>
        fill="#B4B4B8"/>
       </svg>`;
       copyButton.innerHTML = copiedIcon;