@sc-360-v2/storefront-cms-library 0.3.62 → 0.3.64

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 (52) hide show
  1. package/dist/add-products-tab copy.scss +9 -8
  2. package/dist/add-products-tab.scss +9 -8
  3. package/dist/badge.scss +87 -83
  4. package/dist/builder.js +1 -1
  5. package/dist/cart-details.scss +82 -22
  6. package/dist/cart-summary.scss +18 -144
  7. package/dist/cart-wrapper.scss +127 -0
  8. package/dist/cartDropdownOverlay.scss +58 -4
  9. package/dist/checkbox-radio.scss +105 -0
  10. package/dist/checkout.scss +96 -573
  11. package/dist/dropdownTemplate.scss +58 -4
  12. package/dist/icon-list.scss +25 -19
  13. package/dist/icons.js +1 -1
  14. package/dist/image-for-product.scss +19 -0
  15. package/dist/index.js +1 -1
  16. package/dist/item-stock.scss +27 -26
  17. package/dist/mega-menu-container.scss +96 -0
  18. package/dist/mega-menu.scss +832 -0
  19. package/dist/menu-v2.scss +30 -5
  20. package/dist/modal.scss +218 -8
  21. package/dist/myTemplates.scss +345 -20
  22. package/dist/order-status.scss +18 -15
  23. package/dist/past-orders.scss +279 -271
  24. package/dist/payment-methods.scss +72 -69
  25. package/dist/position-module.scss +2 -1
  26. package/dist/prefix-list.scss +3 -0
  27. package/dist/quick-links.scss +49 -46
  28. package/dist/quick-order-pad.scss +3 -0
  29. package/dist/quotes.scss +123 -117
  30. package/dist/rfqs.scss +123 -117
  31. package/dist/simple-list.scss +264 -0
  32. package/dist/submit-quote.scss +81 -113
  33. package/dist/templates.scss +299 -0
  34. package/dist/types/builder/elements/cart-wrapper/index.d.ts +44 -0
  35. package/dist/types/builder/elements/mega-menu/index.d.ts +47 -0
  36. package/dist/types/builder/elements/mega-menu-container/index.d.ts +44 -0
  37. package/dist/types/builder/elements/simple-list/index.d.ts +47 -0
  38. package/dist/types/builder/enums/index.d.ts +10 -1
  39. package/dist/types/builder/index.d.ts +5 -1
  40. package/dist/types/builder/tools/element-edit/cart-wrapper.d.ts +16 -0
  41. package/dist/types/builder/tools/element-edit/index.d.ts +8 -1
  42. package/dist/types/builder/tools/element-edit/mega-menu.d.ts +41 -0
  43. package/dist/types/builder/tools/element-edit/megaMenuContainer.d.ts +9 -0
  44. package/dist/types/builder/tools/element-edit/my-templates.d.ts +23 -0
  45. package/dist/types/builder/tools/element-edit/optionBar.d.ts +23 -0
  46. package/dist/types/builder/tools/element-edit/quickLinks.d.ts +111 -50
  47. package/dist/types/builder/tools/element-edit/request-for-quote.d.ts +23 -0
  48. package/dist/types/builder/tools/element-edit/simple-list.d.ts +37 -0
  49. package/dist/types/website/constants/data-connectors.d.ts +18 -0
  50. package/dist/website.js +1 -1
  51. package/dist/widget.scss +7 -0
  52. package/package.json +1 -1
@@ -201,14 +201,15 @@ $resizeActive: '[data-cms-element-resizer="true"]';
201
201
  border-radius: 4px;
202
202
  border-width: 0.5px;
203
203
 
