swedbank-pay-design-guide-jekyll-theme 2.8.1 → 2.8.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: c0a8016ef43331a548ba4a8cc985b0788d2d4814c9ca8207e2309a2c3757d7c5
-  data.tar.gz: b4ede1bff762c593b966430884a83973936e07e5831f6729a6f78c70254af824
+  metadata.gz: 73c12f72d4d055a93ee0a31230c3d2d6a15ac118d716ed65c80655be4ad0a594
+  data.tar.gz: da99ecee1b960f6afde03e07a00c43794867693404e86a8394c30acb92cfd765
 SHA512:
-  metadata.gz: 1fc5f863d71f7483659380ea5f366d9dcea1f9f742833b72340064c2f0ce4158090ea7220f1c30bb5dd61abb273a9a3cddd57022420711cd77c21cf2807f1cc1
-  data.tar.gz: e9bc7565916cc415bd2b3b490a083480690b275e21992547b18758231971f43d7ca2b7aa211093afcaad1a4987aac4e9f949a4edfb0ecc2330d9976f78616786
+  metadata.gz: dfe4d4a396b8a700f58a6d16aa4fa4bfcdb22326bee7555b94c25643bf3a32f45ca935f33a9ea54369d6be7b2d7ef7e4182fb50c0d68aa0ed8d321a0e62ecd39
+  data.tar.gz: 4bffd2489e69690385049f07c6061b4cee4d8736269ebc3cc78b73715f36bc5f27cbba1409f0f9c7e55d58d290cc2607a0804185fefa002ea47fdf0862d1bd59

data/_includes/code-example.html

@@ -8,7 +8,7 @@ json: json content
 <p class="code-view-header">
     {{ include.title}}
     {% if include.json %}
-    <button aria-describedby="tooltipCopy" class="code-view-copy tooltip" aria-label="Copy json to clipboard" value='{{include.json}}' onclick='javascript:navigator.clipboard.writeText(this.value)'><i class="at-clipboard small" aria-hidden="true"></i><div role="tooltip">Copy json to clipboard</div></button>
+    {% include copy-button.html content=include.json label="Copy json to clipboard" tooltip="Copy json to clipboard" %}
     {% endif %}
 </p>
 {% if include.header %}

data/_includes/copy-button.html

@@ -0,0 +1,11 @@
+{%- comment -%}
+**Parameters
+content: Content to copy to clipboard
+label: Aria label text (optional, defaults to "Copy to clipboard")
+tooltip: Tooltip text (optional, defaults to "Copy to clipboard")
+{%- endcomment -%}
+
+{%- assign buttonLabel = include.label | default: "Copy to clipboard" -%}
+{%- assign buttonTooltip = include.tooltip | default: "Copy to clipboard" -%}
+
+<button aria-describedby="tooltipCopy" class="code-view-copy tooltip" aria-label="{{ buttonLabel }}" value='{{include.content}}' onclick='javascript:navigator.clipboard.writeText(this.value)'><i class="at-clipboard small" aria-hidden="true"></i><div role="tooltip">{{ buttonTooltip }}</div></button>

data/_layouts/default.html

@@ -44,24 +44,19 @@
         <title>{{ title }}</title>
         <link rel="stylesheet" href="{{ design_guide_url }}/styles/swedbankpay.css" />
         <link rel="stylesheet" href="{{ design_guide_url }}/styles/documentation-swedbankpay.css" />
-        <link rel="stylesheet" href="{{ " /assets/css/style.css" | relative_url }}">
-        <link rel="stylesheet" href="{{ " /assets/css/pygments-autumn.css" | relative_url }}">
+        <link rel="stylesheet" href="{{- "/assets/css/style.css" | relative_url -}}">
+        <link rel="stylesheet" href="{{- "/assets/css/pygments-autumn.css" | relative_url -}}">
         <link rel="shortcut icon" href="{{ design_guide_url }}/icons/favicon.ico">
         <link rel="icon" type="image/png" sizes="16x16" href="{{ design_guide_url }}/icons/favicon-16x16.png">
         <link rel="icon" type="image/png" sizes="32x32" href="{{ design_guide_url }}/icons/favicon-32x32.png">
         <link href="https://fonts.googleapis.com/css?family=Material+Icons+Outlined" rel="stylesheet">
-        {% if site.custom_head_scripts %}
-        {% for script in site.custom_head_scripts %}
-        <script src="{{ script | relative_url }}"></script>
-        {% endfor %}
-        {% endif %}
         {%- include apple-mobile-headers.html design_guide_url=design_guide_url -%}
