feat: copy-to-clipboard removes diff-highlight tokens, plus some css changes

Author: TrebledJ

assets/css/prism/prism-toolbar.css

@@ -27,7 +27,7 @@ div.code-toolbar > .toolbar > .toolbar-item > a,
 div.code-toolbar > .toolbar > .toolbar-item > button,
 div.code-toolbar > .toolbar > .toolbar-item > span {
 	color: var(--main-text-color);
-	font-size: .7em;
+	font-size: .8em;
 	padding: 0 .5em;
 	background-color: var(--toolbar-background-color);
 	/* box-shadow: 0 2px 0 0 rgba(0,0,0,0.2); */

assets/js.bundle/common/prism-copy-to-clipboard.js

@@ -98,6 +98,8 @@ document.querySelectorAll('.copy-to-clipboard-button').forEach(el => {
       for (let i = 0; i < children.length; i++) {
         if (children[i].tagName.toLowerCase() === 'pre') {
           return filterTextToCopy(children[i], children[i].textContent);
+        } else {
+          console.error("Error obtaining text, could not find PRE element.");
         }
       }
       return undefined;
@@ -122,11 +124,10 @@ document.querySelectorAll('.copy-to-clipboard-button').forEach(el => {
 const NEW_LINE_EXP = /\n(?!$)/g;
 
 function filterTextToCopy(preElement, code) {
-  // Filter out output lines.
-  // This may arise from the command-line or line-number plugins.
+  // Filter out output lines from the command-line or line-number plugins.
   const lineNumbersToSkip = preElement.getAttribute('data-output');
+  const lines = code.split(NEW_LINE_EXP);
   if (lineNumbersToSkip !== null) {
-    const lines = code.split(NEW_LINE_EXP);
     const linesNum = lines.length;
 
     lineNumbersToSkip.split(',').forEach(function (section) {
@@ -150,13 +151,30 @@ function filterTextToCopy(preElement, code) {
       }
     });
 
-    code = lines.filter(s => s !== undefined).join('\n');
+    code = lines.filter(s => s !== undefined);
   } else if (preElement.classList.contains('command-line')) {
     const nonOutputLines = preElement.querySelectorAll('.token.command');
     code = Array.prototype.slice.call(nonOutputLines)
-      .map(e => e.textContent)
-      .join('\n');
+      .map(e => e.textContent);
+  } else {
+    code = lines;
+  }
+
+  // Filter out diff lines from the diff-highlight plugin.
+  let isDiffBlock = false;
+  for (let i = 0; i < preElement.classList.length; i++)
+    if (preElement.classList[i].startsWith('language-diff')) {
+      isDiffBlock = true;
+      break;
+    }
+
+  if (isDiffBlock) {
+    code = code
+      .map(line => line.startsWith('-') ? undefined : line.slice(1))
+      .filter(l => l !== undefined);
   }
 
+  code = code.join('\n');
+
   return code;
 }

assets/scss/_common.scss

@@ -43,16 +43,17 @@ a {
     text-decoration: none !important;
 
     background-image: linear-gradient(to right, currentColor, currentColor);
-    background-size: 0 0.1em;
+    background-size: .5rem 0.06em;
     background-position: 0 100%;
     background-repeat: no-repeat;
     transition: background-size $transition-duration linear;
+    cursor: pointer;
 }
 
 a:hover,
 a:focus,
 a:active {
-    background-size: 100% 0.1em;
+    background-size: 100% 0.06em;
 }
 
 a:has(> i:only-child) {

assets/scss/_posts.scss

@@ -91,6 +91,9 @@
         text-align: center;
         line-height: $line-height-compact;
         margin-top: $space-half;
+        width: 90%;
+        margin-left: auto;
+        margin-right: auto;
     }
 
     b, strong {
@@ -215,6 +218,11 @@
     {
         content: none;
     }
+
+    a[id^="fnref"]
+    {
+        background-image: none;
+    }
 }
 
 div.center,

assets/scss/_variables.scss

@@ -80,7 +80,7 @@ html[data-theme="dark"] {
     --highlight-color-rgb: 75, 75, 75;
     --border-color-rgb: 58, 57, 60;
 
-    --main-text-color-rgb: 140, 140, 140;
+    --main-text-color-rgb: 155, 155, 155;
     --light-text-color-rgb: 118, 120, 120;
 }