swedbank-pay-design-guide-jekyll-theme 2.8.2 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: bef43c1bda12a011153336c8c23e3b82fbd5a8cc9525f1e8973e475052cee712
4
- data.tar.gz: 374ea1214fde77125e260129aa954d13a052b8bdc64d99cc35620e2fad253578
3
+ metadata.gz: e28064d55bb8b2b97cc7a6cfd24178347a6fec42c3cb4c00b7925abab1f1f02f
4
+ data.tar.gz: 4fd452ed00c0b6fe2ccc252396b3a335ace084d1174b89a3afce76f3f6dc8a5d
5
5
  SHA512:
6
- metadata.gz: 9dedc80e83d9446d65f7352774bbeffbbfd7dc57ae5ef30a6c5d87ffcd84752cbe66307ede6a8264d7d5e9bf6ef2c8000489a4a0127aa2c6d2dcc136fd79fbff
7
- data.tar.gz: 8d545455cf8025a821628c6d91553bb44733bcc9bf627f4ed71abc2f578d306c213b16bd091fd00e7a14ef84e20d74493ecf7a1b34d1fab860b3c66944b385b2
6
+ metadata.gz: d3b046c74104f352fff4fa1dc1219c34a41fcd8cb1ce9b14d0843fc15803bad98546cbc27cf4156a18ca5fcc1d89461a5f9fa2c7fe19cd06295cadd304dbc872
7
+ data.tar.gz: ba283af076e0aecf2060ddcc559b5e47618600f81d40d1219f41e11ea63a8d0df955d84a920af3446ea8117fc43b6eb28808b2679934cfb88e30396c0b7d1616
@@ -3,7 +3,7 @@
3
3
  normal-padding
4
4
  {% elsif page.card_overview %}
5
5
  normal-padding max-width-card-overview
6
- {% elsif page.has_release_notes %}
6
+ {% elsif page.release_notes %}
7
7
  dg-front-page py-0
8
8
  {% else %}
9
9
  normal-padding max-width
@@ -14,8 +14,8 @@ normal-padding max-width
14
14
  <article>
15
15
  {% if page.card_overview %}
16
16
  {% include card-overview.html %}
17
- {% elsif page.has_release_notes %}
18
- {% include release_notes.html num_of_releases_to_display=5 %}
17
+ {% elsif page.release_notes %}
18
+ {% include release_notes.html num_of_releases_to_display=5 release_notes_title="What's new in " %}
19
19
  {% else %}
20
20
  {% include anchor_headings.html html=content anchorClass='header-anchor' %}
21
21
  {% endif %}
@@ -1,31 +1,23 @@
1
- {%- comment -%}
2
- **Parameters
3
- release_notes: The release notes pages to use if sitePage.content cannot be used.
4
- {%- endcomment -%}
5
-
6
- {% assign release_notes = include.release_notes %}
7
1
  {% assign num_of_releases_to_display = include.num_of_releases_to_display %}
8
- {% assign min_cnt = num_of_releases_to_display | plus: 1 %}
9
-
10
- {% if page.url contains '/release-notes' %}
11
- {% if release_notes %}
12
- {% assign max_cnt = release_notes | markdownify | split: '</h2>' | size %}
13
- {% assign releases = release_notes | markdownify | split: '<h2' | slice: 1, num_of_releases_to_display %}
14
- {% assign archive = release_notes | markdownify | split: '<h2' | slice: min_cnt, max_cnt %}
15
- {% else %}
16
- {% for sitePage in site.pages %}
17
- {% if sitePage.url == page.url %}
18
- {% assign max_cnt = sitePage.content | markdownify | split: '</h2>' | size %}
19
- {% assign releases = sitePage.content | markdownify | split: '<h2' | slice: 1, num_of_releases_to_display %}
20
- {% assign archive = sitePage.content | markdownify | split: '<h2' | slice: min_cnt, max_cnt %}
21
- {% endif %}
22
- {% endfor %}
23
- {% endif %}
24
- {% endif %}
25
-
2
+ {% assign release_notes_title = include.release_notes_title %}
26
3
  {% if page.url contains '/release-notes' %}
