wickes-css2 2.94.0-develop.1 → 2.94.0-develop.10

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 (112) hide show
  1. package/Readme.md +3 -3
  2. package/build/css/category-main.css +1 -1
  3. package/build/css/components/checkout-payment-details-v2.css +1 -1
  4. package/build/css/homepage-main.css +1 -1
  5. package/build/css/main.css +1 -1
  6. package/build/css/my-account-main-v2.css +1 -1
  7. package/build/css/my-account-main.css +1 -1
  8. package/build/css/pages/my-account-v2.css +1 -1
  9. package/build/css/pages/my-account.css +1 -1
  10. package/build/css/pages/page_default-store.css +1 -0
  11. package/build/css/pages/page_my-orders.css +1 -0
  12. package/build/css/pages/page_personal-details.css +1 -1
  13. package/build/css/pages/page_product-details-v2-critical.css +1 -1
  14. package/build/css/pages/page_product-details-v2.css +1 -1
  15. package/build/css/pages/page_products-list-combined.css +1 -1
  16. package/build/css/pages/page_products-list.css +1 -1
  17. package/build/css/pages/page_shopping-cart-v2.css +1 -1
  18. package/build/css/pdp-main-before-combine.css +1 -1
  19. package/build/css/pdp-main-critical.css +1 -1
  20. package/build/css/pdp-main-non-critical.css +1 -1
  21. package/build/css/pdp-main.css +1 -1
  22. package/build/css/plp-main.css +1 -1
  23. package/build/css/store-locator-main.css +1 -1
  24. package/build/js/account-members.min.js +1 -1
  25. package/build/js/basket.min.js +2 -2
  26. package/build/js/bundle.min.js +1 -1
  27. package/build/js/checkout.min.js +1 -1
  28. package/build/js/default-store.min.js +1 -0
  29. package/build/js/emulation.min.js +151 -3
  30. package/build/js/general.bundle.min.js +1 -1
  31. package/build/js/merged-checkout.min.js +1 -1
  32. package/build/js/my-orders.min.js +1 -0
  33. package/build/js/page/basket-v2.js +7 -6
  34. package/build/js/page/default-store.js +44 -0
  35. package/build/js/page/my-orders.js +165 -0
  36. package/build/js/page/personal-details.js +105 -36
  37. package/build/js/page/plp-load-more.js +1 -0
  38. package/build/js/pdp.bundle.min.js +1 -1
  39. package/build/js/personal-details.min.js +1 -1
  40. package/build/js/plp.bundle.min.js +1 -1
  41. package/build/js/project-list.min.js +1 -1
  42. package/package.json +1 -1
  43. package/src/components/account-families/actions-bar.hbs +3 -3
  44. package/src/components/default-store/current-store.hbs +60 -0
  45. package/src/components/default-store/list-of-store.hbs +39 -0
  46. package/src/components/default-store/store-form.hbs +29 -0
  47. package/src/components/default-store/store-unavailable.hbs +4 -0
  48. package/src/components/flatpickr-calendar.hbs +26 -0
  49. package/src/components/my-account/active-orders/header.hbs +6 -2
  50. package/src/components/my-account/active-orders/list-orders.hbs +14 -2
  51. package/src/components/my-account/active-orders/order-header.hbs +1 -1
  52. package/src/components/my-account/active-orders/order.hbs +10 -6
  53. package/src/components/my-account/clipboard-code-card.hbs +1 -1
  54. package/src/components/my-account/empty-orders.hbs +9 -0
  55. package/src/components/my-account/mobile-nav.hbs +23 -19
  56. package/src/components/my-account/orders-nav.hbs +15 -0
  57. package/src/components/my-account/personal-details-form.hbs +5 -0
  58. package/src/components/my-account/sort-by.hbs +3 -0
  59. package/src/components/my-account/user-account-actions.hbs +1 -1
  60. package/src/components/signup-form.hbs +1 -2
  61. package/src/components/store-details.hbs +22 -20
  62. package/src/components/store-preview.hbs +0 -11
  63. package/src/components/user-information-field.hbs +1 -1
  64. package/src/data/data_big-wins-stores.json +0 -22
  65. package/src/data/my-account/data_my-orders.json +246 -0
  66. package/src/data/my-account/data_personal-details.json +36 -11
  67. package/src/data/my-account/page_default-store.json +158 -0
  68. package/src/elements/dropdown.hbs +1 -1
  69. package/src/elements/input.hbs +2 -2
  70. package/src/js/components/flatpickr.js +167 -0
  71. package/src/js/components/general/handleAccordion.js +35 -0
  72. package/src/js/components/general/switchVat.js +28 -2
  73. package/src/js/components/leave-event.js +41 -2
  74. package/src/js/emulation/big-wins.js +0 -2
  75. package/src/js/emulation/default-store.js +97 -0
  76. package/src/js/emulation/forms.js +1 -1
  77. package/src/js/emulation/mock.js +10 -0
  78. package/src/js/emulation/my-orders-local.js +41 -0
  79. package/src/js/page/basket-v2.js +7 -6
  80. package/src/js/page/default-store.js +44 -0
  81. package/src/js/page/my-orders.js +165 -0
  82. package/src/js/page/personal-details.js +105 -36
  83. package/src/js/page/plp-load-more.js +1 -0
  84. package/src/page_checkout_payment-details_with-card-loader.html +56 -0
  85. package/src/page_default-store-page-empty.html +48 -0
  86. package/src/page_default-store-page.html +55 -0
  87. package/src/page_my-orders-empty.html +49 -0
  88. package/src/page_my-orders.html +64 -0
  89. package/src/page_personal-details-installer.html +17 -7
  90. package/src/page_personal-details.html +15 -7
  91. package/src/page_wismo-order-history-loadmore.html +3 -3
  92. package/src/scss/barclays-paypage-combined-minified.css +1 -1
  93. package/src/scss/barclays-paypage-combined.css +9 -15
  94. package/src/scss/components/_big-wins-critical.scss +0 -1
  95. package/src/scss/components/_big-wins.scss +1 -8
  96. package/src/scss/components/_order-item-cc.scss +0 -6
  97. package/src/scss/components/checkout-payment-details-v2.scss +2 -2
  98. package/src/scss/components/my-account/_active-orders.scss +263 -0
  99. package/src/scss/components/my-account/_orders-nav.scss +61 -0
  100. package/src/scss/components/my-account/_shipment.scss +1 -0
  101. package/src/scss/helpers/_variables.scss +1 -0
  102. package/src/scss/libs/flatpickr.scss +235 -0
  103. package/src/scss/pages/_my-account_new.scss +1 -12
  104. package/src/scss/pages/my-account-v2.scss +1 -136
  105. package/src/scss/pages/page_default-store.scss +634 -0
  106. package/src/scss/pages/page_my-orders.scss +232 -0
  107. package/src/scss/pages/page_personal-details.scss +37 -5
  108. package/src/scss/pages/page_products-list-combined.scss +0 -1
  109. package/src/scss/pages/page_products-list.scss +0 -1
  110. package/src/scss/partials/_header.scss +5 -0
  111. package/src/sitemap.html +7 -1
  112. package/src/scss/components/my-account/_order.scss +0 -112
