swedbank-pay-design-guide-jekyll-theme 1.9.4 → 1.9.9

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f92dcd253d65caf6bcc5ac6663cf8fef62eda89950bc5a0279d6d6893c436ad7
-  data.tar.gz: 76218fadaf01fde1ec62db738d8b7a02f382121dc3864a367e992a6eb31a81a1
+  metadata.gz: d2d2b335743d0a94cb65044496633ed1ce67af7a5771947daa2d4d4226b07868
+  data.tar.gz: fe9ac409a1d26ef80fa259c7366ccffbfd915e071c9b0398b63961b3d9642439
 SHA512:
-  metadata.gz: 12d0597e1ed06b31f81ef396347e6ba3cfbffeb6b7fd3a997092def427e12d154a044d41bc9c6763ba69a19ff2a3340e87e2ee93c0a7ef32c78736b950288761
-  data.tar.gz: 4521b44c5016625b6af1fb6b4eb1e4cc41f067224a11fb72b1696690ef76b1a25223ff2bc805c2fae189e68cc12fbcc9872e48103637fc432c74e937bb6f7f4f
+  metadata.gz: 18b0518c041bca19cd867b5abda56dc60e45de2a38c925819d6e0eb88205bd65024e75eb41b875af2cafb57812a89854de644e00c1e5f70666d4c8604cce57bd
+  data.tar.gz: d0f3d78eb5c9071d223596f2dea1cfa145c3ceb69a568ff66ba01285473194ef43c6c0c2f94a253ddfdb3c9f9f66997a86f8216735cb21b8dc57a6e6e2c0ce9e

data/_includes/accordion-table.html

@@ -0,0 +1,11 @@
+{% assign content = include.content | markdownify%}
+
+<div class="accordion accordion-table mb-4">
+    <button type="button" class="accordion-header pt-0" aria-expanded="false" aria-controls="exp-1">
+        <span class="mr-3 show">Show properties</span>
+        <span class="mr-3 hide">Hide properties</span>
+    </button>
+    <div class="accordion-body p-0" id="exp-1">
+        {{ content }}
+    </div>
+</div>

data/_includes/apple-touch-startup-image.html

@@ -10,7 +10,7 @@
 {%- capture device_height_string -%}
 (device-height: {{ device_height }})
 {%- endcapture -%}
-{%- if device_orientation != nil && device_orientation != empty -%}
+{%- if device_orientation != nil and device_orientation != empty -%}
     {%- capture device_orientation_string -%}
     (orientation: {{ device_orientation }}) and
     {%- endcapture -%}

data/_includes/github.html

@@ -0,0 +1,11 @@
+{% assign github_branch = site.github.branch | default : "develop" %}
+
+<a href="{{ site.github.repository_url }}/tree/{{ github_branch }}/{{ page.path }}"
+    class="github" target="_blank"
+    rel="noopener noreferrer" title="Edit '{{ page.title }}' on GitHub">
+    <svg aria-labelledby="simpleicons-github-icon" role="img" width="40" viewBox="0 0 24 24"
+        xmlns="http://www.w3.org/2000/svg">
+        <title id="simpleicons-github-icon">Edit "{{ page.title }}" on GitHub</title>
+        <path fill="#fff" d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" />
+    </svg>
+</a>

data/_includes/iterator.html

@@ -5,13 +5,13 @@
 
 <nav class="iterator d-flex">
     {% if prev_href != blank and prev_href != empty and prev_href != nil %}
-    <a class="mr-auto btn btn-primary" role="button" rel="prev" href="{{ prev_href }}">
+    <a class="mr-auto btn btn-secondary" role="button" rel="prev" href="{{ prev_href }}">
         {{ prev_title }}
     </a>
     {% endif %}
 
     {% if next_href != blank and next_href != empty and next_href != nil %}
-    <a class="ml-auto btn btn-primary" role="button" rel="next" href="{{ next_href }}">
+    <a class="ml-auto btn btn-secondary" role="button" rel="next" href="{{ next_href }}">
         {{ next_title }}
     </a>
     {% endif %}

data/_includes/release_notes.html

@@ -1,24 +1,25 @@
 {% assign num_dates = include.num_dates %}
-{% assign pages = site.pages  %}
-{% for node in pages %}
-{% if node.url contains '/resources/release-notes' %}
+{% for page in site.pages %}
+{% assign release_notes_url = '/resources/release-notes' %}
+{% if page.url contains release_notes_url %}
 <div class="release-notes-container">
-    {% assign dates = node.content | markdownify | split: '<h2' | | slice: 1, num_dates %}
-    {% assign variable = value %}
+    {% assign dates = page.content | markdownify | split: '<h2' | slice: 1, num_dates %}
 
     {% for date in dates %}
         <div class="row">
             {% assign versions = date | split: '<h3' %}