4
+ {% for sitePage in site.pages %}
5
+ {% if sitePage.url == page.url %}
6
+ {% assign min_cnt = num_of_releases_to_display | plus: 1 %}
7
+ {% assign max_cnt = sitePage.content | split: '</h2>' | size %}
8
+ {% assign releases = sitePage.content | markdownify | split: '<h2' | slice: 1, num_of_releases_to_display %}
9
+ {% assign archive = sitePage.content | markdownify | split: '<h2' | slice: min_cnt, max_cnt %}
27
10
  <section class="dg-changelog-container d-flex flex-column mb-0">
28
- <div class="container dg-changelog-content">
11
+ <div class="container dg-changelog-content">
12
+ <div class="row mt-3">
13
+ <span class="dg-changlelog-title">
14
+ {{ release_notes_title | append: sitePage.lead_title }}
15
+ <div class="dg-changelog-divider my-2"></div>
16
+ </span>
17
+ {% include alert.html type="informative" icon="info" header="Version numbers"
18
+ body="The version numbers used in headers on this page refers to the version of
19
+ this very documentation, not to a version of any APIs described by it." %}
20
+ </div>
29
21
  {% for release in releases %}
30
22
  {% if forloop.length > 0 %}
31
23
  {% if forloop.last %}
@@ -41,7 +33,7 @@ release_notes: The release notes pages to use if sitePage.content cannot be used
41
33
  {{ release_value[1] | strip }}
42
34
  </div>
43
35
  {% assign version_list = versions | shift %}
44
- <div class="col dg-changelog-description px-0">
36
+ <div class="dg-changelog-description px-0">
45
37
  {% for version in version_list %}
46
38
  {% assign version_parts = version | split: '</h3>' %}
47
39
  {% assign version_value = version_parts[0] | split: '>' %}
@@ -87,4 +79,7 @@ release_notes: The release notes pages to use if sitePage.content cannot be used
87
79
  {% endif %}
88
80
 
89
81
  </section>
82
+ {% endif %}
83
+
84
+ {% endfor %}
90
85
  {% endif %}
data/_includes/tabs.html CHANGED
@@ -1,9 +1,8 @@
1
1
  {%- comment -%}
2
2
  **Parameters
3
3
  tab_list(required): An array with items having the attributes title(required), content_text (required),
4
- content_src(optional), mark_with_star (optional).
4
+ content_src(optional), mark_with_star (optional)
5
5
  default_tab_index(optional): Index of the tab to be active by default, starting from 1
6
- has_release_notes(optional): Indicate if the tabs contains release notes.
7
6
  {%- endcomment -%}
8
7
 
9
8
  {% assign tabs = include.tab_list %}
@@ -30,12 +29,7 @@ has_release_notes(optional): Indicate if the tabs contains release notes.
30
29
  {% capture sourced_content %}
31
30
  {% include {{tab.content_src}} %}
32
31
  {% endcapture %}
33
-
34
- {% if include.has_release_notes %}
35
- {% include release_notes.html release_notes=sourced_content num_of_releases_to_display=5 %}
36
- {% else %}
37
32
  {{ sourced_content | markdownify }}
38
- {% endif %}
39
33
  </div>
40
34
  {% endif %}
41
35
  {% endfor %}
@@ -44,13 +38,7 @@ has_release_notes(optional): Indicate if the tabs contains release notes.
44
38
  var defaultIndex = {{ default_tab_index | jsonify }};
45
39
  const allTabs = {{ tabs | jsonify }};
46
40
  const compiledTabTextContents = allTabs?.map(tab => tab.content_text);
47
- const compiledTabSrcContents = $(".tab-src");
48
- const hasReleaseNotes = {{ include.has_release_notes | jsonify }};
49
- if(hasReleaseNotes){
50
- const container = $(".doc-container");
51
- container.attr("class", "doc-container dg-front-page py-0");
52
- }
53
-
41
+ const compiledTabSrcContents = $(".tab-src");
54
42
  </script>
55
43
 
56
44
  <script>
@@ -26,4 +26,6 @@
26
26
  <p>{{ description | markdownify }}</p>
27
27
  {% endif %}
28
28
  </div>
29
+
30
+ {% include github.html %}
29
31
  </div>
@@ -1,11 +1,11 @@
1
1
  {%- assign lead_title = page.lead_title -%}
2
2
  {%- if lead_title == nil and page.sidebar.navigation == nil -%}
3
- {%- unless page.name contains "index" -%}
4
- {%- assign dirname = page.dir | split: "/" | last | remove: "/" | capitalize -%}
5
- {%- unless dirname == "" -%}
6
- {%- assign lead_title = dirname -%}
7
- {%- endunless -%}
8
- {%- endunless -%}
3
+ {%- unless page.name contains "index" -%}
4
+ {%- assign dirname = page.dir | split: "/" | last | remove: "/" | capitalize -%}
5
+ {%- unless dirname == "" -%}
6
+ {%- assign lead_title = dirname -%}
7
+ {%- endunless -%}
8
+ {%- endunless -%}
9
9
  {%- endif -%}
10
10
  {%- assign main_title = page.main_title | default: page.title | default: "PayEx Design Guide theme for Jekyll" -%}
11
11
  {%- capture title -%}{%- if lead_title != nil -%}{{ lead_title }} – {% endif %}{{ main_title }}{%- endcapture -%}
@@ -15,8 +15,7 @@
15
15
  {%- assign design_guide_version = site.design_guide.version | default: '7.1.0' -%}
16
16
  {%- assign design_guide_url = design_guide_base_url | append: '/v/' | append: design_guide_version -%}
17
17
  <!DOCTYPE html>
18
- <html lang="{{ site.lang | default: " en-US" }}">
19
-
18
+ <html lang="{{ site.lang | default: "en-US" }}">
20
19
  <head>
21
20
  <meta charset="utf-8" />
22
21
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -31,8 +30,7 @@
31
30
  <meta property="og:type" value="website" />
32
31
  {%- if page.url != nil %}
33
32
  <meta property="og:url" value="{{ page.url | absolute_url }}" />
34
- {%- if page.url contains 'old-implementations' %}
35
- <meta name="robots" content="noindex">{% endif %}
33
+ {%- if page.url contains 'old-implementations' %}<meta name="robots" content="noindex">{% endif %}
36
34
  {% endif %}
37
35
  <meta property="og:title" value="{{ title }}" />
38
36
  <meta name="title" content="{{ title }}" />
@@ -44,19 +42,19 @@
44
42
  <title>{{ title }}</title>
45
43
  <link rel="stylesheet" href="{{ design_guide_url }}/styles/swedbankpay.css" />
46
44
  <link rel="stylesheet" href="{{ design_guide_url }}/styles/documentation-swedbankpay.css" />
47
- <link rel="stylesheet" href="{{- "/assets/css/style.css" | relative_url -}}">
48
- <link rel="stylesheet" href="{{- "/assets/css/pygments-autumn.css" | relative_url -}}">
45
+ <link rel="stylesheet" href="{{ "/assets/css/style.css" | relative_url }}">
46
+ <link rel="stylesheet" href="{{ "/assets/css/pygments-autumn.css" | relative_url }}">
49
47
  <link rel="shortcut icon" href="{{ design_guide_url }}/icons/favicon.ico">
50
48
  <link rel="icon" type="image/png" sizes="16x16" href="{{ design_guide_url }}/icons/favicon-16x16.png">
51
49
  <link rel="icon" type="image/png" sizes="32x32" href="{{ design_guide_url }}/icons/favicon-32x32.png">
52
50
  <link href="https://fonts.googleapis.com/css?family=Material+Icons+Outlined" rel="stylesheet">
53
51
  {%- include apple-mobile-headers.html design_guide_url=design_guide_url -%}
54
- <script src="{{- '/assets/js/mermaid.min.js' | relative_url -}}"></script>
52
+ <script src="{{ '/assets/js/mermaid.min.js' | relative_url }}"></script>
55
53
  {%- if site.search.enabled == true %}
56
54
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
57
- <script src="{{- "/assets/tipuesearch/tipuesearch_content.js" | relative_url -}}"></script>
58
- <script src="{{- "/assets/tipuesearch/tipuesearch_set.js" | relative_url -}}"></script>
59
- <script src="{{- "/assets/tipuesearch/tipuesearch.min.js" | relative_url -}}"></script>
55
+ <script src="{{ "/assets/tipuesearch/tipuesearch_content.js" | relative_url }}"></script>
56
+ <script src="{{ "/assets/tipuesearch/tipuesearch_set.js" | relative_url }}"></script>
57
+ <script src="{{ "/assets/tipuesearch/tipuesearch.min.js" | relative_url }}"></script>
60
58
  {%- endif %}
61
59
  </head>
62
60
 
@@ -64,51 +62,52 @@
64
62
  <div id="overlay"></div>
65
63
  <div id="designguide">
66
64
  <header id="dg-topbar" class="topbar topbar-max-md-sticky d-md-flex d-lg-none">
67
- <button type="button" class="topbar-btn" aria-label="Open menu" aria-haspopup="menu"
68
- aria-expanded="false" aria-controls="topbar-nav">
69
- <i class="material-icons topbar-btn-icon">menu</i>
70
- </button><button type="button" class="topbar-close" aria-label="Close menu">
71
- <i class="material-icons topbar-btn-icon">close</i>
72
- </button>
73
- <a class="topbar-logo" href="/" aria-label="To homepage">
74
- <img src="{{ design_guide_url }}/designguide/assets/swedbankpay-logo-v.svg" alt="swedbankpay logo"
75
- class="logotype-vertical logotype-sm" />
76
- </a>
65
+ <button type="button" class="topbar-btn" aria-label="Open menu" aria-haspopup="menu" aria-expanded="false" aria-controls="topbar-nav">
66
+ <i class="material-icons topbar-btn-icon">menu</i>
67
+ </button><button type="button" class="topbar-close" aria-label="Close menu">
68
+ <i class="material-icons topbar-btn-icon">close</i>
69
+ </button>
70
+ <a class="topbar-logo" href="/" aria-label="To homepage">
71
+ <img src="{{ design_guide_url }}/designguide/assets/swedbankpay-logo-v.svg" alt="swedbankpay logo" class="logotype-vertical logotype-sm" />
72
+ </a>
77
73
  </header>
78
74
  <div class="documentation">
79
- <div id="search-box-container" class="form-group search-box search-expander">
80
- {% if site.search.enabled == true and page.name != "search.md" %}
81
- <form class="search d-flex" method="get" action="{{ site.search.url | relative_url }}">
82
- <input name="q" type="text" id="tipue_search_input" class="form-control search-input"
83
- placeholder="Search in documentation" onfocus="this.placeholder=''"
84
- onblur="this.placeholder='Search in documentation'" pattern=".{3,}"
75
+ <div class="form-group search-box search-expander">
76
+ {% if site.search.enabled == true %}
77
+ <form class="search d-flex"
78
+ method="get" action="{{ site.search.url | relative_url }}">
79
+ <input name="q" type="text" id="tipue_search_input"
80
+ class="form-control search-input"
81
+ placeholder="Search in documentation"
82
+ onfocus="this.placeholder=''"
83
+ onblur="this.placeholder='Search in documentation'"
84
+ pattern=".{3,}"
85
85
  title="At least 3 characters">
86
- <button id="search-btn" class="btn btn-primary btn-icon-lg" type="submit"
87
- aria-label="Search button">
86
+ <button id="search-btn"class="btn btn-primary btn-icon-lg" type="submit" aria-label="Search button">
88
87
  <i class="material-icons-outlined" aria-hidden="true">search</i>
89
88
  </button>
90
89
  </form>
91
90
  {% endif %}
92
91
  </div>
93
92
  <div class="d-md-flex">
94
- <div id="dg-sidebar" class="sidebar dg-sidebar has-secondary-nav">
95
- <nav class="sidebar-main-nav">
96
- <div class="sidebar-logo">
97
- <a href="/" class="sidebar-header">
98
- <img src="{{ design_guide_url }}/designguide/assets/swedbankpay-logo-v.svg"
99
- alt="Swedbank Pay vertical logo" class="logotype-vertical logotype-lg" />
100
- </a>
101
- </div>
102
- <ul id="dx-sidebar-main-nav-ul" class="main-nav-ul">
103
- </ul>
104
- </nav>
105
- </div>
106
- <main class="doc-view">
107
- {% if page.layout != 'front-page' %}
93
+ <div id="dg-sidebar" class="sidebar dg-sidebar has-secondary-nav">
94
+ <nav class="sidebar-main-nav">
95
+ <div class="sidebar-logo">
96
+ <a href="/" class="sidebar-header">
97
+ <img src="{{ design_guide_url }}/designguide/assets/swedbankpay-logo-v.svg"
98
+ alt="Swedbank Pay vertical logo" class="logotype-vertical logotype-lg"/>
99
+ </a>
100
+ </div>
101
+ <ul id="dx-sidebar-main-nav-ul" class="main-nav-ul">
102
+ </ul>
103
+ </nav>
104
+ </div>
105
+ <main class="doc-view">
106
+ {% if page.layout != 'front-page' %}
108
107
  {% include title-header.html %}
109
- {% endif %}
110
- {% include doc-container.html %}
111
- </main>
108
+ {% endif %}
109
+ {% include doc-container.html %}
110
+ </main>
112
111
  </div>
113
112
  </div>
114
113
  </div>
@@ -116,8 +115,8 @@
116
115
  <script src="{{ '/assets/js/swedbank-pay-design-guide-theme.js' | relative_url }}"></script>
117
116
  <script src="{{ '/assets/js/cookie-consent.js' | relative_url }}"></script>
118
117
  {%- if site.google_analytics.tracking_id %}
119
- {% include google_analytics.html %}
118
+ {% include google_analytics.html %}
120
119
  {%- endif %}
121
120
  </body>
122
121
 
123
- </html>
122
+ </html>
@@ -62,8 +62,8 @@ layout: default
62
62
  <div class="front-page-container">
63
63
  {% contentblock intro_cards%}
64
64
 
65
- <div class="front-page-promotion-container">
66
- {% contentblock promotion-container %}
65
+ <div class="front-page-playground">
66
+ {% contentblock playground %}
67
67
  </div>
68
68
 
69
69
  <div class="front-page-cards-sdk">
data/_layouts/search.html CHANGED
@@ -1,24 +1,5 @@
1
1
  ---
2
2
  layout: default
3
3
  ---
4
- <form class="search d-flex" method="get" action="{{ site.search.url | relative_url }}">
5
- <input name="q" type="text" id="tipue_search_input" class="form-control search-input"
6
- placeholder="Search in documentation" onfocus="this.placeholder=''"
7
- onblur="this.placeholder='Search in documentation'" pattern=".{3,}" title="At least 3 characters">
8
- <script>
9
- (function () {
10
- var params = new URLSearchParams(window.location.search);
11
- var q = params.get('q');
12
- if (q) {
13
- document.getElementById('tipue_search_input').value = q;
14
- }
15
- })();
16
- </script>
17
- <button id="search-btn" class="btn btn-primary btn-icon-lg" type="submit" aria-label="Search button">
18
- <i class="material-icons-outlined" aria-hidden="true">search</i>
19
- </button>
20
- </form>
21
- <p id="search-hint-text" class="hint-text mb-5">Tip: Try using quotes for more precise
22
- results. <code>online payments</code> will give a different result compared to <code>"online payments"</code>.</p>
23
4
 
24
- <div id="tipue_search_content"></div>
5
+ <div id="tipue_search_content"></div>
@@ -9,7 +9,6 @@
9
9
  @import 'paragraph-highlight.scss';
10
10
  @import 'sidebar.scss';
11
11
  @import 'title-header.scss';
12
- @import 'tipue_search.scss';
13
12
 
14
13
  $bg: #f5f2f0;
15
14
  $darkened-bg: darken($bg, 10%);
@@ -28,10 +27,6 @@ img {
28
27
  padding-left: 0;
29
28
  }
30
29
 
31
- .cards:has(.cards-cta) {
32
- min-width: 100% !important;
33
- }
34
-
35
30
  body {
36
31
  font-size: 1.125rem;
37
32
  }
@@ -87,95 +82,6 @@ body {
87
82
  // }
88
83
  // }
89
84
 
90
- /** API object detailed table styles **/
91
- /* Container */
92
- .api-compact{border:1px solid #EBE7E2;border-radius:4px;overflow:hidden;background:#FFF;font-size:.95rem;margin-bottom: 1rem;margin-top: 2em;}
93
- .api-compact .header{display:grid;grid-template-columns:1fr 74px 68px;gap:12px;padding:10px 14px;font-weight:550;background-color: #F9F8F6;border-bottom:2px solid #EBE7E2;}
94
-
95
- /* Item */
96
- .api-item{position:relative}
97
- .api-item>summary{list-style:none;display:grid;grid-template-columns:1fr 80px 70px;gap:12px;align-items:start;padding:10px 14px;cursor:pointer;border-left:3px solid transparent;}
98
- .api-item>summary::-webkit-details-marker{display:none}
99
-
100
- /* Expanderingsikon */
101
- .api-item[open]>summary i.chev{transform:rotate(45deg);}
102
-
103
- /* Field/Type/Req */
104
- .api-item .field{font-weight:550;display:inline-flex;align-items:center;gap:8px;min-width:0;position:relative}
105
- .api-item .field code{border-radius:6px;border: 1px solid #EE7023;}
106
- .api-item .type code{font-size:.9em;background:#f6f8fa;padding:2px 6px;border-radius:6px;}
107
- .field-level::before {
108
- font-family: "Akkurat Mono", monospace;
109
- color: #EE7023;
110
- content: "╰─╼";
111
- }
112
- .field-level-0::before {
113
- content: "";
114
- }
115
- .api-item .req{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}
116
- .api-item .desc{padding:16px 14px 16px 16px;border-left:3px solid transparent;border-bottom: thin solid lightgray;}
117
-
118
- /* Indrag (summary) */
119
- .api-item[data-level="0"]>summary .field,.api-item[data-level="1"]>summary .field{padding-left:0}
120
- .api-item[data-level="2"]>summary .field{padding-left:22px}
121
- .api-item[data-level="3"]>summary .field{padding-left:44px}
122
- .api-item[data-level="4"]>summary .field{padding-left:70px;}
123
-
124
- /* Description – nivå (level+1) med kort lokal linje*/
125
- .indent-0{margin-left:4px;}
126
- .indent-1{margin-left:26px;}
127
- .indent-2{margin-left:48px;}
128
- .indent-3{margin-left:70px;}
129
- .indent-4{margin-left:92px;}
130
-
131
- /* Öppen */
132
- .api-item[open] > .desc {
133
- background:#fafafa;
134
- }
135
-
136
- /* Hover */
137
- .api-item:has(> summary:hover) > summary,
138
- .api-item:has(> .desc:hover) > summary {
139
- background:#EBE7E2;
140
- border-left-color:#EE7023;
141
- }
142
- .api-item:has(> summary:hover) > .desc,
143
- .api-item:has(> .desc:hover) > .desc {
144
- background:#EBE7E2;
145
- }
146
-
147
- /* Fokus */
148
- .api-item:has(> summary:focus-visible) > .desc,
149
- .api-item:has(> .desc:focus-within) > .desc {
150
- background:#fafafa;
151
- }
152
-
153
- /* Vänsterkantsaccent på just DENNA desc när summary ELLER desc hovras */
154
- .api-item[open]:has(> summary:hover) > .desc,
155
- .api-item[open]:has(> .desc:hover) > .desc {
156
- border-left-color:#EE7023;
157
- }
158
-
159
- /* Tangentbordsstöd: accent på summary när dess egna desc får fokus */
160
- .api-item:has(> .desc:focus-within) > summary,
161
- .api-item:has(> summary:focus-visible) > summary {
162
- background:#fafafa;
163
- border-left-color:#EE7023;
164
- }
165
-
166
- /* Children wrapper */
167
- .api-children{padding-left:0;margin:6px 0 10px 0}
168
- .api-children .api-item{border-bottom:none}
169
-
170
- /* Mobil */
171
- @media (max-width:640px){
172
- .api-compact .header{display:none}
173
- .api-item>summary{grid-template-columns:1fr;gap:6px}
174
- .api-item .type,.api-item .req{opacity:.85;font-weight:500;justify-content:flex-start}
175
- }
176
- /** API object detailed table styles - END **/
177
-
178
-
179
85
  #designguide .designguide-header .topbar-info a {
180
86
  margin-left: 5px;
181
87
  color: rgba(34, 34, 34, .75);
@@ -532,43 +438,40 @@ body {
532
438
  }
533
439
  }
534
440
 
535
- #search-btn {
536
- height: 56px;
537
- border-top-left-radius: 0;
538
- border-bottom-left-radius: 0;
539
- }
540
-
541
- .search-input {
542
- border-top-right-radius: 0;
543
- border-bottom-right-radius: 0;
544
- }
545
-
546
441
  .search-box {
547
442
  position: absolute;
548
- right: 1rem;
549
- top: 1rem;
443
+ right: 8rem;
444
+ top: 1.5rem;
550
445
  z-index: 2;
551
446
 
447
+
448
+ .search-input {
449
+ border-top-right-radius: 0;
450
+ border-bottom-right-radius: 0;
451
+ }
452
+
453
+ #search-btn {
454
+ border-top-left-radius: 0;
455
+ border-bottom-left-radius: 0;
456
+ height: 56px;
457
+ }
458
+
552
459
  @media screen and (max-width: $breakpoint-lg) {
553
460
  position: fixed;
554
461
  right: 1rem;
555
462
  top: 1rem;
556
463
  z-index: 401;
557
464
 
465
+ #tipue_search_input {
466
+ display: none;
467
+ }
468
+
558
469
  #search-btn {
559
470
  border-top-left-radius: 8px;
560
471
  border-top-left-radius: var(--border-radius);
561
472
  border-bottom-left-radius: 8px;
562
473
  border-bottom-left-radius: var(--border-radius);
563
474
  }
564
-
565
- #tipue_search_input {
566
- display: none;
567
- }
568
-
569
- #search-box-container {
570
- max-width: 54px;
571
- }
572
475
  }
