copy code

_jekyll/_includes/scripts.html

@@ -1,5 +1,3 @@
-{{ Huhu ?!? }}
-
 {% if site.footer_scripts %}
   {% for script in site.footer_scripts %}
     <script src="{{ script | relative_url }}"></script>
@@ -23,7 +21,6 @@
 {% include analytics.html %}
 {% include /comments-providers/scripts.html %}
 
-{{ page.after_footer_scripts }}
 {% if page.after_footer_scripts %}
    {% for script in page.after_footer_scripts %}
     <script src="{{ script | relative_url }}"></script>

_jekyll/_layouts/single.html

@@ -63,6 +63,9 @@ layout: default
           </a>
         </p>
       </footer>
+
+      {% include post_pagination.html %}
+
     </div>
 
     {% if jekyll.environment == 'production' and site.comments.provider and page.comments %}

assets/css/main.scss

@@ -617,6 +617,29 @@ div.font-separator-test {
     padding: 0 !important;
 }
 
+/* Code blocks */
+
+pre.highlight > button {
+opacity: 0;
+  position: absolute;
+  top: 1em;
+  right: 1em;
+  background: none;
+  background: rgba(200, 200, 200, 0.2);
+  color: lightgray;
+  border: 1px solid lightgray;
+  border-radius: 5px;
+}
+
+pre.highlight:hover > button {
+  opacity: 1;
+}
+
+pre.highlight > button:active,
+pre.highlight > button:focus {
+  opacity: 1;
+}
+
 /* Font filter */
 
 button#toggle-font-filter {

assets/js/copy_code.js

@@ -0,0 +1,22 @@
+var codeBlocks = document.querySelectorAll('pre.highlight');
+
+codeBlocks.forEach(function (codeBlock) {
+  var copyButton = document.createElement('button');
+  copyButton.className = 'copy';
+  copyButton.type = 'button';
+  copyButton.ariaLabel = 'Copy code to clipboard';
+  copyButton.innerHTML = '<i class="fa fa-clone" aria-hidden="true"></i>';
+
+  codeBlock.append(copyButton);
+
+  copyButton.addEventListener('click', function () {
+    var code = codeBlock.querySelector('code').innerText.trim();
+    window.navigator.clipboard.writeText(code);
+
+    copyButton.style.border = '2px solid red';
+
+    setTimeout(function () {
+      copyButton.style.border = '1px solid lightgray';
+    }, 1000);
+  });
+});

collections/_developers/de/002-002-manual-setup.md

@@ -3,6 +3,8 @@ title: "Manuelle Installation"
 permalink: /de/developers/inkstitch/manual-setup/
 last_modified_at: 2021-10-23
 toc: false
+after_footer_scripts:
+  - /assets/js/copy_code.js
 ---
 Eine manuelle Installation ermöglicht es am Quellcode zu arbeiten und die Änderungen
 

collections/_developers/de/002-003-windows-manual-build.md

@@ -3,6 +3,8 @@ title: "Windows Manual Install and Manual Build"
 permalink: /de/developers/inkstitch/windows-manual-build/
 last_modified_at: 2024-01-16
 toc: true
+after_footer_scripts:
+  - /assets/js/copy_code.js
 ---
 **Info:** For this description we use **`foo`** as a user name. Whenever it occures **replace it** with your personal windows user name.
 {: .notice--warning }

collections/_developers/en/002-002-manual-setup.md

@@ -3,6 +3,8 @@ title: "Manual Setup for Linux and macOS"
 permalink: /developers/inkstitch/manual-setup/
 last_modified_at: 2024-01-17
 toc: true
+after_footer_scripts:
+  - /assets/js/copy_code.js
 ---
 A manual setup will allow you to edit the code while running the extension.
 

collections/_developers/en/002-003-windows-manual-build.md

@@ -3,6 +3,8 @@ title: "Windows Manual Install and Manual Build"
 permalink: /developers/inkstitch/windows-manual-build/
 last_modified_at: 2024-08-19
 toc: true
+after_footer_scripts:
+  - /assets/js/copy_code.js
 ---
 **Info:** For this description we use **`foo`** as a user name. Whenever it occures **replace it** with your personal windows user name.
 {: .notice--warning }

collections/_developers/fr/002-002-manual-setup.md

@@ -3,6 +3,8 @@ title: "Manual Setup"
 permalink: /fr/developers/inkstitch/manual-setup/
 last_modified_at: 2021-10-14
 toc: true
+after_footer_scripts:
+  - /assets/js/copy_code.js
 ---
 A manual setup will allow you to edit the code while running the extension.
 

collections/_docs/de/001-003-install-linux.md

@@ -4,6 +4,8 @@ permalink: /de/docs/install-linux/
 excerpt: "Wie wird Ink/Stitch installiert."
 last_modified_at: 2024-09-25
 toc: true
+after_footer_scripts:
+  - /assets/js/copy_code.js
 ---
 {% comment %}
 ## Video-Anleitung

collections/_docs/fr/001-003-install-linux.md

@@ -4,6 +4,8 @@ permalink: /fr/docs/install-linux/
 excerpt: "Comment installer rapidement Ink/Stitch."
 last_modified_at: 2024-04-29
 toc: true
+after_footer_scripts:
+  - /assets/js/copy_code.jss
 ---
 
 ## Prérequis

collections/_docs/ru/001-003-install-linux.md

@@ -4,6 +4,8 @@ permalink: /ru/docs/install-linux/
 excerpt: "Быстрая установка Ink/Stitch."
 last_modified_at: 2021-12-02
 toc: true
+after_footer_scripts:
+  - /assets/js/copy_code.js
 ---
 ## Видео урок