+            {% assign date_id = date | regex_capture: 'id="([^"]+)"' | first %}
             <div class="col-md-2 release-notes-date">
-                {% assign date_value = versions[0] | remove: '</h2>' | | split: '>' %}
-                {{ date_value[1] }}
+                {% assign date_value = versions[0] | remove: '</h2>' | split: '>' %}
+                <a href="{{ release_notes_url }}#{{ date_id }}">{{ date_value[1] | strip }}</a>
             </div>
             {% assign version_list = versions | shift %}
             <div class="col-md-10">
                 {% for version in version_list %}
-                    {% assign version_parts = version | | split: '</h3>' %}
+                    {% assign version_parts = version | split: '</h3>' %}
                     {% assign version_value = version_parts[0] | split: '>' %}
-                    <p class="h4">{{ version_value[1] }}</p>
+                    {% assign version_id = version | regex_capture: 'id="([^"]+)"' | first %}
+                    <p class="h4"><a href="{{ release_notes_url }}#{{ version_id }}">{{ version_value[1] }}</a></p>
                     {{ version_parts[1] }}
                 {% endfor %}
             </div>
@@ -26,4 +27,4 @@
     {% endfor %}
 </div>
 {% endif %}
-{% endfor %}
+{% endfor %}

data/_includes/title-header.html

@@ -29,4 +29,6 @@
             <p>{{ description | markdownify }}</p>
         {% endif %}
     </div>
+
+    {% include github.html %}
 </div>

data/_layouts/default.html

@@ -1,31 +1,30 @@
-{%- assign title = page.title | default: "PayEx Design Guide theme for Jekyll" -%}
+{%- assign lead_title = page.lead_title -%}
+{%- if lead_title == nil and page.sidebar.navigation == nil -%}
+    {%- unless page.name contains "index" -%}
+        {%- assign dirname = page.dir | split: "/" | last | remove: "/" | capitalize -%}
+        {%- unless dirname == "" -%}
+            {%- assign lead_title = dirname -%}
+        {%- endunless -%}
+    {%- endunless -%}
+{%- endif -%}
+{%- assign main_title = page.main_title | default: page.title | default: "PayEx Design Guide theme for Jekyll" -%}
+{%- capture title -%}{%- if lead_title != nil -%}{{ lead_title }} – {% endif %}{{ main_title }}{%- endcapture -%}
 {%- assign description = page.opengraph.description | default: site.opengraph.description -%}
 {%- assign image = page.opengraph.image | default: site.opengraph.image -%}
-{%- assign github_branch = site.github.branch | default : "develop" -%}
 {%- assign design_guide_base_url = site.design_guide.base_url | default: 'https://design.swedbankpay.com' -%}
-{%- assign design_guide_version = site.design_guide.version | default: '4.8.1' -%}
+{%- assign design_guide_version = site.design_guide.version | default: '5.0.1' -%}
 {%- assign design_guide_url = design_guide_base_url | append: '/v/' | append: design_guide_version -%}
-{%- if page.sidebar.navigation == nil -%}
-{%- unless page.name contains "index"  -%}
-{%- assign dirname = page.dir | split: "/" | last | remove: "/" | capitalize -%}
-{%- unless dirname == "" -%}
-{%- assign title = dirname | append: " – " | append: title -%}
-{%- endunless -%}
-{%- endunless -%}
-{%- endif -%}
 <!DOCTYPE html>
 <html lang="{{ site.lang | default: "en-US" }}">
-
     <head>
         <meta charset="utf-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <meta name="mobile-web-app-capable" content="yes">
         <meta name="theme-color" content="#000">
-        <meta name="application-name" content="{{ page.title }}">
+        <meta name="application-name" content="{{ title }}">
         <meta name="apple-mobile-web-app-capable" content="yes">
         <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
-        <meta name="apple-mobile-web-app-title"
-            content="{{ page.title | default: 'PayEx Design Guide theme for Jekyll' }}">
+        <meta name="apple-mobile-web-app-title" content="{{ title }}">
         <meta name="msapplication-TileColor" content="#000">
         <meta name="msapplication-TileImage" content="{{ design_guide_version_url }}/icons/mstile-144x144.png">
         <meta property="og:type" value="website" />
@@ -71,16 +70,21 @@
                                         <span>{</span>developer portal<span>}</span>
                                     </div>
                                 </a>
-                                <div class="search-container mx-2 my-4 px-3 py-2 d-flex ">
-                                    <input type="text" id="search-input" class="search-input w-100 " 
+                                {% if site.search.enabled == true %}
+                                <form class="search-container mx-2 my-4 px-3 py-2 d-flex"
+                                    method="get" action="{{ site.search.url | relative_url }}">
+                                    <input name="q" type="text" id="tipue_search_input"
+                                        class="search-input w-100 "
                                         placeholder="Search in documentation"
                                         onfocus="this.placeholder=''"