@@ -0,0 +1,235 @@
1
+ @import '../helpers/helpers';
2
+
3
+ .flatpickr-datepicker {
4
+ margin-top: 16px;
5
+
6
+ &__label {
7
+ font-size: 1rem;
8
+ font-weight: 500;
9
+ line-height: 1.5rem;
10
+ margin-bottom: 8px;
11
+ display: flex;
12
+ align-items: center;
13
+
14
+ .icon-info {
15
+ cursor: pointer;
16
+ margin-left: 8px;
17
+ }
18
+
19
+ .tooltip {
20
+ filter: drop-shadow(0 0 8px rgba(0, 0, 0, .12));
21
+ position: absolute;
22
+
23
+ .tooltip-inner {
24
+ background: $white;
25
+ color: $gray-dark;
26
+ padding: 8px 16px !important;
27
+ border-radius: 4px;
28
+ font-weight: 400;
29
+ font-size: .75rem;
30
+ line-height: 1rem;
31
+ }
32
+
33
+ .arrow:before {
34
+ border-top-color: $white;
35
+ }
36
+ }
37
+ }
38
+
39
+ &__field {
40
+ border-radius: 3px;
41
+ border: 1px solid $gray;
42
+ padding: 7px 8px 7px 16px;
43
+ display: flex;
44
+ align-items: center;
45
+ max-width: 100%;
46
+ position: relative;
47
+ transition: all .3s;
48
+
49
+ &.active,
50
+ &:hover {
51
+ border-color: $blue;
52
+ }
53
+ }
54
+
55
+ .icon-wrap {
56
+ cursor: pointer;
57
+ width: 24px;
58
+ height: 24px;
59
+ display: inline-flex;
60
+ align-items: center;
61
+ justify-content: center;
62
+
63
+ &--cross {
64
+ cursor: pointer;
65
+ display: none;
66
+ }
67
+
68
+ & + .icon-wrap {
69
+ margin-left: 8px;
70
+ }
71
+ }
72
+
73
+ .icon-calendar {
74
+ font-size: 1rem;
75
+ color: $blue;
76
+ }
77
+
78
+ .flatpickr {
79
+ &-input {
80
+ padding: 0;
81
+ border: none;
82
+ font-size: 1rem;
83
+ font-weight: 400;
84
+ line-height: 1.5rem;
85
+ outline: none;
86
+ width: 100%;
87
+ }
88
+
89
+ &-calendar {
90
+ &:before,
91
+ &:after {
92
+ content: none;
93
+ }
94
+
95
+ &.static {
96
+ left: 0;
97
+ width: 100%;
98
+
99
+ &.open {
100
+ margin-top: 4px;
101
+ padding: 16px;
102
+ border-radius: 3px;
103
+ box-shadow: 0 0 15px 0 rgba(0, 0, 0, .20);
104
+ }
105
+ }
106
+ }
107
+
108
+ &-monthSelect-months {
109
+ display: grid;
110
+ grid-template-columns: 1fr 1fr 1fr;
111
+ margin: 12px 0 0;
112
+ grid-gap: 8px;
113
+ justify-items: center;
114
+ align-items: center;
115
+ }
116
+
117
+ &-monthSelect-month {
118
+ margin: 0;
119
+ width: 100%;
120
+ font-size: .875rem;
121
+ font-style: normal;
122
+ font-weight: 400;
123
+ line-height: 1.375rem;
124
+ padding: 4px;
125
+ border-radius: 999px;
126
+ max-width: 78px;
127
+ color: $gray-dark;
128
+
129
+ &.selected {
130
+ background: $blue;
131
+ border-color: $blue;
132
+ color: $white;
133
+
134
+ &:hover {
135
+ border-color: $blue;
136
+ background: $blue;
137
+ color: $gray-dark;
138
+ }
139
+ }
140
+
141
+ &:not(.flatpickr-disabled):hover {
142
+ border-color: $blue;
143
+ background: transparent;
144
+ }
145
+
146
+ &.flatpickr-disabled {
147
+ color: $gray-wait;
148
+ pointer-events: none;
149
+
150
+ &:hover {
151
+ border: none;
152
+ }
153
+ }
154
+
155
+ &.today {
156
+ border-color: transparent;
157
+
158
+ &:hover {
159
+ border-color: $blue;
160
+ background: transparent;
161
+ color: initial;
162
+ }
163
+ }
164
+ }
165
+
166
+ &-current-month {
167
+ padding-top: 0;
168
+ height: auto;
169
+
170
+ input.cur-year {
171
+ padding-left: 0;
172
+ font-size: 0.875rem;
173
+ font-weight: 500;
174
+ line-height: 1.375rem;
175
+ text-align: center;
176
+ }
177
+ }
178
+
179
+ &-prev-month.flatpickr-disabled,
180
+ &-next-month.flatpickr-disabled {
181
+ display: block;
182
+ opacity: .6;
183
+ pointer-events: none;
184
+ }
185
+
186
+ &-months {
187
+ .flatpickr-prev-month,
188
+ .flatpickr-next-month {
189
+ position: relative;
190
+ display: flex;
191
+ align-items: center;
192
+ height: auto;
193
+ padding: 0;
194
+
195
+ svg path {
196
+ fill: $blue;
197
+ }
198
+ }
199
+
200
+ .flatpickr-month {
201
+ height: 100%;
202
+
203
+ .flatpickr-current-month {
204
+ width: 100%;
205
+ left: auto;
206
+ position: relative;
207
+ }
208
+ }
209
+ }
210
+
211
+ &-current-month {
212
+ .numInputWrapper {
213
+ &:hover {
214
+ background: transparent;
215
+ }
216
+
217
+ .arrowUp,
218
+ .arrowDown {
219
+ content: none;
220
+ display: none;
221
+ }
222
+ }
223
+ }
224
+
225
+ &-wrapper {
226
+ flex: 1;
227
+ position: initial;
228
+ width: 100%;
229
+ }
230
+
231
+ &-rContainer {
232
+ width: 100%;
233
+ }
234
+ }
235
+ }
@@ -638,10 +638,6 @@
638
638
  align-items: center;