204
- background-color: prepareMediaVariable(dn-pt-im-ss-bd-cr);
205
- border-width: prepareMediaVariable(dn-pt-im-ss-br-wh);
206
- border-color: prepareMediaVariable(dn-pt-im-ss-br-cr);
207
- border-style: prepareMediaVariable(dn-pt-im-ss-br-se);
208
- border-radius: prepareMediaVariable(dn-pt-im-ss-br-rs);
209
- box-shadow: prepareMediaVariable(dn-pt-im-ss-sw-ae)
210
- prepareMediaVariable(dn-pt-im-ss-sw-br) prepareMediaVariable(dn-pt-im-ss-sw-sd)
211
- prepareMediaVariable(dn-pt-im-ss-sw-cr);
204
+ background-color: prepareMediaVariable(--_ctm-dn-pt-im-ss-bd-cr);
205
+ border-width: prepareMediaVariable(--_ctm-dn-pt-im-ss-br-wh);
206
+ border-color: prepareMediaVariable(--_ctm-dn-pt-im-ss-br-cr);
207
+ border-style: prepareMediaVariable(--_ctm-dn-pt-im-ss-br-se);
208
+ border-radius: prepareMediaVariable(--_ctm-dn-pt-im-ss-br-rs);
209
+ box-shadow: prepareMediaVariable(--_ctm-dn-pt-im-ss-sw-ae)
210
+ prepareMediaVariable(--_ctm-dn-pt-im-ss-sw-br)
211
+ prepareMediaVariable(--_ctm-dn-pt-im-ss-sw-sd)
212
+ prepareMediaVariable(--_ctm-dn-pt-im-ss-sw-cr);
212
213
  }
213
214
 
214
215
  .product-image {
@@ -206,14 +206,15 @@ $resizeActive: '[data-cms-element-resizer="true"]';
206
206
  border-radius: 4px;
207
207
  border-width: 0.5px;
208
208
 
209
- background-color: prepareMediaVariable(dn-pt-im-ss-bd-cr);
210
- border-width: prepareMediaVariable(dn-pt-im-ss-br-wh);
211
- border-color: prepareMediaVariable(dn-pt-im-ss-br-cr);
212
- border-style: prepareMediaVariable(dn-pt-im-ss-br-se);
213
- border-radius: prepareMediaVariable(dn-pt-im-ss-br-rs);
214
- box-shadow: prepareMediaVariable(dn-pt-im-ss-sw-ae)
215
- prepareMediaVariable(dn-pt-im-ss-sw-br) prepareMediaVariable(dn-pt-im-ss-sw-sd)
216
- prepareMediaVariable(dn-pt-im-ss-sw-cr);
209
+ background-color: prepareMediaVariable(--_ctm-dn-pt-im-ss-bd-cr);
210
+ border-width: prepareMediaVariable(--_ctm-dn-pt-im-ss-br-wh);
211
+ border-color: prepareMediaVariable(--_ctm-dn-pt-im-ss-br-cr);
212
+ border-style: prepareMediaVariable(--_ctm-dn-pt-im-ss-br-se);
213
+ border-radius: prepareMediaVariable(--_ctm-dn-pt-im-ss-br-rs);
214
+ box-shadow: prepareMediaVariable(--_ctm-dn-pt-im-ss-sw-ae)
215
+ prepareMediaVariable(--_ctm-dn-pt-im-ss-sw-br)
216
+ prepareMediaVariable(--_ctm-dn-pt-im-ss-sw-sd)
217
+ prepareMediaVariable(--_ctm-dn-pt-im-ss-sw-cr);
217
218
  }
218
219
 
219
220
  .product-image {
package/dist/badge.scss CHANGED
@@ -119,15 +119,15 @@ $resizeActive: '[data-cms-element-resizer="true"]';
119
119
  display: flex;
120
120
  align-items: center;
121
121
  align-self: stretch;
122
- justify-content: var(--_sf-hr-at, prepareMediaVariable(dn-be-ct-dt-se-at));
123
- gap: prepareMediaVariable(lt-im-gp);
122
+ justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-be-ct-dt-se-at));
123
+ gap: prepareMediaVariable(--_ctm-lt-im-gp);
124
124
  // width: 100%;
125
125
  // height: 100%;
126
126
 