-                                        onblur="this.placeholder='Search in documentation'">
-                                    
-                                    <label for="search-input" class="mb-0">
+                                        onblur="this.placeholder='Search in documentation'"
+                                        pattern=".{3,}"
+                                        title="At least 3 characters">
+                                    <button class="mb-0">
                                         <i class="material-icons m-0" aria-hidden="true">search</i>
-                                    </label>
-                                </div>
+                                    </button>
+                                </form>
+                                {% endif %}
                                 <ul id="dx-sidebar-main-nav-ul" class="main-nav-ul">
                                 </ul>
                             </nav>

data/_layouts/front-page.html

@@ -21,6 +21,8 @@ layout: default
             <h2 id="front-page-start" class="heading-line heading-line-white">{{ front_page_start_heading }}</h2>
             {% contentblock start %}
         </div>
+
+        {% include github.html %}
     </div>
     <div class="front-page-container">
         {% if show_merchants_bar == true %}

data/_layouts/search.html

@@ -0,0 +1,5 @@
+---
+layout: default
+---
+
+<div id="tipue_search_content"></div>

data/_plugins/swedbank-pay-design-guide-jekyll-theme.rb

@@ -0,0 +1,3 @@
+# frozen_string_literal: true
+
+require_relative '../lib/swedbank-pay-design-guide-jekyll-theme'

data/_sass/accordion-table.scss

@@ -0,0 +1,96 @@
+@import 'colors.scss';
+
+.accordion {
+    align-items: center;
+
+    &.accordion-table {
+        border: none;
+
+        .show {
+            display: block;
+        }
+
+        .hide {
+            display: none;
+        }
+
+        &.accordion-open {
+            border: none;
+
+            .show {
+                display: none;
+            }
+
+            .hide {
+                display: block;
+            }
+        }
+
+        .accordion-header {
+            &:before {
+                bottom: 1rem;
+                margin: auto;
+                transition: .3s;
+                color: $brown;
+            }
+
+            span {
+                font-weight: normal;
+            }
+            &:hover {
+                span {
+                    font-weight: bold;
+                }
+            }
+        }
+
+        .accordion-body {
+            @media (min-width: 1250px) {
+                width: 70vw;
+                max-width: 80rem;
+            }
+        }
+
+        table {
+            border: 1px solid rgba(153, 153, 153, 0.5);
+            border-radius: 0.25rem;
+
+            th {
+                font-size: 0.875rem;
+            }
+
+            tbody {
+                font-size: 0.875rem;
+            
+                tr:nth-child(odd) {
+                    background-color: #F9F8F6;
+                }
+            
+                tr {
+                    td:not(:last-child) {
+                        font-family: $mono;
+                    
+                        code {
+                            border: none;
+                            background-color: transparent;
+                            padding: 0;
+                        }
+                    }
+                
+                    td:not(:last-child):not(:nth-last-child(2)) {
+                        code {
+                            font-weight: 700;
+                        }
+                    }
+                }
+            
+                tr {
+                    &:hover {
+                        background-color: $apricot;
+                        transition: .5s;
+                    }
+                }
+            }
+        }
+    }
+}

data/_sass/front-page.scss

@@ -83,6 +83,10 @@ $front-page-max-width: 1312px;
                 color: $white;
                 font-size: 1.125rem;
             }
+            
+            a {
+                color: #43d0dd;
+            }
 
             .front-page-hero-name {
                 font-family: $mono;

data/_sass/sidebar.scss

@@ -58,6 +58,12 @@
                 }
             }
 