639
639
  padding: 17px 0 15px 10px;
640
640
 
641
- &__act {
642
- display: none;
643
- }
644
-
645
641
  &__info {
646
642
  align-self: flex-start;
647
643
  }
@@ -759,7 +755,6 @@
759
755
  margin-bottom: 15px;
760
756
 
761
757
  .store {
762
- &__act,
763
758
  &__count {
764
759
  display: none;
765
760
  }
@@ -860,12 +855,6 @@
860
855
 
861
856
  .stock__store {
862
857
  padding-bottom: 40px;
863
-
864
- .store__act {
865
- padding-top: 7px;
866
- position: absolute;
867
- color: $blue;
868
- }
869
858
  }
870
859
 
871
860
  .stock__tabs {
@@ -1117,7 +1106,7 @@
1117
1106
  }
1118
1107
 
1119
1108
  &_cell {
1120
- border: 2px solid $gray-light;
1109
+ border: 1px solid $gray-light;
1121
1110
 
1122
1111
  &:nth-child(2n+1) {
1123
1112
  padding-left: 20px;
@@ -1,10 +1,10 @@
1
1
  @import '../helpers/helpers';
2
2
  @import '../components/my-account/consignment-info';
3
3
  @import '../components/my-account/shipment';
4
- @import '../components/my-account/order';
5
4
  @import '../components/my-account/menu';
6
5
  @import '../components/my-account/contacts';
7
6
  @import '../components/my-account/mobile-nav';
7
+ @import '../components/my-account/active-orders';
8
8
 
9
9
  .my-account {
10
10
  margin: 0;
@@ -265,81 +265,6 @@
265
265
  margin-bottom: 0;
266
266
  }
267
267
  }
268
-
269
- .active-orders {
270
- margin-top: 24px;
271
-
272
- &__title {
273
- font-weight: 500;
274
- font-size: 1.25rem;
275
- line-height: 1rem;
276
- color: $blue-dark;
277
- margin-bottom: 0;
278
- }
279
-
280
- &__item {
281
- margin-top: 16px;
282
- padding: 16px;
283
- background: $white;
284
- border-radius: 4px;
285
-
286
- & + & {
287
- margin-top: 16px;
288
- }
289
- }
290
-
291
- .view-more {
292
- display: flex;
293
- align-items: center;
294
- justify-content: center;
295
- padding-top: 12px;
296
- border-top: 1px solid $gray;
297
-
298
- .link {
299
- font-weight: 500;
300
- font-size: .875rem;
301
- line-height: 1.375rem;
302
- text-align: center;
303
- color: $blue;
304
- text-decoration: none;
305
- display: flex;
306
- justify-content: center;
307
- align-items: center;
308
-
309
- span:hover {
310
- text-decoration: underline;
311
- }
312
-
313
- .icon {
314
- margin-left: 8px;
315
- font-size: 1rem;
316
- }
317
- }
318
- }
319
-
320
- .btn--all-orders {
321
- margin-top: 16px;
322
- }
323
-
324
- .tooltip {
325
- filter: drop-shadow(0 0 8px rgba(0, 0, 0, .12));
326
- position: absolute;
327
-
328
- .tooltip-inner {
329
- background: $white;
330
- color: $gray-dark;
331
- padding: 8px 16px !important;
332
- border-radius: 4px;
333
- font-weight: 400;
334
- font-size: .75rem;
335
- line-height: 1rem;
336
- }
337
-
338
- .arrow:before {
339
- border-top-color: $white;
340
- }
341
- }
342
- }
343
268
  }
344
269
 
345
270
  @include media-breakpoint-up(sm) {
@@ -395,50 +320,6 @@
395
320
  }
396
321
  }
