@sc-360-v2/storefront-cms-library 0.3.48 → 0.3.50

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 (63) hide show
  1. package/dist/add-products-tab copy.scss +1 -1
  2. package/dist/add-products-tab.scss +54 -24
  3. package/dist/allocationDetails.scss +36 -33
  4. package/dist/allocations.scss +7 -11
  5. package/dist/badge.scss +1 -1
  6. package/dist/builder.js +1 -1
  7. package/dist/bulk-variant-picker.scss +21 -23
  8. package/dist/button copy.scss +2 -3
  9. package/dist/button.scss +1 -1
  10. package/dist/buy-for-tab.scss +31 -34
  11. package/dist/buyForHeaders.scss +879 -55
  12. package/dist/cart-details.scss +4 -1
  13. package/dist/cart-summary.scss +161 -0
  14. package/dist/cartDropdownOverlay.scss +4 -2
  15. package/dist/checkout.scss +4 -0
  16. package/dist/confirmationModal.scss +0 -1
  17. package/dist/container.scss +1 -1
  18. package/dist/dropdownTemplate.scss +21 -5
  19. package/dist/empty-states.scss +34 -1
  20. package/dist/emtpy-templates.scss +84 -0
  21. package/dist/filters.scss +3 -5
  22. package/dist/globals.scss +16 -3
  23. package/dist/grid.scss +9 -2
  24. package/dist/icon-list.scss +3 -3
  25. package/dist/image-temp.scss +6 -4
  26. package/dist/item-stock.scss +1 -1
  27. package/dist/language-selector.scss +5 -5
  28. package/dist/layouter-pro-item.scss +1 -1
  29. package/dist/layouter-pro.scss +1 -1
  30. package/dist/menu-item.scss +1 -1
  31. package/dist/menu-v2.scss +3 -5
  32. package/dist/order-status.scss +96 -53
  33. package/dist/overflow-module.scss +1 -1
  34. package/dist/past-orders.scss +1 -1
  35. package/dist/payment-methods.scss +1 -1
  36. package/dist/position-module.scss +1 -1
  37. package/dist/prefix-list.scss +1 -1
  38. package/dist/product-actions.scss +19 -19
  39. package/dist/product-basic-elements.scss +13 -13
  40. package/dist/product-options.scss +6 -7
  41. package/dist/product-sizechart.scss +9 -15
  42. package/dist/profile.scss +1 -1
  43. package/dist/quantity-selector.scss +11 -11
  44. package/dist/quick-links.scss +1 -1
  45. package/dist/quotes.scss +1 -1
  46. package/dist/repeater.scss +3 -5
  47. package/dist/responsive-behaviour.scss +1 -1
  48. package/dist/rfqs.scss +1 -1
  49. package/dist/section.scss +1 -1
  50. package/dist/shipping-payments.scss +5 -1
  51. package/dist/stack.scss +1 -1
  52. package/dist/text-temp-v2.scss +3 -3
  53. package/dist/types/builder/enums/index.d.ts +2 -1
  54. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +1 -0
  55. package/dist/types/builder/tools/element-edit/buttonInstance.d.ts +23 -1
  56. package/dist/types/builder/tools/element-edit/buyForWithTab.d.ts +990 -210
  57. package/dist/types/builder/tools/element-edit/userElements.d.ts +120 -0
  58. package/dist/user-elements copy.scss +1437 -0
  59. package/dist/user-elements.scss +263 -175
  60. package/dist/variant-picker.scss +16 -13
  61. package/dist/video.scss +1 -1
  62. package/dist/widget.scss +1 -0
  63. package/package.json +1 -1
@@ -1,6 +1,6 @@
1
1
  @use "sass:map";
2
2
  @use "sass:list";
3
- @use "./functions.scss" as *;
3
+ @use "../functions.scss" as *;
4
4
 
5
5
  $minWidth: 70px;
6
6
 