+            button {
+                background-color: $white;
+                border: none;
+                cursor: pointer;
+            }
+
         }
 
         .main-nav-ul {

data/_sass/swedbank-pay-design-guide-theme.scss

@@ -7,6 +7,7 @@
 @import 'code-view.scss';
 @import 'front-page.scss';
 @import 'heading.scss';
+@import 'accordion-table.scss';
 @import 'paragraph-highlight.scss';
 @import 'sidebar.scss';
 @import 'title-header.scss';
@@ -23,7 +24,6 @@ body {
 }
 
 .table {
-
     th,
     td {
         >.material-icons {
@@ -125,6 +125,9 @@ a[href ^='https://']:not([href *='{{ site.url }}']):after {
 }
 
 .documentation {
+    .doc-container {
+        max-width: 100%;
+    }
     code[data-processed='true'].language-mermaid {
         background: none;
         border: none;
@@ -292,4 +295,20 @@ a[href ^='https://']:not([href *='{{ site.url }}']):after {
             font-size: 1rem !important;
         }
     }
+
+    .github {
+        opacity: .5;
+        position: absolute;
+        right: 4rem;
+        top: 4rem;
+        transition: opacity .3s;
+    }
+
+    a.github:after {
+        display: none;
+    }
+
+    a.github:hover {
+        opacity: 1;
+    }
 }

data/_sass/title-header.scss

@@ -34,6 +34,10 @@
         }
         a {
             color: #43d0dd;
+
+            ::after {
+                content: url(../img/external-url-dark-bg.svg);
+            }
         }
     }
 

data/assets/img/external-url-dark-bg.svg

@@ -0,0 +1 @@
+<svg style="fill: #43d0dd; stroke: #43d0dd" enable-background="new 0 0 17 17" viewBox="0 0 17 17" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m17 0v7l-2.8-2.8-8.2 8.2-1.4-1.4 8.2-8.2-2.8-2.8zm-3 17h-14v-14h8v2h-6v10h10v-6h2z" fill-rule="evenodd"/></svg>

data/lib/gem_version.rb

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

data/lib/regex_capture_filter.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+require 'liquid'
+
+# Jekyll
+module Jekyll
+  # Adds a 'regex_capture' filter to Liquid. Performs a regular expression match
+  # on the provided string and returns the capture as an array. Example usage:
+  # {{ html | regex_capture: 'id="([^"]+)"' | first }}
+  module RegexCaptureFilter
+    def regex_capture(str, regex)
+      match = /#{regex}/.match(str)
+      match ? match.captures : []
+    end
+  end
+end
+
+Liquid::Template.register_filter(Jekyll::RegexCaptureFilter)

data/lib/sidebar.rb

@@ -1,4 +1,4 @@
-# frozen_string_literal: false
+# frozen_string_literal: true
 
 require 'jekyll'
 require 'nokogiri'

data/lib/sidebar_page.rb

@@ -1,4 +1,4 @@
-# frozen_string_literal: false
+# frozen_string_literal: true
 
 require 'jekyll'
 require 'nokogiri'
@@ -56,6 +56,11 @@ module SwedbankPay
     end
 
     def hidden_for?(other_page)
+      if @jekyll_page.data['layout'] == 'search'
+        # Never show the search result page in the menu.
+        return true
+      end
+
       # The current page should be hidden for the other page unless the
       # other page is also hidden.
       hidden = hidden?

data/lib/sidebar_page_collection.rb

@@ -1,4 +1,4 @@
-# frozen_string_literal: false
+# frozen_string_literal: true
 
 require 'forwardable'
 

data/lib/swedbank-pay-design-guide-jekyll-theme.rb

@@ -1,3 +1,4 @@
 # frozen_string_literal: true
 
 require_relative 'sidebar'
+require_relative 'regex_capture_filter'

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: swedbank-pay-design-guide-jekyll-theme
 version: !ruby/object:Gem::Version
-  version: 1.9.4
+  version: 1.9.9
 platform: ruby
 authors:
 - Swedbank Pay
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-11-24 00:00:00.000000000 Z
+date: 2021-01-28 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: faraday
@@ -207,6 +207,7 @@ extra_rdoc_files: []
 files:
 - LICENSE
 - README.md
+- _includes/accordion-table.html
 - _includes/alert.html
 - _includes/anchor_headings.html
 - _includes/apple-mobile-headers.html
@@ -217,6 +218,7 @@ files:
 - _includes/card-horizontal-list.html
 - _includes/card-list.html
 - _includes/card.html
+- _includes/github.html
 - _includes/google_analytics.html
 - _includes/img/merchants/logo-coop.svg
 - _includes/img/merchants/logo-elkjop.svg
@@ -243,7 +245,9 @@ files:
 - _includes/toc.html
 - _layouts/default.html
 - _layouts/front-page.html
-- _plugins/sidebar.rb
+- _layouts/search.html
+- _plugins/swedbank-pay-design-guide-jekyll-theme.rb
+- _sass/accordion-table.scss
 - _sass/breakpoints.scss
 - _sass/card.scss
 - _sass/code-view.scss
@@ -262,6 +266,7 @@ files:
 - assets/img/demoshop-mobile2.svg
 - assets/img/demoshop-web.svg
 - assets/img/demoshop.svg
+- assets/img/external-url-dark-bg.svg
 - assets/img/external-url.svg
 - assets/js/mermaid.min.js
 - assets/js/swedbank-pay-design-guide-theme.js
@@ -270,6 +275,7 @@ files:
 - assets/tipuesearch/tipuesearch_content.js
 - assets/tipuesearch/tipuesearch_set.js
 - lib/gem_version.rb
+- lib/regex_capture_filter.rb
 - lib/safe_merge.rb
 - lib/sanitized_filename.rb
 - lib/sidebar.rb

data/_plugins/sidebar.rb

@@ -1,3 +0,0 @@
-# frozen_string_literal: false
-
-require_relative '../lib/sidebar'