swedbank-pay-design-guide-jekyll-theme 2.8.4 → 2.8.5

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 9ee894b96aae3e6f74209e87d256d0ad35d4954a3b24c1825a8e2344ce15f535
-  data.tar.gz: d976f8ca09c2244e8f2f761aa028f64b7fa271562ed9cecc81d3eac105517ac4
+  metadata.gz: 8aeaac8f9ac455049012d447a3e151e8b805446f973a3275b3aa506fe7d925e4
+  data.tar.gz: c6da741c35ba075bcd72d270e5a212894cac67b56c0d688225802ec7f90b1167
 SHA512:
-  metadata.gz: b5a1ab135836725121376dcdb286e153cb0f695d4849ff6fcabfd09daaec7883dcb641e792721a91b63123ff48172e2580d7cee08744c1eebec34cb7928e18fb
-  data.tar.gz: 70ef9fc00016b8e197b80ca54cef7427b62a12fc04009da4245e7515b09f7543f31b3d9dc4da3e65e9ea01d50e59f8026641967b17e4fa65b5c7b946a01a1c69
+  metadata.gz: 3541031291914093d86240aaa7d924a115bb651520df26307ecb1d15f3b48b8f73ad455d5e30ce92000e4db9fd6ac4f0b569255e933fc33d55437bbbf590780f
+  data.tar.gz: 4e8ee4a5a3c0183a07cadc1e10e8fb6588d0446ed49aa5ce54c01bc7c636d1668ed7f013733ba79431f9b448cd6a7229ddb3a442ea734c49e77eef0c4a6309d2

data/_includes/mermaid-dialog.html

@@ -1,6 +1,6 @@
 <dialog id="mermaid-dialog">
-    <header>
-        <div role="heading">Mermaid-diagram</div>
+    <header id="mermaid-dialog-header">
+        <div id="mermaid-dialog-title" role="heading"></div>
         <button type="button" class="dialog-close" aria-label="Close dialog" data-dialog-close="true"></button>
     </header>
     <div class="dialog-body">

data/assets/css/mermaid-dialog.css

@@ -6,7 +6,9 @@
 #mermaid-dialog .dialog-body {
   user-select: text;
   cursor: text;
+  padding-bottom: 64px;
 }
+
 #mermaidDialogDiagram svg {
   user-select: text;
   pointer-events: auto;
@@ -15,3 +17,17 @@
 #mermaidDialogDiagram text {
   user-select: text;
 }
+
+/* Hide the mermaid title text from the diagram since it's shown in the dialog header */
+#mermaidDialogDiagram text[y^="-"] {
+  display: none;
+}
+
+/* Style the mermaid title text in the inline diagram*/
+svg[id^="mermaid-"] text[y^="-"] {
+  font-family: "Swedbank Headline", "Arial", sans-serif;
+  font-size: 1.2rem;
+  font-weight: bold;
+  fill: #333;
+  text-anchor: middle;
+}

data/assets/js/mermaid-dialog.js

@@ -3,15 +3,40 @@ function attachMermaidDialogEvents() {
     if (!svg.classList.contains('mermaid-dialog-ready')) {
       svg.classList.add('mermaid-dialog-ready');
       svg.style.cursor = 'zoom-in';
+
+      // Center the mermaid title text element in the inline diagram
+      var titleTextEl = Array.from(svg.querySelectorAll('text')).find(function(t) {
+        return parseFloat(t.getAttribute('y')) < 0;
+      });
+      if (titleTextEl) {
+        var vb = svg.viewBox && svg.viewBox.baseVal;
+        var midX = vb && vb.width ? (vb.x + vb.width / 2) : parseFloat(svg.getAttribute('width') || 0) / 2;
+        titleTextEl.setAttribute('x', midX);
+      }
+
       svg.addEventListener('click', function() {
         var dialogDiagram = document.getElementById('mermaidDialogDiagram');
         dialogDiagram.innerHTML = svg.outerHTML;
-        // Öppna dialogen direkt
+
+        var dialogTitle = document.getElementById('mermaid-dialog-title');
+
+        // Check for mermaid title: rendered as <text> with negative y above the diagram
+        var titleTextEl = Array.from(svg.querySelectorAll('text')).find(function(t) {
+          return parseFloat(t.getAttribute('y')) < 0;
+        });
+
+        var diagramTitle = (titleTextEl && titleTextEl.textContent.trim())
+          ? titleTextEl.textContent.trim()
+          : null;
+
+        dialogTitle.textContent = (diagramTitle) ? diagramTitle : 'Sequence diagram';
+
+        // Open dialog directly
         var dialog = document.getElementById('mermaid-dialog');
         if (dialog && typeof dialog.showModal === 'function') {
           dialog.showModal();
         } else {
-          // Fallback: toggla 'open' attribut om design-guide hanterar det
+          // Fallback: toggle 'open' attribute if design-guide handles it
           dialog.setAttribute('open', '');
         }
       });

data/lib/gem_version.rb

@@ -4,7 +4,7 @@ module Gem
   # Gem Specification
   class Specification
     def self.gem_version
-      '2.8.4'
+      '2.8.5'
     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.4
+  version: 2.8.5
 platform: ruby
 authors:
 - Swedbank Pay
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-02-25 00:00:00.000000000 Z
+date: 2026-05-13 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: faraday