-        <script src="{{ '/assets/js/mermaid.min.js' | relative_url }}"></script>
+        <script src="{{- '/assets/js/mermaid.min.js' | relative_url -}}"></script>
         {%- if site.search.enabled == true %}
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
-        <script src="{{ " /assets/tipuesearch/tipuesearch_content.js" | relative_url }}"></script>
-        <script src="{{ " /assets/tipuesearch/tipuesearch_set.js" | relative_url }}"></script>
-        <script src="{{ " /assets/tipuesearch/tipuesearch.min.js" | relative_url }}"></script>
+        <script src="{{- "/assets/tipuesearch/tipuesearch_content.js" | relative_url -}}"></script>
+        <script src="{{- "/assets/tipuesearch/tipuesearch_set.js" | relative_url -}}"></script>
+        <script src="{{- "/assets/tipuesearch/tipuesearch.min.js" | relative_url -}}"></script>
         {%- endif %}
     </head>
 
@@ -120,6 +115,7 @@
         <script src="{{ design_guide_url }}/scripts/dg.js" global="true" autoload="true"></script>
         <script src="{{ '/assets/js/swedbank-pay-design-guide-theme.js' | relative_url }}"></script>
         <script src="{{ '/assets/js/cookie-consent.js' | relative_url }}"></script>
+        <script src="{{ '/assets/js/enable-code-copy-in-table.js' | relative_url }}"></script>
         {%- if site.google_analytics.tracking_id %}
         {% include google_analytics.html %}
         {%- endif %}

data/_sass/code-view.scss

@@ -17,6 +17,12 @@
     text-decoration: none;
 }
 
+.enable-code-copy .code-view-copy {
+    background-color: inherit;
+    color: inherit;
+    display: inline-flex;
+}
+
 .code-view {
     .code-view-table {
         .code-view-code {

data/assets/js/enable-code-copy-in-table.js

@@ -0,0 +1,40 @@
+// Automatically add copy buttons to tables with 'enable-copy' class
+// Adds a copy button next to every <code> element in the table
+document.addEventListener('DOMContentLoaded', function() {
+  // Find all tables with class enable-copy
+  document.querySelectorAll('table.enable-code-copy').forEach(table => {
+    // Find all <code> elements in the table
+    const codeElements = table.querySelectorAll('td code');
+    
+    codeElements.forEach(codeElement => {
+      const value = codeElement.textContent.trim();
+      
+      // Create copy button matching copy-button.html component
+      const button = document.createElement('button');
+      button.setAttribute('aria-describedby', 'tooltipCopy');
+      button.className = 'code-view-copy tooltip';
+      button.setAttribute('aria-label', 'Copy to clipboard');
+      button.value = value;
+      button.onclick = function() { 
+        navigator.clipboard.writeText(this.value);
+      };
+      
+      const icon = document.createElement('i');
+      icon.className = 'at-clipboard small';
+      icon.setAttribute('aria-hidden', 'true');
+      
+      const tooltip = document.createElement('div');
+      tooltip.setAttribute('role', 'tooltip');
+      tooltip.textContent = 'Copy to clipboard';
+      
+      button.appendChild(icon);
+      button.appendChild(tooltip);
+      
+      // Add button after the code element
+      const cell = codeElement.parentElement;
+      cell.style.whiteSpace = 'nowrap';
+      cell.appendChild(document.createTextNode(' '));
+      cell.appendChild(button);
+    });
+  });
+});

data/lib/gem_version.rb

@@ -4,7 +4,7 @@ module Gem
   # Gem Specification
   class Specification
     def self.gem_version
-      '2.8.1'
+      '2.8.3'
     end
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: swedbank-pay-design-guide-jekyll-theme
 version: !ruby/object:Gem::Version
-  version: 2.8.1
+  version: 2.8.3
 platform: ruby
 authors:
 - Swedbank Pay
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-12-18 00:00:00.000000000 Z
+date: 2026-02-05 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: faraday
@@ -402,6 +402,7 @@ files:
 - _includes/card-table.html
 - _includes/card.html
 - _includes/code-example.html
+- _includes/copy-button.html
 - _includes/doc-container.html
 - _includes/example-1.md
 - _includes/example-2.md
@@ -463,6 +464,7 @@ files:
 - assets/img/flag-no.svg
 - assets/img/flag-se.svg
 - assets/js/cookie-consent.js
+- assets/js/enable-code-copy-in-table.js
 - assets/js/mermaid.min.js
 - assets/js/swedbank-pay-design-guide-theme.js
 - assets/puml-theme-swedbankpay.puml