swedbank-pay-design-guide-jekyll-theme 1.8 → 1.9.3

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: f57da44f36098220148d4eb99c223c18ee561ddd9de7525598ecadbad350032b
4
- data.tar.gz: f7b47697a6b3aaf102e7ffa7a16309ae1afbc8045f1ce8d4014da83894011f0d
3
+ metadata.gz: bb6399fcb6768466d3a79fa48d7cc148786b6b16e7f2e5116d1d577998b1e411
4
+ data.tar.gz: cf030d126581b3a457204ed655035da20a36308c1cb93297595d1d38c5ca99db
5
5
  SHA512:
6
- metadata.gz: 287ed527957eeb2e96fae0e305c6f060e1f1027a61f4ed592842c60eabb5d7feb19676ee1080a137526a5e23cf020a2deb749a7952eb502379e7621cfbff4112
7
- data.tar.gz: 1729df6cf6f02226c310ce3e7ee0168b8718919a63b8d253bb6b907b4d3c7c90569246f688f073b85764d607819938285a86e991e38368a7fe7bfa264b84079e
6
+ metadata.gz: 14f293bdd5a8913d5fc292eb70d26708a212e2fbe106715495feabb2569311e45287618a881864116964280f3c8a4915b965a59ac95ee1cf681c1b9c38e93672
7
+ data.tar.gz: 40621213c12b27023e3c48ad1387e315cf2ec96e67d00d20abdacb813d34a86fd9eb3478dda9f4a279d220ff03a9183f0aeca81d86abbb80419e12775db96568
@@ -19,7 +19,7 @@ Original creator: https://sebnitu.com/2016/10/13/dynamic-menus-in-jekyll/
19
19
  {% endif %}
20
20
 
21
21
  <ul class="main-nav-ul">
22
- {% assign pages = site.pages | sort: 'menu-order' %}
22
+ {% assign pages = site.pages | sort: 'menu_order' %}
23
23
  {% for node in pages %}
24
24
  {% assign node_parts = node.url | split: '/' %}
25
25
  {% assign node_depth = node_parts | size %}
@@ -113,4 +113,3 @@ Original creator: https://sebnitu.com/2016/10/13/dynamic-menus-in-jekyll/
113
113
  </ul>
114
114
  </nav>
115
115
  </div>
116
-
@@ -0,0 +1,32 @@
1
+ {% assign lead_title = page.lead_title %}
2
+ {% assign main_title = page.main_title | default: page.title %}
3
+ {% assign description = page.description %}
4
+ {% assign estimated_read = page.estimated_read %}
5
+ {% capture max_width_class %}
6
+ {% if page.card_overview %}
7
+ max-width-card-overview
8
+ {% else %}
9
+ max-width
10
+ {% endif %}
11
+ {% endcapture %}
12
+
13
+ <div class="title-header">
14
+ <div class="title-header-container {{ max_width_class | strip }}">
15
+ {% if lead_title != nil %}
16
+ <h4>{{ lead_title }}</h4>
17
+ {% endif %}
18
+
19
+ <h1>{{ main_title }}</h1>
20
+
21
+ {% if estimated_read %}
22
+ <div class="title-header-estimated-read">
23
+ <i class="material-icons">schedule</i>
24
+ {{ estimated_read }} min read
25
+ </div>
26
+ {% endif %}
27
+
28
+ {% if description %}
29
+ <p>{{ description | markdownify }}</p>
30
+ {% endif %}
31
+ </div>
32
+ </div>
@@ -80,30 +80,7 @@
80
80
 
81
81
  <main class="doc-view col-xxl-10 col-lg-9">
82
82
  {% if page.layout != 'front-page' %}
83
- {% assign title_lead = title | split: '–' | first %}
84
- {% assign title_main = title | split: '–' | last %}
85
- {% assign description = page.description %}
86
- {% assign estimated_read = page.estimated_read %}
87
- <div class="title-header">
88
- <div class="title-header-container
89
- {% if page.card_overview %} max-width-card-overview
90
- {% else %} max-width
91
- {% endif %}">
92
- {% if title_lead != title_main %}
93
- <h4>{{ title_lead }}</h4>
94
- {% endif %}
95
- <h1>{{ title_main }}</h1>
96
- {% if estimated_read %}
97
- <div class="title-header-estimated-read">
98
- <i class="material-icons">schedule</i>
99
- {{ estimated_read }} min read
100
- </div>
101
- {% endif %}
102
- {% if description %}
103
- <p>{{ description | markdownify }}</p>
104
- {% endif %}
105
- </div>
106
- </div>
83
+ {% include title-header.html %}
107
84
  {% endif %}
