From 38871393ba1658bd0b8aac4f88c4159271502d63 Mon Sep 17 00:00:00 2001
From: Martin Fischer <martin@push-f.com>
Date: Sat, 16 Aug 2025 21:28:57 +0200
Subject: fix: remove copy buttons

---
 README.md                    |  3 +++
 assets/css/main.css          | 18 ------------------
 assets/css/vars.css          |  1 -
 layouts/_default/baseof.html |  1 -
 static/js/copy-code.js       | 34 ----------------------------------
 5 files changed, 3 insertions(+), 54 deletions(-)
 delete mode 100644 static/js/copy-code.js

diff --git a/README.md b/README.md
index 02a16cc..172d47d 100644
--- a/README.md
+++ b/README.md
@@ -18,6 +18,9 @@ Tastefejl is a fork of the [Typo] Hugo theme, with the following changes:
 
 * Fixed blockquote styling (headings in blockquotes were touching the blockquote border).
 
+* Removed the copy buttons for code blocks because they could obscure the code
+  and also behaved wrongly on horizontal scrolling.
+
 * Removed [Simple Icons] because I don't want to plaster brands on my website and at one point a 50MB .html file was committed
   (I filtered the git history to reduce the size of the repository.)
 
diff --git a/assets/css/main.css b/assets/css/main.css
index 7e267c4..d12547b 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -86,24 +86,6 @@ input {
 
 /* Code blocks */
 
-.copy-code-button {
-  background-color: var(--background);
-  font-family: var(--font-mono);
-  padding: 3px 6px;
-  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);
-}
-
-pre:hover .copy-code-button {
-  display: block;
-}
-
 pre {
   position: relative;
   padding: var(--code-padding);
diff --git a/assets/css/vars.css b/assets/css/vars.css
index 16ebb4b..02e43bf 100644
--- a/assets/css/vars.css
+++ b/assets/css/vars.css
@@ -47,7 +47,6 @@
     /* Code */
     --code-padding: 1.5rem;
     --code-border-radius: 10px;
-    --copy-code-button-border-radius: 7px;
 
     /* Footer */
     --footer-height: 3rem;
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index b5c8cc4..fbfc2e0 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -36,5 +36,4 @@
   {{ end }}
 </body>
 
-<script defer src="{{ "js/copy-code.js" | relURL }}"></script>
 </html>
diff --git a/static/js/copy-code.js b/static/js/copy-code.js
deleted file mode 100644
index 2de3cda..0000000
--- a/static/js/copy-code.js
+++ /dev/null
@@ -1,34 +0,0 @@
-document.addEventListener("DOMContentLoaded", function () {
-  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";
-
-    // Insert the button inside the <pre> block
-    codeBlock.appendChild(copyButton);
-
-    copyButton.addEventListener("click", function () {
-      const code = codeBlock.querySelector("code");
-      // Get the code content
-      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";
-
-          setTimeout(() => {
-            copyButton.textContent = "copy";
-          }, 2000); // Reset the button text after 2 seconds
-        })
-        .catch((err) => {
-          console.error("Unable to copy text:", err);
-        });
-    });
-  });
-});
-- 
cgit v1.2.3