127
127
  .status_badge {
128
128
  display: flex;
129
129
  align-items: center;
130
- gap: prepareMediaVariable(lt-sg-bn-is);
130
+ gap: prepareMediaVariable(--_ctm-lt-sg-bn-is);
131
131
  width: 100%;
132
132
  height: 100%;
133
133
  mix-blend-mode: multiply;
@@ -144,87 +144,91 @@ $resizeActive: '[data-cms-element-resizer="true"]';
144
144
  // }
145
145
 
146
146
  &[data-producttag="New"] {
147
- background-color: prepareMediaVariable(dn-be-nw-se-bd-cr);
148
- border-width: prepareMediaVariable(dn-be-nw-se-br-wh);
149
- border-color: prepareMediaVariable(dn-be-nw-se-br-cr);
150
- border-style: prepareMediaVariable(dn-be-nw-se-br-se);
151
- border-radius: prepareMediaVariable(dn-be-nw-se-br-rs);
152
- box-shadow: prepareMediaVariable(dn-be-nw-se-sw-ae)
153
- prepareMediaVariable(dn-be-nw-se-sw-br) prepareMediaVariable(dn-be-nw-se-sw-sd)
154
- prepareMediaVariable(dn-be-nw-se-sw-cr);
147
+ background-color: prepareMediaVariable(--_ctm-dn-be-nw-se-bd-cr);
148
+ border-width: prepareMediaVariable(--_ctm-dn-be-nw-se-br-wh);
149
+ border-color: prepareMediaVariable(--_ctm-dn-be-nw-se-br-cr);
150
+ border-style: prepareMediaVariable(--_ctm-dn-be-nw-se-br-se);
151
+ border-radius: prepareMediaVariable(--_ctm-dn-be-nw-se-br-rs);
152
+ box-shadow: prepareMediaVariable(--_ctm-dn-be-nw-se-sw-ae)
153
+ prepareMediaVariable(--_ctm-dn-be-nw-se-sw-br)
154
+ prepareMediaVariable(--_ctm-dn-be-nw-se-sw-sd)
155
+ prepareMediaVariable(--_ctm-dn-be-nw-se-sw-cr);
155
156
  .icon {
156
157
  display: var(--_hover-show-icon, var(--_show-icon, flex));
157
158
  svg {
158
- width: prepareMediaVariable(dn-be-nw-se-in-se);
159
- height: prepareMediaVariable(dn-be-nw-se-in-se);
159
+ width: prepareMediaVariable(--_ctm-dn-be-nw-se-in-se);
160
+ height: prepareMediaVariable(--_ctm-dn-be-nw-se-in-se);
160
161
  path {
161
- stroke: prepareMediaVariable(dn-be-nw-se-in-c1);
162
+ stroke: prepareMediaVariable(--_ctm-dn-be-nw-se-in-c1);
162
163
  }
163
164
  }
164
165
  }
165
166
  }
166
167
  &[data-producttag="Bestseller"] {
167
168
  //background-color: #f57c00;
168
- background-color: prepareMediaVariable(dn-be-br-se-bd-cr);
169
- border-width: prepareMediaVariable(dn-be-br-se-br-wh);
170
- border-color: prepareMediaVariable(dn-be-br-se-br-cr);
171
- border-style: prepareMediaVariable(dn-be-br-se-br-se);
172
- border-radius: prepareMediaVariable(dn-be-br-se-br-rs);
173
- box-shadow: prepareMediaVariable(dn-be-br-se-sw-ae)
174
- prepareMediaVariable(dn-be-br-se-sw-br) prepareMediaVariable(dn-be-br-se-sw-sd)
175
- prepareMediaVariable(dn-be-br-se-sw-cr);
169
+ background-color: prepareMediaVariable(--_ctm-dn-be-br-se-bd-cr);
170
+ border-width: prepareMediaVariable(--_ctm-dn-be-br-se-br-wh);
171
+ border-color: prepareMediaVariable(--_ctm-dn-be-br-se-br-cr);
172
+ border-style: prepareMediaVariable(--_ctm-dn-be-br-se-br-se);
173
+ border-radius: prepareMediaVariable(--_ctm-dn-be-br-se-br-rs);
174
+ box-shadow: prepareMediaVariable(--_ctm-dn-be-br-se-sw-ae)
175
+ prepareMediaVariable(--_ctm-dn-be-br-se-sw-br)
176
+ prepareMediaVariable(--_ctm-dn-be-br-se-sw-sd)
177
+ prepareMediaVariable(--_ctm-dn-be-br-se-sw-cr);
176
178
  .icon {
177
179
  display: var(--_hover-show-icon, var(--_show-icon, flex));
178
180
  svg {
179
- width: prepareMediaVariable(dn-be-br-se-in-se);
180
- height: prepareMediaVariable(dn-be-br-se-in-se);
181
+ width: prepareMediaVariable(--_ctm-dn-be-br-se-in-se);
182
+ height: prepareMediaVariable(--_ctm-dn-be-br-se-in-se);
181
183
 
182
184
  path {
183
- stroke: prepareMediaVariable(dn-be-br-se-in-c1);
185
+ stroke: prepareMediaVariable(--_ctm-dn-be-br-se-in-c1);
184
186
  }
185
187
  }
186
188
  }
187
189
  }
188
190
  &[data-producttag="Limited"] {
189
191
  //background-color: #6a1b9a;
190
- background-color: prepareMediaVariable(dn-be-ld-se-bd-cr);
191
- border-width: prepareMediaVariable(dn-be-ld-se-br-wh);
192
- border-color: prepareMediaVariable(dn-be-ld-se-br-cr);
193
- border-style: prepareMediaVariable(dn-be-ld-se-br-se);
194
- border-radius: prepareMediaVariable(dn-be-ld-se-br-rs);
195
- box-shadow: prepareMediaVariable(dn-be-ld-se-sw-ae)
196
- prepareMediaVariable(dn-be-ld-se-sw-br) prepareMediaVariable(dn-be-ld-se-sw-sd)
197
- prepareMediaVariable(dn-be-ld-se-sw-cr);
192
+ background-color: prepareMediaVariable(--_ctm-dn-be-ld-se-bd-cr);
193
+ border-width: prepareMediaVariable(--_ctm-dn-be-ld-se-br-wh);
194
+ border-color: prepareMediaVariable(--_ctm-dn-be-ld-se-br-cr);
195
+ border-style: prepareMediaVariable(--_ctm-dn-be-ld-se-br-se);
196
+ border-radius: prepareMediaVariable(--_ctm-dn-be-ld-se-br-rs);
197
+ box-shadow: prepareMediaVariable(--_ctm-dn-be-ld-se-sw-ae)
198
+ prepareMediaVariable(--_ctm-dn-be-ld-se-sw-br)
199
+ prepareMediaVariable(--_ctm-dn-be-ld-se-sw-sd)
200
+ prepareMediaVariable(--_ctm-dn-be-ld-se-sw-cr);
198
201
  .icon {
199
202
  display: var(--_hover-show-icon, var(--_show-icon, flex));
200
203
  svg {
201
- width: prepareMediaVariable(dn-be-ld-se-in-se);
202
- height: prepareMediaVariable(dn-be-ld-se-in-se);
204
+ width: prepareMediaVariable(--_ctm-dn-be-ld-se-in-se);
205
+ height: prepareMediaVariable(--_ctm-dn-be-ld-se-in-se);
203
206
 
204
207
  path {
205
- stroke: prepareMediaVariable(dn-be-ld-se-in-c1);
208
+ stroke: prepareMediaVariable(--_ctm-dn-be-ld-se-in-c1);
206
209
  }
207
210
  }
208
211
  }
209
212
  }
210
213
  &[data-producttag="Exclusive"] {
211
214
  //background-color: #1976d2;
212
- background-color: prepareMediaVariable(dn-be-ee-se-bd-cr);
213
- border-width: prepareMediaVariable(dn-be-ee-se-br-wh);
214
- border-color: prepareMediaVariable(dn-be-ee-se-br-cr);
215
- border-style: prepareMediaVariable(dn-be-ee-se-br-se);
216
- border-radius: prepareMediaVariable(dn-be-ee-se-br-rs);
217
- box-shadow: prepareMediaVariable(dn-be-ee-se-sw-ae)
218
- prepareMediaVariable(dn-be-ee-se-sw-br) prepareMediaVariable(dn-be-ee-se-sw-sd)
219
- prepareMediaVariable(dn-be-ee-se-sw-cr);
215
+ background-color: prepareMediaVariable(--_ctm-dn-be-ee-se-bd-cr);
216
+ border-width: prepareMediaVariable(--_ctm-dn-be-ee-se-br-wh);
217
+ border-color: prepareMediaVariable(--_ctm-dn-be-ee-se-br-cr);
218
+ border-style: prepareMediaVariable(--_ctm-dn-be-ee-se-br-se);
219
+ border-radius: prepareMediaVariable(--_ctm-dn-be-ee-se-br-rs);
220
+ box-shadow: prepareMediaVariable(--_ctm-dn-be-ee-se-sw-ae)
221
+ prepareMediaVariable(--_ctm-dn-be-ee-se-sw-br)
222
+ prepareMediaVariable(--_ctm-dn-be-ee-se-sw-sd)
223
+ prepareMediaVariable(--_ctm-dn-be-ee-se-sw-cr);
220
224
  .icon {
221
225
  display: var(--_hover-show-icon, var(--_show-icon, flex));
222
226
  svg {
223
- width: prepareMediaVariable(dn-be-ee-se-in-se);
224
- height: prepareMediaVariable(dn-be-ee-se-in-se);
227
+ width: prepareMediaVariable(--_ctm-dn-be-ee-se-in-se);
228
+ height: prepareMediaVariable(--_ctm-dn-be-ee-se-in-se);
225
229
 
226
230
  path {
227
- stroke: prepareMediaVariable(dn-be-ee-se-in-c1);
231
+ stroke: prepareMediaVariable(--_ctm-dn-be-ee-se-in-c1);
228
232
  }
229
233
  }
230
234
  }
@@ -232,48 +236,48 @@ $resizeActive: '[data-cms-element-resizer="true"]';
232
236
 
233
237
  .product_tag {
234
238
  &[data-producttag="New"] {
235
- font-family: prepareMediaVariable(dn-be-nw-se-ft-fy);
236
- font-size: prepareMediaVariable(dn-be-nw-se-ft-se);
237
- color: prepareMediaVariable(dn-be-nw-se-cr);
238
- font-weight: prepareMediaVariable(dn-be-nw-se-ft-wt);
239
- font-style: prepareMediaVariable(dn-be-nw-se-ft-se-ic);
240
- text-decoration: prepareMediaVariable(dn-be-nw-se-ue);
241
- text-align: prepareMediaVariable(dn-be-nw-se-tt-an);
242
- letter-spacing: prepareMediaVariable(dn-be-nw-se-lr-sg);
243
- line-height: prepareMediaVariable(dn-be-nw-se-le-ht);
239
+ font-family: prepareMediaVariable(--_ctm-dn-be-nw-se-ft-fy);
240
+ font-size: prepareMediaVariable(--_ctm-dn-be-nw-se-ft-se);
241
+ color: prepareMediaVariable(--_ctm-dn-be-nw-se-cr);
242
+ font-weight: prepareMediaVariable(--_ctm-dn-be-nw-se-ft-wt);
243
+ font-style: prepareMediaVariable(--_ctm-dn-be-nw-se-ft-se-ic);
244
+ text-decoration: prepareMediaVariable(--_ctm-dn-be-nw-se-ue);
245
+ text-align: prepareMediaVariable(--_ctm-dn-be-nw-se-tt-an);
246
+ letter-spacing: prepareMediaVariable(--_ctm-dn-be-nw-se-lr-sg);
247
+ line-height: prepareMediaVariable(--_ctm-dn-be-nw-se-le-ht);
244
248
  }
245
249
  &[data-producttag="Bestseller"] {
246
- font-family: prepareMediaVariable(dn-be-br-se-ft-fy);
247
- font-size: prepareMediaVariable(dn-be-br-se-ft-se);
248
- color: prepareMediaVariable(dn-be-br-se-cr);
249
- font-weight: prepareMediaVariable(dn-be-br-se-ft-wt);
250
- font-style: prepareMediaVariable(dn-be-br-se-ft-se-ic);
251
- text-decoration: prepareMediaVariable(dn-be-br-se-ue);
252
- text-align: prepareMediaVariable(dn-be-br-se-tt-an);
253
- letter-spacing: prepareMediaVariable(dn-be-br-se-lr-sg);
254
- line-height: prepareMediaVariable(dn-be-br-se-le-ht);
250
+ font-family: prepareMediaVariable(--_ctm-dn-be-br-se-ft-fy);
251
+ font-size: prepareMediaVariable(--_ctm-dn-be-br-se-ft-se);
252
+ color: prepareMediaVariable(--_ctm-dn-be-br-se-cr);
253
+ font-weight: prepareMediaVariable(--_ctm-dn-be-br-se-ft-wt);
254
+ font-style: prepareMediaVariable(--_ctm-dn-be-br-se-ft-se-ic);
255
+ text-decoration: prepareMediaVariable(--_ctm-dn-be-br-se-ue);
256
+ text-align: prepareMediaVariable(--_ctm-dn-be-br-se-tt-an);
257
+ letter-spacing: prepareMediaVariable(--_ctm-dn-be-br-se-lr-sg);
258
+ line-height: prepareMediaVariable(--_ctm-dn-be-br-se-le-ht);
255
259
  }
256
260
  &[data-producttag="Limited"] {
257
- font-family: prepareMediaVariable(dn-be-ld-se-ft-fy);
258
- font-size: prepareMediaVariable(dn-be-ld-se-ft-se);
259
- color: prepareMediaVariable(dn-be-ld-se-cr);
260
- font-weight: prepareMediaVariable(dn-be-ld-se-ft-wt);
261
- font-style: prepareMediaVariable(dn-be-ld-se-ft-se-ic);
262
- text-decoration: prepareMediaVariable(dn-be-ld-se-ue);
263
- text-align: prepareMediaVariable(dn-be-ld-se-tt-an);
264
- letter-spacing: prepareMediaVariable(dn-be-ld-se-lr-sg);
265
- line-height: prepareMediaVariable(dn-be-ld-se-le-ht);
261
+ font-family: prepareMediaVariable(--_ctm-dn-be-ld-se-ft-fy);
262
+ font-size: prepareMediaVariable(--_ctm-dn-be-ld-se-ft-se);
263
+ color: prepareMediaVariable(--_ctm-dn-be-ld-se-cr);
264
+ font-weight: prepareMediaVariable(--_ctm-dn-be-ld-se-ft-wt);
265
+ font-style: prepareMediaVariable(--_ctm-dn-be-ld-se-ft-se-ic);
266
+ text-decoration: prepareMediaVariable(--_ctm-dn-be-ld-se-ue);
267
+ text-align: prepareMediaVariable(--_ctm-dn-be-ld-se-tt-an);
268
+ letter-spacing: prepareMediaVariable(--_ctm-dn-be-ld-se-lr-sg);
269
+ line-height: prepareMediaVariable(--_ctm-dn-be-ld-se-le-ht);
266
270
  }
267
271
  &[data-producttag="Exclusive"] {
268
- font-family: prepareMediaVariable(dn-be-ee-se-ft-fy);
269
- font-size: prepareMediaVariable(dn-be-ee-se-ft-se);
270
- color: prepareMediaVariable(dn-be-ee-se-cr);
271
- font-weight: prepareMediaVariable(dn-be-ee-se-ft-wt);
272
- font-style: prepareMediaVariable(dn-be-ee-se-ft-se-ic);
273
- text-decoration: prepareMediaVariable(dn-be-ee-se-ue);
274
- text-align: prepareMediaVariable(dn-be-ee-se-tt-an);
275
- letter-spacing: prepareMediaVariable(dn-be-ee-se-lr-sg);
276
- line-height: prepareMediaVariable(dn-be-ee-se-le-ht);
272
+ font-family: prepareMediaVariable(--_ctm-dn-be-ee-se-ft-fy);
273
+ font-size: prepareMediaVariable(--_ctm-dn-be-ee-se-ft-se);
274
+ color: prepareMediaVariable(--_ctm-dn-be-ee-se-cr);
275
+ font-weight: prepareMediaVariable(--_ctm-dn-be-ee-se-ft-wt);
276
+ font-style: prepareMediaVariable(--_ctm-dn-be-ee-se-ft-se-ic);
277
+ text-decoration: prepareMediaVariable(--_ctm-dn-be-ee-se-ue);
278
+ text-align: prepareMediaVariable(--_ctm-dn-be-ee-se-tt-an);
279
+ letter-spacing: prepareMediaVariable(--_ctm-dn-be-ee-se-lr-sg);
280
+ line-height: prepareMediaVariable(--_ctm-dn-be-ee-se-le-ht);
277
281
  }
278
282
  }
279
283
  }