397
322
 
398
- .active-orders {
399
- &__header {
400
- display: flex;
401
- justify-content: space-between;
402
- align-items: center;
403
-
404
- .btn--all-orders {
405
- margin-top: 0;
406
- max-width: 125px;
407
- }
408
- }
409
-
410
- &__item {
411
- display: grid;
412
- grid-template-areas:
413
- 'header viewMore'
414
- 'orderDetails orderDetails'
415
- 'consignmentInfo consignmentInfo'
416
- 'shipment shipment';
417
-
418
- .order-header {
419
- flex-direction: row-reverse;
420
- justify-content: flex-end;
421
- grid-area: header;
422
-
423
- &__title {
424
- margin-left: 16px;
425
- font-weight: 700;
426
- }
427
- }
428
-
429
- .view-more {
430
- grid-area: viewMore;
431
- justify-content: flex-end;
432
- border-top: 0;
433
- padding: 0;
434
-
435
- .link .icon {
436
- margin-left: 13px;
437
- }
438
- }
439
- }
440
- }
441
-
442
323
  .notification_info-message {
443
324
  font-size: .875rem;
444
325
  }
@@ -456,10 +337,6 @@
456
337
  padding: 24px;
457
338
  }
458
339
 
459
- .active-orders__title {
460
- font-size: 1.5rem;
461
- }
462
-
463
340
  .notification_general:not(.notification_info-message) {
464
341
  margin-top: 16px;
465
342
  margin-bottom: 16px;
@@ -530,18 +407,6 @@
530
407
  .clipboard-code.discount-code {
531
408
  padding-right: 14px;
532
409
  }
533
-
534
- .active-orders {
535
- &__item {
536
- padding: 24px;
537
- grid-template-areas:
538
- 'header consignmentInfo viewMore'
539
- 'orderDetails orderDetails orderDetails'
540
- 'shipment shipment shipment';
541
- grid-template-columns: auto auto 1fr;
542
- align-items: center;
543
- }
544
- }
545
410
  }
546
411
  }
547
412