108
85
  <div class="doc-container{% if page.layout == 'front-page' %} no-padding
109
86
  {% elsif page.card_overview %} normal-padding max-width-card-overview
@@ -9,20 +9,20 @@ layout: default
9
9
  {% assign front_page_start_heading = page.front_page.start_heading | default: "Start your integration" %}
10
10
 
11
11
  <div class="front-page">
12
- <div class="front-page-container">
13
- <div class="front-page-top">
14
- <div class="front-page-hero">
15
- <h3>{{ front_page_hero }}</h3>
16
- <div class="front-page-hero-name">
17
- {<span>{{ front_page_title }}</span>}
18
- </div>
19
- <p>{{ front_page_ingress }}</p>
20
- </div>
21
- <div class="front-page-intro-cards">
22
- <h2 id="front-page-start" class="heading-line heading-line-white">{{ front_page_start_heading }}</h2>
23
- {% contentblock start %}
12
+ <div class="front-page-top">
13
+ <div class="front-page-hero">
14
+ <h3>{{ front_page_hero }}</h3>
15
+ <div class="front-page-hero-name">
16
+ {<span>{{ front_page_title }}</span>}
24
17
  </div>
18
+ <p>{{ front_page_ingress }}</p>
25
19
  </div>
20
+ <div class="front-page-intro-cards">
21
+ <h2 id="front-page-start" class="heading-line heading-line-white">{{ front_page_start_heading }}</h2>
22
+ {% contentblock start %}
23
+ </div>
24
+ </div>
25
+ <div class="front-page-container">
26
26
  {% if show_merchants_bar == true %}
27
27
  <div class="front-page-merchants">
28
28
  <h6>Trusted by</h6>
@@ -54,9 +54,9 @@ layout: default
54
54
  {% endif %}
55
55
  <a href="https://ecom.externalintegration.payex.com/pspdemoshop" class="front-page-demoshop">
56
56
  <span class="front-page-demoshop-text">
57
- <span class="h2">Try our Demoshop<span>.</span></span>
57
+ <span class="h2">Try our Demoshop</span>
58
58
  <span class="demoshop-text-description">
59
- Unsure about how it all works? See how our checkout and payment methods are used
59
+ See how our checkout and payment methods are used
60
60
  in practice!
61
61
  </span>
62
62
  </span>
@@ -64,11 +64,11 @@ layout: default
64
64
  <span class="h3">Go to the demoshop</span>
65
65
  <i class="material-icons">arrow_forward</i>
66
66
  <span class="demoshop-link-img">
67
- <img class="demoshop-link-img-mobile d-md-none d-lg-flex d-xl-none d-xxl-flex"
67
+ <img class="demoshop-link-img-mobile d-none d-md-flex"
68
68
  src="/assets/img/demoshop-mobile.svg" alt="demoshop-mobile" />
69
- <img class="demoshop-link-img-mobile d-none d-md-none d-lg-flex d-xl-none"
69
+ <img class="demoshop-link-img-mobile d-none d-xl-flex d-xxl-none"
70
70
  src="/assets/img/demoshop-mobile2.svg" alt="demoshop-mobile2" />
71
- <img class="demoshop-link-img-web d-none d-sm-none d-md-flex d-lg-none d-xl-flex"
71
+ <img class="demoshop-link-img-web d-none d-xxl-flex"
72
72
  src="/assets/img/demoshop-web.svg" alt="demoshop-web" />
73
73
  </span>
74
74
  </span>
@@ -1,2 +1,3 @@
1
1
  # frozen_string_literal: false