@@ -31,8 +31,10 @@ $minWidth: 70px;
31
31
  .option__title {
32
32
  margin-bottom: 4px;
33
33
  color: var(--_ctm-mob-dn-on-te-cr, var(--_ctm-tab-dn-on-te-cr, var(--_ctm-dn-on-te-cr)));
34
- font-family:
35
- var(--_ctm-mob-dn-on-te-ft-fy, var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy))),
34
+ font-family: var(
35
+ --_ctm-mob-dn-on-te-ft-fy,
36
+ var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy))
37
+ ),
36
38
  sans-serif;
37
39
  font-size: var(
38
40
  --_ctm-mob-dn-on-te-ft-se,
@@ -116,8 +118,7 @@ $minWidth: 70px;
116
118
  --_ctm-mob-dn-sw-me-is-bn-bd-cr,
117
119
  var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr))
118
120
  );
119
- font-family:
120
- var(
121
+ font-family: var(
121
122
  --_ctm-mob-dn-sw-me-is-bn-ft-fy,
122
123
  var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy))
123
124
  ),
@@ -623,8 +624,7 @@ $minWidth: 70px;
623
624
  --_ctm-mob-dn-sw-me-is-bn-bd-cr,
624
625
  var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr))
625
626
  );
626
- font-family:
627
- var(
627
+ font-family: var(
628
628
  --_ctm-mob-dn-sw-me-is-bn-ft-fy,
629
629
  var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy))
630
630
  ),
@@ -754,8 +754,10 @@ $minWidth: 70px;
754
754
  // font is pending
755
755
 
756
756
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-cr));
757
- font-family:
758
- var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy)),
757
+ font-family: var(
758
+ --_sf-hr-ft-fy,
759
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy)
760
+ ),
759
761
  sans-serif;
760
762
  font-size: var(
761
763
  --_sf-hr-ft-se,
@@ -997,8 +999,10 @@ $minWidth: 70px;
997
999
  // font is pending
998
1000
 
999
1001
  color: var(--_sf-sd-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-cr));
1000
- font-family:
1001
- var(--_sf-sd-ft-fy, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy)),
1002
+ font-family: var(
1003
+ --_sf-sd-ft-fy,
1004
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy)
1005
+ ),
1002
1006
  sans-serif;
1003
1007
  font-size: var(
1004
1008
  --_sf-sd-ft-se,
@@ -1106,8 +1110,7 @@ $minWidth: 70px;
1106
1110
  .title {
1107
1111
  margin-bottom: 4px;
1108
1112
  color: var(--_ctm-mob-dn-on-te-cr, var(--_ctm-tab-dn-on-te-cr, var(--_ctm-dn-on-te-cr)));
1109
- font-family:
1110
- var(
1113
+ font-family: var(
1111
1114
  --_ctm-mob-dn-on-te-ft-fy,
1112
1115
  var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy))
1113
1116
  ),
@@ -2639,8 +2642,7 @@ $minWidth: 70px;
2639
2642
  var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr))
2640
2643
  );
2641
2644
 
2642
- font-family:
2643
- var(
2645
+ font-family: var(
2644
2646
  --_ctm-mob-dn-hr-tt-ft-fy,
2645
2647
  var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy))
2646
2648
  ),
@@ -2706,8 +2708,7 @@ $minWidth: 70px;
2706
2708
  )
2707
2709
  );
2708
2710
 
