wickes-css2 2.101.0-develop.1 → 2.101.0-develop.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.
Files changed (7) hide show
  1. package/Readme.md +0 -1
  2. package/build/css/pages/tradePro-rewards.css +1 -1
  3. package/build/css/pdp-main-non-critical.css +1 -1
  4. package/package.json +1 -1
  5. package/src/components/voucher.hbs +32 -24
  6. package/src/data/data_voucher_tradePro.json +70 -62
  7. package/src/scss/pages/tradePro-rewards.scss +19 -3
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "wickes-css2",
3
- "version": "2.101.0-develop.1",
3
+ "version": "2.101.0-develop.3",
4
4
  "description": "CSS and JS and page templates in use by Wickes",
5
5
  "main": "index.js",
6
6
  "scripts": {
package/src/components/voucher.hbs CHANGED
@@ -9,26 +9,6 @@
9
9
  </div>
10
10
  {{#ifCond isOnline '||' isInstore}}
11
11
  <div class="voucher__column">
12
- {{#if isInstore}}
13
- <div class="voucher__cell d-flex flex-column">
14
- {{!-- instore --}}
15
- <span class="voucher__label">{{instore.label}}</span>
16
- <div class="voucher__content">
17
- <div>
18
- <h4 class="mb-0">{{title}}</h4>
19
- <p class="mt-1 mb-0">{{instore.name}}</p>
20
- <p class="mt-1 mb-0">{{instore.expiration}}</p>
21
- </div>
22
- <div class="mt-3">
23
- <div class="voucher__barcode-img">
24
- <svg id="barcode" jsbarcode-value="00010931000118010" jsbarcode-width="3" jsbarcode-height="119" jsbarcode-displayvalue="false" jsbarcode-margin="0" width="435px" height="119px" x="0px" y="0px" viewBox="0 0 435 119" xmlns="http://www.w3.org/2000/svg" version="1.1" style="transform: translate(0px, 0px);"><rect x="0" y="0" width="435" height="119" style="fill:#ffffff;"></rect><g transform="translate(0, 0)" style="fill:#000000;"><rect x="0" y="0" width="6" height="119"></rect><rect x="9" y="0" width="3" height="119"></rect><rect x="18" y="0" width="9" height="119"></rect><rect x="33" y="0" width="6" height="119"></rect><rect x="42" y="0" width="6" height="119"></rect><rect x="54" y="0" width="6" height="119"></rect><rect x="66" y="0" width="6" height="119"></rect><rect x="78" y="0" width="6" height="119"></rect><rect x="87" y="0" width="6" height="119"></rect><rect x="99" y="0" width="6" height="119"></rect><rect x="111" y="0" width="3" height="119"></rect><rect x="120" y="0" width="3" height="119"></rect><rect x="132" y="0" width="6" height="119"></rect><rect x="141" y="0" width="6" height="119"></rect><rect x="156" y="0" width="6" height="119"></rect><rect x="165" y="0" width="6" height="119"></rect><rect x="174" y="0" width="6" height="119"></rect><rect x="186" y="0" width="6" height="119"></rect><rect x="198" y="0" width="6" height="119"></rect><rect x="210" y="0" width="6" height="119"></rect><rect x="219" y="0" width="6" height="119"></rect><rect x="231" y="0" width="6" height="119"></rect><rect x="243" y="0" width="9" height="119"></rect><rect x="258" y="0" width="3" height="119"></rect><rect x="264" y="0" width="6" height="119"></rect><rect x="276" y="0" width="6" height="119"></rect><rect x="285" y="0" width="6" height="119"></rect><rect x="297" y="0" width="9" height="119"></rect><rect x="309" y="0" width="3" height="119"></rect><rect x="315" y="0" width="12" height="119"></rect><rect x="330" y="0" width="3" height="119"></rect><rect x="339" y="0" width="9" height="119"></rect><rect x="351" y="0" width="6" height="119"></rect><rect x="363" y="0" width="9" height="119"></rect><rect x="378" y="0" width="3" height="119"></rect><rect x="384" y="0" width="6" height="119"></rect><rect x="396" y="0" width="6" height="119"></rect><rect x="411" y="0" width="9" height="119"></rect><rect x="423" y="0" width="3" height="119"></rect><rect x="429" y="0" width="6" height="119"></rect></g></svg>
25
- </div>
26
- <div class="voucher__barcode-number">{{instore.barcodeNumber}}</div>
27
- </div>
28
- </div>
29
- {{!-- /instore --}}
30
- </div>
31
- {{/if}}
32
12
  {{#if isOnline}}
33
13
  <div class="voucher__cell d-flex flex-column">
34
14
  {{!-- online --}}
@@ -38,16 +18,17 @@
38
18
  {{#if online.title}}
39
19
  <h4 class="mb-0">{{online.title}}</h4>
40
20
  {{/if}}
41
- <p class="mt-1 mb-0">{{online.note}}</p>
21
+ <p class="mt-2 mb-0">{{online.note}}</p>
42
22
  </div>
43
23
  <div class="my-3">
44
- <div class="voucher__code-field copy-tradePro-barcode">
24
+ <span class="voucher__code-title">Code:</span>
25
+ <span class="voucher__code-field copy-tradePro-barcode">
45
26
  <span>{{online.code}}</span>
46
27
  <input type="hidden" value="{{online.code}}" disabled>
47
28
  <span class="icon">
48
29
  <i class="fas fa-copy"></i>
49
30
  </span>
50
- </div>
31
+ </span>
51
32
  </div>
52
33
  {{#ifCond online.buttonLink "&&" online.buttonText}}
53
34
  <a href="{{online.buttonLink}}" class="btn btn-primary">
@@ -57,6 +38,33 @@
57
38
  </div>
58
39
  {{!-- /online --}}
59
40
  </div>
41
+ {{/if}}
42
+ {{#if isInstore}}
43
+ <div class="voucher__cell d-flex flex-column">
44
+ {{!-- instore --}}
45
+ <span class="voucher__label">{{instore.label}}</span>
46
+ <div class="voucher__content">
47
+ <div>
48
+ {{#if instore.title}}
49
+ <h4 class="mb-0">{{instore.title}}</h4>
50
+ {{/if}}
51
+ <p class="mt-2 mb-0">{{instore.expiration}}</p>
52
+ </div>
53
+ <div class="mt-3">
54
+ <div class="voucher__code-title mb-2">Code:</div>
55
+ <div class="voucher__barcode-img">
56
+ <svg id="barcode" jsbarcode-value="00010931000118010" jsbarcode-width="3" jsbarcode-height="119" jsbarcode-displayvalue="false" jsbarcode-margin="0" width="435px" height="119px" x="0px" y="0px" viewBox="0 0 435 119" xmlns="http://www.w3.org/2000/svg" version="1.1" style="transform: translate(0px, 0px);"><rect x="0" y="0" width="435" height="119" style="fill:#ffffff;"></rect><g transform="translate(0, 0)" style="fill:#000000;"><rect x="0" y="0" width="6" height="119"></rect><rect x="9" y="0" width="3" height="119"></rect><rect x="18" y="0" width="9" height="119"></rect><rect x="33" y="0" width="6" height="119"></rect><rect x="42" y="0" width="6" height="119"></rect><rect x="54" y="0" width="6" height="119"></rect><rect x="66" y="0" width="6" height="119"></rect><rect x="78" y="0" width="6" height="119"></rect><rect x="87" y="0" width="6" height="119"></rect><rect x="99" y="0" width="6" height="119"></rect><rect x="111" y="0" width="3" height="119"></rect><rect x="120" y="0" width="3" height="119"></rect><rect x="132" y="0" width="6" height="119"></rect><rect x="141" y="0" width="6" height="119"></rect><rect x="156" y="0" width="6" height="119"></rect><rect x="165" y="0" width="6" height="119"></rect><rect x="174" y="0" width="6" height="119"></rect><rect x="186" y="0" width="6" height="119"></rect><rect x="198" y="0" width="6" height="119"></rect><rect x="210" y="0" width="6" height="119"></rect><rect x="219" y="0" width="6" height="119"></rect><rect x="231" y="0" width="6" height="119"></rect><rect x="243" y="0" width="9" height="119"></rect><rect x="258" y="0" width="3" height="119"></rect><rect x="264" y="0" width="6" height="119"></rect><rect x="276" y="0" width="6" height="119"></rect><rect x="285" y="0" width="6" height="119"></rect><rect x="297" y="0" width="9" height="119"></rect><rect x="309" y="0" width="3" height="119"></rect><rect x="315" y="0" width="12" height="119"></rect><rect x="330" y="0" width="3" height="119"></rect><rect x="339" y="0" width="9" height="119"></rect><rect x="351" y="0" width="6" height="119"></rect><rect x="363" y="0" width="9" height="119"></rect><rect x="378" y="0" width="3" height="119"></rect><rect x="384" y="0" width="6" height="119"></rect><rect x="396" y="0" width="6" height="119"></rect><rect x="411" y="0" width="9" height="119"></rect><rect x="423" y="0" width="3" height="119"></rect><rect x="429" y="0" width="6" height="119"></rect></g></svg>
57
+ </div>
58
+ <div class="voucher__barcode-number mb-3">{{instore.barcodeNumber}}</div>
59
+ {{#ifCond instore.buttonLink "&&" instore.buttonText}}
60
+ <a href="{{instore.buttonLink}}" class="btn btn-primary">
61
+ <span class="btn__text">{{instore.buttonText}}</span>
62
+ </a>
63
+ {{/ifCond}}
64
+ </div>
65
+ </div>
66
+ {{!-- /instore --}}
67
+ </div>
60
68
  {{/if}}
61
69
  </div>
62
70
  {{/ifCond}}
@@ -65,7 +73,7 @@
65
73
  {{#if description.short}}
66
74
  <p class="voucher__description-title mb-2">{{description.short}}</p>
67
75
  {{/if}}
68
- <p class="voucher__description-text mb-0">{{description.long}}</p>
76
+ <p class="voucher__description-text mb-0">{{{description.long}}}</p>
69
77
  {{#ifCond description.buttonLink "&&" description.buttonText}}
70
78
  <a href="{{description.buttonLink}}" class="btn btn-primary voucher__description-button">
71
79
  <span class="btn__text">{{description.buttonText}}</span>
package/src/data/data_voucher_tradePro.json CHANGED
@@ -1,130 +1,138 @@
1
1
  {
2
2
  "page_tradePro_vouchers": {
3
3
  "instoreAndOnline": {
4
- "title":"TradePro First 15% off",
4
+ "title":"£4.99 unlimited breakfast. Ends October 1st",
5
5
  "isOnline": true,
6
6
  "isInstore": true,
7
7
  "img": "./img/placeholders/img-placeholder-rewards.png",
8
8
  "imgAlt": "Voucher image",
9
9
  "instore": {
10
- "label": "In store",
11
- "name": "Mr John Smith",
12
- "expiration": "Valid on Monday 23 July only",
13
- "barcodeNumber": "00016221000711490"
10
+ "label": "Type: In-store ",
11
+ "title": "Exclusive £4.99 all you can eat breakfast. As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. Redeem now! Hurry, ends 1st October.",
12
+ "expiration": "Offer ends: 1st October 2025",
13
+ "barcodeNumber": "00016221000711490",
14
+ "buttonText": "Redeem now",
15
+ "buttonLink": "#"
14
16
  },
15
17
  "online": {
16
- "label": "Online",
17
- "title": "TradePro custom title",
18
- "note": "Don't forget to use this code on checkout",
19
- "code": "WPRAJU119",
20
- "buttonText": "Shop now",
18
+ "label": "Type: Online",
19
+ "title": "Exclusive £4.99 all you can eat breakfast",
20
+ "note": "Offer ends: 1st October 2025",
21
+ "code": "WKBREAKFAST1023",
22
+ "buttonText": "Redeem now",
21
23
  "buttonLink": "#"
22
24
  },
23
25
  "description": {
24
- "short": "Short description",
25
- "long": "With the summer holidays officially starting this week, make sure you're stocked up before you head away, then have nothing to worry about when you return. To help you out we're giving our TradePro members 15% off everything in-store Monday 23rd July only."
26
+ "short": "Exclusive £4.99 all you can eat breakfast.",
27
+ "long": "As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. <b>Redeem now! Hurry, ends 1st October.</b>"
26
28
  }
27
29
  },
28
30
  "online": {
29
- "title":"TradePro First 15% off (online only)",
31
+ "title":"£4.99 unlimited breakfast. Ends October 1st (online only)",
30
32
  "isOnline": true,
31
33
  "isInstore": false,
32
34
  "img": "./img/placeholders/img-placeholder-rewards.png",
33
35
  "imgAlt": "Voucher image",
34
36
  "instore": {
35
- "label": "In store",
36
- "name": "Mr John Smith",
37
- "expiration": "Valid on Monday 23 July only",
38
- "barcodeNumber": "00016221000711490"
37
+ "label": "Type: In-store ",
38
+ "title": "Exclusive £4.99 all you can eat breakfast. As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. Redeem now! Hurry, ends 1st October.",
39
+ "expiration": "Offer ends: 1st October 2025",
40
+ "barcodeNumber": "00016221000711490",
41
+ "buttonText": "Redeem now",
42
+ "buttonLink": "#"
39
43
  },
40
44
  "online": {
41
- "label": "Online-only",
42
- "title": "TradePro custom title",
43
- "note": "Don't forget to use this code on checkout",
44
- "code": "TPRNUR19-E9X9-XK2B",
45
- "buttonText": "Shop now",
45
+ "label": "Type: Online",
46
+ "title": "Exclusive £4.99 all you can eat breakfast",
47
+ "note": "Offer ends: 1st October 2025",
48
+ "code": "WKBREAKFAST1023",
49
+ "buttonText": "Redeem now",
46
50
  "buttonLink": "#"
47
51
  },
48
52
  "description": {
49
- "short": "Short description",
50
- "long": "With the summer holidays officially starting this week, make sure you're stocked up before you head away, then have nothing to worry about when you return. To help you out we're giving our TradePro members 15% off everything in-store Monday 23rd July only."
53
+ "short": "Exclusive £4.99 all you can eat breakfast.",
54
+ "long": "As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. <b>Redeem now! Hurry, ends 1st October.</b>"
51
55
  }
52
56
  },
53
57
  "instore": {
54
- "title":"TradePro First 15% off (instore only)",
58
+ "title":"£4.99 unlimited breakfast. Ends October 1st (instore only)",
55
59
  "isOnline": false,
56
60
  "isInstore": true,
57
61
  "img": "./img/placeholders/img-placeholder-rewards.png",
58
62
  "imgAlt": "Voucher image",
59
63
  "instore": {
60
- "label": "In-store only",
61
- "name": "Mr John Smith",
62
- "expiration": "Valid on Monday 23 July only",
63
- "barcodeNumber": "00016221000711490"
64
+ "label": "Type: In-store ",
65
+ "title": "Exclusive £4.99 all you can eat breakfast. As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. Redeem now! Hurry, ends 1st October.",
66
+ "expiration": "Offer ends: 1st October 2025",
67
+ "barcodeNumber": "00016221000711490",
68
+ "buttonText": "Redeem now",
69
+ "buttonLink": "#"
64
70
  },
65
71
  "online": {
66
- "label": "Online",
67
- "title": "TradePro custom title",
68
- "note": "Don't forget to use this code on checkout",
69
- "code": "WPRAJU119",
70
- "buttonText": "Shop now",
72
+ "label": "Type: Online",
73
+ "title": "Exclusive £4.99 all you can eat breakfast",
74
+ "note": "Offer ends: 1st October 2025",
75
+ "code": "WKBREAKFAST1023",
76
+ "buttonText": "Redeem now",
71
77
  "buttonLink": "#"
72
78
  },
73
79
  "description": {
74
- "short": "Short description",
75
- "long": "With the summer holidays officially starting this week, make sure you're stocked up before you head away, then have nothing to worry about when you return. To help you out we're giving our TradePro members 15% off everything in-store Monday 23rd July only."
80
+ "short": "Exclusive £4.99 all you can eat breakfast.",
81
+ "long": "As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. <b>Redeem now! Hurry, ends 1st October.</b>"
76
82
  }
77
83
  },
78
84
  "noInstoreAndOnline": {
79
- "title":"TradePro First 15% off (no instore or online)",
85
+ "title":"£4.99 unlimited breakfast. Ends October 1st (no instore or online)",
80
86
  "isOnline": false,
81
87
  "isInstore": false,
82
88
  "img": "./img/placeholders/img-placeholder-rewards.png",
83
89
  "imgAlt": "Voucher image",
84
90
  "instore": {
85
- "label": "In store",
86
- "name": "Mr John Smith",
87
- "expiration": "Valid on Monday 23 July only",
88
- "barcodeNumber": "00016221000711490"
91
+ "label": "Type: In-store ",
92
+ "title": "Exclusive £4.99 all you can eat breakfast. As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. Redeem now! Hurry, ends 1st October.",
93
+ "expiration": "Offer ends: 1st October 2025",
94
+ "barcodeNumber": "00016221000711490",
95
+ "buttonText": "Redeem now",
96
+ "buttonLink": "#"
89
97
  },
90
98
  "online": {
91
- "label": "Online",
92
- "title": "TradePro custom title",
93
- "note": "Don't forget to use this code on checkout",
94
- "code": "WPRAJU119",
95
- "buttonText": "Shop now",
99
+ "label": "Type: Online",
100
+ "title": "Exclusive £4.99 all you can eat breakfast",
101
+ "note": "Offer ends: 1st October 2025",
102
+ "code": "WKBREAKFAST1023",
103
+ "buttonText": "Redeem now",
96
104
  "buttonLink": "#"
97
105
  },
98
106
  "description": {
99
- "short": "Short description",
100
- "long": "With the summer holidays officially starting this week, make sure you're stocked up before you head away, then have nothing to worry about when you return. To help you out we're giving our TradePro members 15% off everything in-store Monday 23rd July only.",
101
- "buttonText": "Enter now",
102
- "buttonLink": "#"
107
+ "short": "Exclusive £4.99 all you can eat breakfast.",
108
+ "long": "As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. <b>Redeem now! Hurry, ends 1st October.</b>"
103
109
  }
104
110
  },
105
111
  "noOptional": {
106
- "title":"TradePro First 15% off (no optional)",
112
+ "title":"£4.99 unlimited breakfast. Ends October 1st (no optional)",
107
113
  "isOnline": true,
108
114
  "isInstore": true,
109
115
  "img": "./img/placeholders/img-placeholder-rewards.png",
110
116
  "imgAlt": "Voucher image",
111
117
  "instore": {
112
- "label": "In store",
113
- "name": "Mr John Smith",
114
- "expiration": "Valid on Monday 23 July only",
115
- "barcodeNumber": "00016221000711490"
118
+ "label": "Type: In-store ",
119
+ "title": "Exclusive £4.99 all you can eat breakfast. As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. Redeem now! Hurry, ends 1st October.",
120
+ "expiration": "Offer ends: 1st October 2025",
121
+ "barcodeNumber": "00016221000711490",
122
+ "buttonText": "Redeem now",
123
+ "buttonLink": "#"
116
124
  },
117
125
  "online": {
118
- "label": "Online",
119
- "title": "",
120
- "note": "Don't forget to use this code on checkout",
121
- "code": "WPRAJU119",
122
- "buttonText": "",
126
+ "label": "Type: Online",
127
+ "title": "Exclusive £4.99 all you can eat breakfast",
128
+ "note": "Offer ends: 1st October 2025",
129
+ "code": "WKBREAKFAST1023",
130
+ "buttonText": "Redeem now",
123
131
  "buttonLink": "#"
124
132
  },
125
133
  "description": {
126
- "short": "",
127
- "long": "With the summer holidays officially starting this week, make sure you're stocked up before you head away, then have nothing to worry about when you return. To help you out we're giving our TradePro members 15% off everything in-store Monday 23rd July only."
134
+ "short": "Exclusive £4.99 all you can eat breakfast.",
135
+ "long": "As a TradePro member, enjoy an exclusive discount Monday to Friday on all you can eat breakfast at Toby Carvery. <b>Redeem now! Hurry, ends 1st October.</b>"
128
136
  }
129
137
  },
130
138
  "terms": {
package/src/scss/pages/tradePro-rewards.scss CHANGED
@@ -39,11 +39,11 @@ $voucher-cell-height-xl: 296px;
39
39
  min-height: 240px;
40
40
 
41
41
  @include media-breakpoint-up(lg) {
42
- height: $voucher-cell-height-lg;
42
+ min-height: $voucher-cell-height-lg;
43
43
  }
44
44
 
45
45
  @include media-breakpoint-up(xl) {
46
- height: $voucher-cell-height-xl;
46
+ min-height: $voucher-cell-height-xl;
47
47
  }
48
48
  }
49
49
  }
@@ -137,6 +137,11 @@ $voucher-cell-height-xl: 296px;
137
137
  }
138
138
  }
139
139
 
140
+ &__code-title {
141
+ margin-right: 8px;
142
+ font-weight: 700;
143
+ }
144
+
140
145
  &__description {
141
146
  &-title {
142
147
  font-weight: 700;
@@ -159,7 +164,7 @@ $voucher-cell-height-xl: 296px;
159
164
  justify-content: center;
160
165
  align-items: center;
161
166
  flex: 1;
162
- padding: 16px;
167
+ padding: 24px 16px;
163
168
  }
164
169
 
165
170
  &--terms {
@@ -167,3 +172,14 @@ $voucher-cell-height-xl: 296px;
167
172
  }
168
173
  }
169
174
  }
175
+
176
+
177
+ @include media-breakpoint-up(md) {
178
+ .page_tradePro-rewards {
179
+ .voucher {
180
+ &__content {
181
+ padding: 24px;
182
+ }
183
+ }
184
+ }
185
+ }