2
- require_relative '../lib/sidebar.rb'
2
+
3
+ require_relative '../lib/sidebar'
@@ -0,0 +1,5 @@
1
+ $breakpoint-sm: 576px;
2
+ $breakpoint-md: 768px;
3
+ $breakpoint-lg: 992px;
4
+ $breakpoint-xl: 1200px;
5
+ $breakpoint-xxl: 1600px;
@@ -59,6 +59,7 @@
59
59
  display: flex;
60
60
  flex-direction: column;
61
61
  margin-bottom: 1.25rem;
62
+ font-size: 1rem;
62
63
 
63
64
  .h4 {
64
65
  margin-top: 0;
@@ -1,8 +1,9 @@
1
1
  @import 'colors.scss';
2
2
  @import 'fonts.scss';
3
+ @import 'breakpoints.scss';
3
4
 
4
5
  $front-page-padding: 0 4rem;
5
- $front-page-max-width: 1280px;
6
+ $front-page-max-width: 1312px;
6
7
 
7
8
  @mixin row-cards {
8
9
  >[class*='col-'] {
@@ -49,77 +50,88 @@ $front-page-max-width: 1280px;
49
50
  }
50
51
 
51
52
  .front-page {
53
+ margin: 3rem 2rem 0;
52
54
  position: relative;
53
55
  display: flex;
54
56
  flex-direction: column;
55
57
  align-items: center;
58
+
59
+ .front-page-top {
60
+ position: relative;
61
+ padding: 4rem 4rem 2rem;
62
+ width: 100%;
63
+ margin-bottom: 3rem;
64
+ max-width: 1432px;
65
+ background-color: $dark-brown;
66
+ z-index: 0;
67
+ border-radius: 1rem;
68
+ min-height: 33rem;
56
69
 
57
- .front-page-container {
58
- max-width: $front-page-max-width;
59
- margin: $front-page-padding;
60
-
61
- .front-page-top {
62
- padding-top: 4rem;
63
- width: 100%;
70
+ .front-page-hero {
71
+ position: relative;
72
+ max-width: 38rem;
64
73
  margin-bottom: 3rem;
74
+ z-index: 1;
65
75
 
66
- &:before {
67
- content: "";
68
- display: block;
69
- position: absolute;
70
- top: 0;
71
- left: 0;
72
- background-color: $dark-brown;
73
- width: 100%;
74
- height: 34rem;
75
- z-index: 0;
76
+ h3 {
77
+ color: $yellow;
78
+ font-family: $headline;
79
+ margin-bottom: 0;
76
80
  }
77
81
 
78
- .front-page-hero {
79
- position: relative;
80
- max-width: 35rem;
81
- margin-bottom: 3.5rem;
82
- z-index: 1;
82
+ p {
83
+ color: $white;
84
+ font-size: 1.125rem;
85
+ }
83
86
 
84
- h3 {
85
- color: $yellow;
86
- font-family: $headline;
87
- margin-bottom: 0;
88
- }
87
+ .front-page-hero-name {
88
+ font-family: $mono;
89
+ font-weight: bold;
90
+ font-size: 2rem;
91
+ color: $yellow;
92
+ margin-bottom: 1rem;
89
93
 
90
- p {
94
+ span {
91
95
  color: $white;
92
- font-size: 1.125rem;
93
96
  }
97
+ }
94
98
 
95
- .front-page-hero-name {
96
- font-family: $mono;
97
- font-weight: bold;
98
- font-size: 2rem;
99
- color: $yellow;
100
- margin-bottom: 1rem;
99
+ }
101
100
 
102
- span {
103
- color: $white;
104
- }
101
+ .front-page-intro-cards {
102
+ h2 {
103
+ color: $white;
104
+
105
+ .header-anchor {
106
+ display: none;
105
107
  }
108
+ }
106
109
 
110
+ .row {
111
+ @include row-cards();
107
112
  }
113
+ }
108
114
 
115
+ @media screen and (min-width: $breakpoint-xxl) {
116
+ margin-bottom: 9rem;
117
+
109
118
  .front-page-intro-cards {
110
- h2 {
111
- color: $white;
112
-
113
- .header-anchor {
114
- display: none;
115
- }
116
- }
117
-
118
- .row {
119
- @include row-cards();
120
- }
119
+ position: absolute;
120
+ bottom: -7rem;
121
+ left: 0;
122
+ width: 100%;
123
+ padding: 0 4rem;
121
124
  }
122
125
  }
126
+ }
127
+ .front-page-container {
128
+ max-width: $front-page-max-width;
129
+ margin: $front-page-padding;
130
+ position: relative;
131
+
132
+ @media screen and (max-width: $breakpoint-md) {
133
+ margin: 0;
134
+ }
123
135
 
124
136
  .front-page-merchants {
125
137
  margin-bottom: 3.75rem;
@@ -221,6 +233,7 @@ $front-page-max-width: 1280px;
221
233
  height: 22.5rem;
222
234
  background-color: $dark-brown;
223
235
  text-decoration: none;
236
+ border-radius: 1rem;
224
237
 
225
238
  &:hover,
226
239
  &:focus {
@@ -249,17 +262,29 @@ $front-page-max-width: 1280px;
249
262
 
250
263
  .h2 {
251
264
  color: $white;
252
-
253
- span {
254
- color: $yellow;
255
- }
256
265
  }
257
266
 
258
267
  .demoshop-text-description {
259
268
  color: $white;
260
- width: 45%;
261
- height: 4.5rem;
269
+ width: 40%;
270
+ min-height: 4.5rem;
271
+ font-size: 1rem;
272
+
273
+ }
274
+
275
+ }
276
+
277
+ @media screen and (max-width: $breakpoint-md) {
278
+ padding-top: 3rem;
279
+ height: 18rem;
280
+
281
+ .front-page-demoshop-text {
282
+ .demoshop-text-description {
283
+ width: 100%;
284
+ min-height: 2.25rem;
285
+ }
262
286
  }
287
+
263
288
  }
264
289
 
265
290
  .front-page-demoshop-link {
@@ -297,8 +322,6 @@ $front-page-max-width: 1280px;
297
322
  }
298
323
  }
299
324
 
300
-
301
-
302
325
  .h3 {
303
326
  color: $white;
304
327
  padding-right: 1rem;
@@ -306,6 +329,18 @@ $front-page-max-width: 1280px;
306
329
  margin: 0;
307
330
  }
308
331
  }
332
+
333
+ @media screen and (min-width: $breakpoint-xxl) {
334
+ .front-page-demoshop-text {
335
+ margin-bottom: 1rem;
336
+ }
337
+
338
+ .front-page-demoshop-link {
339
+ .demoshop-link-img {
340
+ bottom: -2rem;
341
+ }
342
+ }
343
+ }
309
344
  }
310
345
 
311
346
 
@@ -1,6 +1,7 @@
1
1
  @import 'colors.scss';
2
2
  @import 'fonts.scss';
3
3
  @import 'variables.scss';
4
+ @import 'breakpoints.scss';
4
5
 
5
6
  @import 'card.scss';
6
7
  @import 'code-view.scss';
@@ -17,6 +18,10 @@ img {
17
18
  max-width: 100%;
18
19
  }
19
20
 
21
+ body {
22
+ font-size: 1.125rem;
23
+ }
24
+
20
25
  .table {
21
26
 
22
27
  th,
@@ -1 +1 @@
1
- $max-width: 704px;
1
+ $max-width: 880px;
@@ -4,7 +4,7 @@ module Gem
4
4
  # Gem Specification
5
5
  class Specification
6
6
  def self.gem_version
7
- '1.8'
7
+ '1.9.3'
8
8
  end
9
9
  end
10
10
  end
@@ -0,0 +1,28 @@
1
+ # frozen_string_literal: true
2
+
3
+ # The Hash class
4
+ class Hash
5
+ # Safely merges the current Hash with an 'other' Hash.
6
+ def safe_merge(other)
7
+ all_keys = keys | other.keys
8
+ result_hash = {}
9
+
10
+ all_keys.each do |key|
11
+ hash_value = {}
12
+
13
+ if key? key
14
+ value = self[key]
15
+ hash_value = value unless value.nil?
16
+ end
17
+
18
+ if other.key? key
19
+ value = other[key]
20
+ hash_value = hash_value.merge(value) unless value.nil?
21
+ end
22
+
23
+ result_hash[key] = hash_value
24
+ end
25
+
26
+ result_hash
27
+ end
28
+ end