wickes-css2 2.97.0-develop.2 → 2.97.0-develop.4

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 (37) hide show
  1. package/Readme.md +1 -0
  2. package/build/css/category-main.css +1 -1
  3. package/build/css/components/global-search.css +1 -1
  4. package/build/css/components/loader.css +1 -1
  5. package/build/css/homepage-main.css +1 -1
  6. package/build/css/main.css +1 -1
  7. package/build/css/my-account-main-v2.css +1 -1
  8. package/build/css/my-account-main.css +1 -1
  9. package/build/css/pages/page_home.css +1 -1
  10. package/build/css/pages/page_my-orders.css +1 -1
  11. package/build/css/pdp-main-before-combine.css +1 -1
  12. package/build/css/pdp-main-critical.css +1 -1
  13. package/build/css/pdp-main-non-critical.css +1 -1
  14. package/build/css/pdp-main.css +1 -1
  15. package/build/css/plp-main.css +1 -1
  16. package/build/css/store-locator-main.css +1 -1
  17. package/build/js/page/smart-banner.js +50 -0
  18. package/build/js/smart-banner.min.js +1 -0
  19. package/package.json +1 -1
  20. package/src/components/google-banner.hbs +5 -5
  21. package/src/components/offer-banner.hbs +28 -12
  22. package/src/components/price-block-order.hbs +1 -0
  23. package/src/components/smart-banner.hbs +25 -0
  24. package/src/js/page/smart-banner.js +50 -0
  25. package/src/layouts/base.hbs +13 -3
  26. package/src/page_app_diy_google_ios_banner.html +120 -0
  27. package/src/page_app_trade_pro_google_ios_banner.html +121 -0
  28. package/src/partials/scripts.hbs +7 -0
  29. package/src/scss/components/_price-block-critical.scss +3 -3
  30. package/src/scss/components/_price-block.scss +3 -8
  31. package/src/scss/components/_smart-banner.scss +85 -0
  32. package/src/scss/components/loader.scss +24 -1
  33. package/src/scss/globals/_global-components.scss +1 -0
  34. package/src/scss/helpers/_variables.scss +1 -0
  35. package/src/scss/main.scss +1 -0
  36. package/src/scss/pages/page_home.scss +1 -0
  37. package/src/sitemap.html +8 -0
@@ -0,0 +1,85 @@
1
+ .smart-banner {
2
+ display: none;
3
+ position: relative;
4
+ color: $gray-dark;
5
+ height: auto;
6
+ padding: 9px 8px;
7
+ justify-content: space-between;
8
+ align-items: center;
9
+ flex-wrap: nowrap;
10
+ column-gap: 8px;
11
+
12
+ > div {
13
+ display: flex;
14
+ align-items: center;
15
+
16
+ &:nth-of-type(3) {
17
+ column-gap: 10px;
18
+ }
19
+
20
+ }
21
+
22
+ .header-text {
23
+ font-style: normal;
24
+ font-weight: 500;
25
+ font-size: 0.75rem;
26
+ line-height: 16px;
27
+ color: $gray-dark;
28
+ margin-bottom: 0;
29
+ white-space: normal;
30
+ }
31
+
32
+ &__head {
33
+ width: auto;
34
+ padding-left: 0;
35
+ }
36
+
37
+ &__action {
38
+ width: auto;
39
+ padding: 0;
40
+
41
+ &-close.close {
42
+ position: static;
43
+ font-size: 1.1rem;
44
+ }
45
+
46
+ .btn-primary {
47
+ font-size: 0.75rem;
48
+ font-weight: 500;
49
+ letter-spacing: .5px;
50
+ line-height: 16px;
51
+ padding: 11px 6px;
52
+ }
53
+
54
+ .btn_hover {
55
+ color: $blue;
56
+ background-color: $white;
57
+ border-color: $blue;
58
+
59
+ &:hover {
60
+ background-color: $blue;
61
+ border-color: $blue;
62
+ color: $white;
63
+ }
64
+ }
65
+ }
66
+
67
+ &__logo {
68
+ width: 40px;
69
+ padding: 0;
70
+
71
+ img {
72
+ display: block;
73
+ height: auto;
74
+ max-width: 100%;
75
+ }
76
+ }
77
+ }
78
+
79
+ @include media-breakpoint-down(xs) {
80
+ .smart-banner {
81
+ &.show {
82
+ display: flex;
83
+ }
84
+ }
85
+ }
@@ -172,8 +172,31 @@
172
172
  font-weight: 500;
173
173
  text-align: center;
174
174
  }
175
- }
175
+ }
176
+
177
+ &.smart-banner-loader {
178
+ background: $white-transparent90;
179
+ flex-direction: column;
180
+ row-gap: 8px;
181
+
182
+ .loader-spinner {
183
+ .circular-loader {
184
+ width: 24px;
185
+ height: 24px;
186
+ stroke-width: 6px;
187
+ }
188
+ }
176
189
 
190
+ h2 {
191
+ color: $blue-dark;
192
+ text-align: center;
193
+ font-style: normal;
194
+ font-weight: 500;
195
+ font-size: 0.75rem;
196
+ line-height: 16px;
197
+ margin-bottom: 0;
198
+ }
199
+ }
177
200
  }
178
201
 
179
202
 
@@ -6,4 +6,5 @@
6
6
  @import '../components/popover-mini-basket';
7
7
  @import '../components/autocomplete';
8
8
  @import '../components/google_banner';
9
+ @import '../components/smart-banner';
9
10
  @import '../components/snack-bar';
@@ -90,6 +90,7 @@ $victorian-white: #fefef6;
90
90
  $white-transparent30: rgba(255, 255, 255, .3);
91
91
  $white-transparent40: rgba(255, 255, 255, .4);
92
92
  $white-transparent80: rgba(255, 255, 255, .8);
93
+ $white-transparent90: rgba(255, 255, 255, .9);
93
94
  $white-transparent20: rgba(216, 216, 216, .2);
94
95
  $gray-dark-transparent60: rgba(62, 62, 62, .6);
95
96
  $gray-dark-transparent75: rgba(65, 65, 65, .75);
@@ -78,6 +78,7 @@
78
78
  @import 'components/order-item'; //checkout
79
79
  @import 'components/potential-promotion'; //checkout
80
80
  @import 'components/google_banner';
81
+ @import 'components/smart-banner';
81
82
  @import 'components/wisdom';
82
83
  @import 'components/card-product-banner';
83
84
  @import 'components/project-list-multiple';
@@ -2,6 +2,7 @@
2
2
  @import '../components/proposition';
3
3
  @import '../components/home-offers';
4
4
  @import '../components/popular-categories';
5
+ @import '../components/loader';
5
6
 
6
7
  .home-page > .sticky-wrapper {
7
8
  display: none;
package/src/sitemap.html CHANGED
@@ -1126,6 +1126,14 @@
1126
1126
  <span class="page-id">10.4</span>
1127
1127
  <a href="page_app_google_banner.html" target="_blank">DIY APP Google banner</a>
1128
1128
  </li>
1129
+ <li>
1130
+ <span class="page-id">10.4</span>
1131
+ <a href="page_app_diy_google_ios_banner.html" target="_blank">DIY APP Google iOS banner</a>
1132
+ </li>
1133
+ <li>
1134
+ <span class="page-id">10.4</span>
1135
+ <a href="page_app_trade_pro_google_ios_banner.html" target="_blank">Trade Pro APP Google iOS banner</a>
1136
+ </li>
1129
1137
  <li>
1130
1138
  <span class="page-id">10.5</span>
1131
1139
  <a href="page_app_old_headers.html" target="_blank">DIY old header</a>