573
476
  }
574
477
 
@@ -579,7 +482,7 @@ body {
579
482
  }
580
483
  }
581
484
 
582
- .promotion-container-cta {
485
+ .playground-cta {
583
486
  margin-top: 2.5rem;
584
487
 
585
488
  @media screen and (max-width: $breakpoint-lg) {
@@ -7,7 +7,7 @@
7
7
 
8
8
  .title-header-container {
9
9
  width: 100%;
10
- padding: 4rem 1rem;
10
+ padding: 3rem 1rem;
11
11
 
12
12
  h1,
13
13
  h4,
@@ -1,50 +1,55 @@
1
- // Ensure DOM is ready before manipulating it
2
- if (document.readyState === 'loading') {
3
- document.addEventListener('DOMContentLoaded', initCookieConsent);
4
- } else {
5
- initCookieConsent();
6
- }
1
+ function OptanonWrapper() { }
7
2
 
8
- function initCookieConsent() {
9
- if (location.host === "developer.swedbankpay.com") {
10
- var script = document.createElement('script');
11
- script.src = 'https://cdn.consentmanager.net/delivery/js/semiautomatic.min.js';
12
- script.type = "text/javascript";
13
- script.setAttribute("data-cmp-ab", "1");
14
- script.setAttribute("data-cmp-host", "d.delivery.consentmanager.net");
15
- script.setAttribute("data-cmp-cdn", "cdn.consentmanager.net");
16
- script.setAttribute("data-cmp-cdid", "4da9d0f9328c3");
17
- script.setAttribute("data-cmp-codesrc", "0");
18
- document.body.appendChild(script);
19
- }
3
+ function activateClarity() {
4
+ // Clarity script - do not change
5
+ (function(c,l,a,r,i,t,y){
6
+ c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
7
+ t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
8
+ y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
9
+ })(window, document, "clarity", "script", "jd3awxna38");
10
+ // End of Clarity script
20
11
  }
21
12
 
22
- // Clarity script - do not change
23
- (function (c, l, a, r, i, t, y) {
24
- c[a] = c[a] || function () { (c[a].q = c[a].q || []).push(arguments) };
25
- t = l.createElement(r); t.async = 1; t.src = "https://www.clarity.ms/tag/" + i;
26
- y = l.getElementsByTagName(r)[0]; y.parentNode.insertBefore(t, y);
27
- })(window, document, "clarity", "script", "jd3awxna38");
28
- // End of Clarity script
13
+ function getCookie(name) {
14
+ if (document.cookie.split(";").some((c) => c.trim().startsWith(name + "="))) {
15
+ return document.cookie.split(";").find((c) => c.trim().startsWith(name + "="));
16
+ }
17
+ else {
18
+ return false;
19
+ }
20
+ }
29
21
 
30
- function updateConsent(e, o) {
31
- var clarityVendorId = "s2631";
32
- var result = __cmp('getCMPData');
33
- if ("vendorConsents" in result) {
34
- if (clarityVendorId in result.vendorConsents && result.vendorConsents[clarityVendorId]) {
35
- window.clarity("consentv2", { analytics_Storage: "granted" });
36
- } else {
37
- window.clarity("consentv2", { analytics_Storage: "denied" });
22
+ function deleteCookie(name) {
23
+ if (getCookie(name)) {
24
+ document.cookie = name + "=;domain=.swedbankpay.com;path=/;expires=Thu, 01 Jan 1970 00:00:01 GMT";
38
25
  }
39
- }
40
26
  }
41
27
 
42
- function initCMP() {
43
- if (typeof __cmp !== 'undefined') {
44
- __cmp("addEventListener", ["consent", updateConsent, false], null);
45
- } else {
46
- setTimeout(initCMP, 100);
47
- }
28
+ function inactivateClarityCookies() {
29
+ deleteCookie("_clck");
30
+ deleteCookie("_clsk");
48
31
  }
49
32
 
50
- initCMP();
33
+ window.addEventListener("DOMContentLoaded", (event) => {
34
+ if (location.host === "developer.swedbankpay.com") {
35
+ var script = document.createElement('script');
36
+ script.src = 'https://cdn.cookielaw.org/scripttemplates/otSDKStub.js';
37
+ script.type = "text/javascript";
38
+ script.charset = "UTF-8";
39
+ script.setAttribute("data-domain-script", "77c777e5-115a-4e3d-81ec-cc857a4ac846");
40
+ document.body.appendChild(script);
41
+ }
42
+ else {
43
+ document.cookie = "_clck=;domain=.swedbankpay.com;expires=Thu, 01 Jan 1970 00:00:01 GMT";
44
+ document.cookie = "_clsk=;domain=.swedbankpay.com;expires=Thu, 01 Jan 1970 00:00:01 GMT";
45
+ }
46
+ });
47
+
48
+ window.addEventListener("OneTrustGroupsUpdated", (event) => {
49
+ if (event.detail && event.detail.indexOf("C0002") !== -1) {
50
+ activateClarity();
51
+ }
52
+ else {
53
+ inactivateClarityCookies();
54
+ }
55
+ });