2709
- font-family:
2710
- var(
2711
+ font-family: var(
2711
2712
  --_sf-hr-ff,
2712
2713
  var(
2713
2714
  --_ctm-mob-dn-rw-tt-ft-fy,
@@ -2838,8 +2839,7 @@ $minWidth: 70px;
2838
2839
  )
2839
2840
  );
2840
2841
 
2841
- font-family:
2842
- var(
2842
+ font-family: var(
2843
2843
  --_sf-hr-ff,
2844
2844
  var(
2845
2845
  --_ctm-mob-dn-pn-dt-se-ft-fy,
@@ -2943,8 +2943,7 @@ $minWidth: 70px;
2943
2943
  var(--_ctm-tab-dn-ld-me-bn-cr, var(--_ctm-dn-ld-me-bn-cr))
2944
2944
  )
2945
2945
  );
2946
- font-family:
2947
- var(
2946
+ font-family: var(
2948
2947
  --_sf-hr-ff,
2949
2948
  var(
2950
2949
  --_ctm-mob-dn-ld-me-bn-ft-fy,
@@ -3060,8 +3059,7 @@ $minWidth: 70px;
3060
3059
 
3061
3060
  &::placeholder {
3062
3061
  color: var(--_ctm-mob-dn-pr-tt-cr, var(--_ctm-tab-dn-pr-tt-cr, var(--_ctm-dn-pr-tt-cr)));
3063
- font-family:
3064
- var(
3062
+ font-family: var(
3065
3063
  --_ctm-mob-dn-pr-tt-ft-fy,
3066
3064
  var(--_ctm-tab-dn-pr-tt-ft-fy, var(--_ctm-dn-pr-tt-ft-fy))
3067
3065
  ),
@@ -1,7 +1,7 @@
1
1
  @use "sass:map";
2
2
  @use "sass:list";
3
3
 
4
- @use "./functions.scss" as *;
4
+ @use "../functions.scss" as *;
5
5
 
6
6
  [data-div-type="element"] {
7
7
  &[data-element-type="button"] {
@@ -197,8 +197,7 @@
197
197
  --_sf-hr-fc,
198
198
  var(--_ctm-mob-dn-dt-se-cr, var(--_ctm-tab-dn-dt-se-cr, var(--_ctm-dn-dt-se-cr)))
199
199
  );
200
- font-family:
201
- var(
200
+ font-family: var(
202
201
  --_sf-hr-ff,
203
202
  var(
204
203
  --_ctm-mob-dn-dt-se-ft-fy,
package/dist/button.scss CHANGED
@@ -1,7 +1,7 @@
1
1
  @use "sass:map";
2
2
  @use "sass:list";
3
3
 
4
- @use "./functions.scss" as *;
4
+ @use "../functions.scss" as *;
5
5
 
6
6
  [data-div-type="element"] {
7
7
  &[data-element-type="button"] {
@@ -127,6 +127,7 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
127
127
  &.#{$tabHeader} {
128
128
  display: var(--_d-flex);
129
129
  border-bottom: 1px solid var(--_gray-200);
130
+ margin-bottom: 16px;
130
131
 
131
132
  &[data-hs-br="false"] {
132
133
  --_hide-btn-border: none;
@@ -177,8 +178,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
177
178
  var(
178
179
  --_sf-buy-hr-bg-cr,
179
180
  var(
180
- --_ctm-mob-buy-dn-ts-dt-se-bd-cr,
181
- var(--_ctm-tab-buy-dn-ts-dt-se-bd-cr, var(--_ctm-buy-dn-ts-dt-se-bd-cr))
181
+ --_ctm-mob-buy-dn-ts-bd-cr,
182
+ var(--_ctm-tab-buy-dn-ts-bd-cr, var(--_ctm-buy-dn-ts-bd-cr))
182
183
  )
183
184
  )
184
185
  );
@@ -190,8 +191,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
190
191
  var(
191
192
  --_sf-buy-hr-br-cr,
192
193
  var(
193
- --_ctm-mob-buy-dn-ts-dt-se-br-cr,
194
- var(--_ctm-tab-buy-dn-ts-dt-se-br-cr, var(--_ctm-buy-dn-ts-dt-se-br-cr))
194
+ --_ctm-mob-buy-dn-ts-br-cr,
195
+ var(--_ctm-tab-buy-dn-ts-br-cr, var(--_ctm-buy-dn-ts-br-cr))
195
196
  )
196
197
  )
197
198
  )
@@ -203,8 +204,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
203
204
  var(
204
205
  --_sf-buy-hr-br-sty,
205
206
  var(
206
- --_ctm-mob-buy-dn-ts-dt-se-br-se,
207
- var(--_ctm-tab-buy-dn-ts-dt-se-br-se, var(--_ctm-buy-dn-ts-dt-se-br-se))
207
+ --_ctm-mob-buy-dn-ts-br-se,
208
+ var(--_ctm-tab-buy-dn-ts-br-se, var(--_ctm-buy-dn-ts-br-se))
208
209
  )
209
210
  )
210
211
  )
@@ -216,8 +217,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
216
217
  var(
217
218
  --_sf-buy-hr-br-wt,
218
219
  var(
219
- --_ctm-mob-buy-dn-ts-dt-se-br-wh,
220
- var(--_ctm-tab-buy-dn-ts-dt-se-br-wh, var(--_ctm-buy-dn-ts-dt-se-br-wh))
220
+ --_ctm-mob-buy-dn-ts-br-wh,
221
+ var(--_ctm-tab-buy-dn-ts-br-wh, var(--_ctm-buy-dn-ts-br-wh))
221
222
  )
222
223
  )
223
224
  )
@@ -227,8 +228,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
227
228
  var(
228
229
  --_sf-buy-hr-br-rs,
229
230
  var(
230
- --_ctm-mob-buy-dn-ts-dt-se-br-rs,
231
- var(--_ctm-tab-buy-dn-ts-dt-se-br-rs, var(--_ctm-buy-dn-ts-dt-se-br-rs))
231
+ --_ctm-mob-buy-dn-ts-br-rs,
232
+ var(--_ctm-tab-buy-dn-ts-br-rs, var(--_ctm-buy-dn-ts-br-rs))
232
233
  )
233
234
  )
234
235
  );
@@ -277,7 +278,7 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
277
278
  )
278
279
  );
279
280
 
280
- &.active {
281
+ &[data-is-active="true"] {
281
282
  --_sf-buy-sd-bg-cr: var(
282
283
  --_ctm-mob-buy-dn-ts-sd-se-bd-cr,
283
284
  var(--_ctm-tab-buy-dn-ts-sd-se-bd-cr, var(--_ctm-buy-dn-ts-sd-se-bd-cr))
@@ -446,14 +447,13 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
446
447
  }
447
448
  // width: max-content;
448
449
 
449
- font-family:
450
- var(
450
+ font-family: var(
451
451
  --_sf-buy-sd-ft-fy,
452
452
  var(
453
453
  --_sf-buy-hr-ft-fy,
454
454
  var(
455
- --_ctm-mob-buy-dn-ts-dt-se-ft-fy,
456
- var(--_ctm-tab-buy-dn-ts-dt-se-ft-fy, var(--_ctm-buy-dn-ts-dt-se-ft-fy))
455
+ --_ctm-mob-buy-dn-ts-ft-fy,
456
+ var(--_ctm-tab-buy-dn-ts-ft-fy, var(--_ctm-buy-dn-ts-ft-fy))
457
457
  )
458
458
  )
459
459
  ),
@@ -463,8 +463,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
463
463
  var(
464
464
  --_sf-buy-hr-ft-sz,
465
465
  var(
466
- --_ctm-mob-buy-dn-ts-dt-se-ft-se,
467
- var(--_ctm-tab-buy-dn-ts-dt-se-ft-se, var(--_ctm-buy-dn-ts-dt-se-ft-se))
466
+ --_ctm-mob-buy-dn-ts-ft-se,
467
+ var(--_ctm-tab-buy-dn-ts-ft-se, var(--_ctm-buy-dn-ts-ft-se))
468
468
  )
469
469
  )
470
470
  );
@@ -473,8 +473,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
473
473
  var(
474
474
  --_sf-buy-hr-ft-cr,
475
475
  var(
476
- --_ctm-mob-buy-dn-ts-dt-se-cr,
477
- var(--_ctm-tab-buy-dn-ts-dt-se-cr, var(--_ctm-buy-dn-ts-dt-se-cr))
476
+ --_ctm-mob-buy-dn-ts-cr,
477
+ var(--_ctm-tab-buy-dn-ts-cr, var(--_ctm-buy-dn-ts-cr))
478
478
  )
479
479
  )
480
480
  );
@@ -483,8 +483,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
483
483
  var(
484
484
  --_sf-buy-hr-ft-wt,
485
485
  var(
486
- --_ctm--mob-buy-dn-ts-dt-se-ft-wt,
487
- var(--_ctm-tab-buy-dn-ts-dt-se-ft-wt, var(--_ctm-buy-dn-ts-dt-se-ft-wt))
486
+ --_ctm--mob-buy-dn-ts-ft-wt,
487
+ var(--_ctm-tab-buy-dn-ts-ft-wt, var(--_ctm-buy-dn-ts-ft-wt))
488
488
  )
489
489
  )
490
490
  );
@@ -493,11 +493,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
493
493
  var(
494
494
  --_sf-buy-hr-ft-sty,
495
495
  var(
496
- --_ctm-mob-buy-dn-ts-dt-se-ft-se-ic,
497
- var(
498
- --_ctm-tab-buy-dn-ts-dt-se-ft-se-ic,
499
- var(--_ctm-buy-dn-ts-dt-se-ft-se-ic, normal)
500
- )
496
+ --_ctm-mob-buy-dn-ts-ft-se-ic,
497
+ var(--_ctm-tab-buy-dn-ts-ft-se-ic, var(--_ctm-buy-dn-ts-ft-se-ic, normal))
501
498
  )
502
499
  )
503
500
  );
@@ -506,8 +503,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
506
503
  var(
507
504
  --_sf-buy-hr-ft-tdc,
508
505
  var(
509
- --_ctm-mob-buy-dn-ts-dt-se-ue,
510
- var(--_ctm-tab-buy-dn-ts-dt-se-ue, var(--_ctm-buy-dn-ts-dt-se-ue))
506
+ --_ctm-mob-buy-dn-ts-ue,
507
+ var(--_ctm-tab-buy-dn-ts-ue, var(--_ctm-buy-dn-ts-ue))
511
508
  )
512
509
  )
513
510
  );
@@ -516,8 +513,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
516
513
  var(
517
514
  --_sf-buy-hr-ft-tln,
518
515
  var(
519
- --_ctm-mob-buy-dn-ts-dt-se-tt-an,
520
- var(--_ctm-tab-buy-dn-ts-dt-se-tt-an, var(--_ctm-buy-dn-ts-dt-se-tt-an))
516
+ --_ctm-mob-buy-dn-ts-tt-an,
517
+ var(--_ctm-tab-buy-dn-ts-tt-an, var(--_ctm-buy-dn-ts-tt-an))
521
518
  )
522
519
  )
523
520
  );
@@ -526,8 +523,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
526
523
  var(
527
524
  --_sf-buy-hr-ft-lts,
528
525
  var(
529
- --_ctm-mob-buy-dn-ts-dt-se-lr-sg,
530
- var(--_ctm-tab-buy-dn-ts-dt-se-lr-sg, var(--_ctm-buy-dn-ts-dt-se-lr-sg))
526
+ --_ctm-mob-buy-dn-ts-lr-sg,
527
+ var(--_ctm-tab-buy-dn-ts-lr-sg, var(--_ctm-buy-dn-ts-lr-sg))
531
528
  )
532
529
  )
533
530
  );
@@ -536,8 +533,8 @@ $tabBodyWrapper: #{$tabBody}__wrapper;
536
533
  var(
537
534
  --_sf-buy-hr-ft-lht,
538
535
  var(
539
- --_ctm-mob-buy-dn-ts-dt-se-le-ht,
540
- var(--_ctm-tab-buy-dn-ts-dt-se-le-ht, var(--_ctm-buy-dn-ts-dt-se-le-ht))
536
+ --_ctm-mob-buy-dn-ts-le-ht,
537
+ var(--_ctm-tab-buy-dn-ts-le-ht, var(--_ctm-buy-dn-ts-le-ht))
541
538
  )
542
539
  )
543
540
  );