Done with the samples, and can be released as first version!

static/script/image_viewer.js

@@ -0,0 +1,69 @@
+document.addEventListener("DOMContentLoaded", () => {
+    const images = Array.from(document.getElementsByTagName('img'));
+
+    images.forEach(image => {
+        image.style.cursor = 'pointer';
+        image.addEventListener("click", function (){
+            const fullScreenDiv = document.createElement("div");
+            fullScreenDiv.style.position = "fixed";
+            fullScreenDiv.style.top = 0;
+            fullScreenDiv.style.left = 0;
+            fullScreenDiv.style.width = "100%";
+            fullScreenDiv.style.height = "100%";
+            fullScreenDiv.style.backgroundColor = "rgba(0, 0, 0, 0.8)";
+            fullScreenDiv.style.display = "flex";
+            fullScreenDiv.style.justifyContent = "center";
+            fullScreenDiv.style.alignItems = "center";
+            fullScreenDiv.style.zIndex = 1000;
+
+            const fullScreenImage = document.createElement("img");
+            fullScreenImage.src = image.src;
+            fullScreenImage.style.maxWidth = "90%";
+            fullScreenImage.style.maxHeight = "90%";
+            fullScreenImage.style.boxShadow = "0 4px 10px rgba(0, 0, 0, 0.5)";
+            fullScreenImage.style.borderRadius = "10px";
+            fullScreenImage.style.cursor = 'pointer';
+
+            fullScreenDiv.appendChild(fullScreenImage);
+
+
+            fullScreenDiv.addEventListener("click", () => {
+                document.body.removeChild(fullScreenDiv);
+            });
+
+            document.body.appendChild(fullScreenDiv);
+        });
+    });
+});
+
+function copyToClipboard(button) {
+    // Find the <pre> block (the parent of the button)
+    const preBlock = button.closest('pre');
+    
+    // Get the text content of the <code> inside the <pre> block
+    const codeContent = preBlock.querySelector('code').innerText;
+    
+    // Create a temporary textarea to copy the content
+    const tempTextArea = document.createElement('textarea');
+    tempTextArea.value = codeContent;
+    
+    // Append the textarea to the document (it needs to be in the DOM to work)
+    document.body.appendChild(tempTextArea);
+    
+    // Select the text inside the textarea
+    tempTextArea.select();
+    
+    // Execute the copy command
+    document.execCommand('copy');
+    
+    // Remove the temporary textarea from the document
+    document.body.removeChild(tempTextArea);
+    
+    // Optionally: Provide feedback to the user (e.g., change button text)
+    button.innerText = "Copied!";
+    
+    // Reset the button text after 2 seconds
+    setTimeout(() => {
+        button.innerText = "Copy";
+    }, 2000);
+}