@sc-360-v2/storefront-cms-library 0.4.28 → 0.4.30

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 (30) hide show
  1. package/dist/add-products-tab.scss +163 -36
  2. package/dist/builder.js +1 -1
  3. package/dist/bulk-order-pad.scss +6 -0
  4. package/dist/bundle copy.scss +2805 -0
  5. package/dist/bundle.scss +1632 -1614
  6. package/dist/buyForHeaders.scss +35 -15
  7. package/dist/buyForPopup.scss +19 -5
  8. package/dist/default-dropdown.scss +226 -0
  9. package/dist/filters.scss +78 -20
  10. package/dist/language-selector.scss +25 -1
  11. package/dist/modal.scss +8 -0
  12. package/dist/multi-select-dropdown.scss +23 -13
  13. package/dist/order-status.scss +1 -1
  14. package/dist/product-image.scss +61 -3
  15. package/dist/quick-order-pad.scss +49 -46
  16. package/dist/repeater.scss +9 -4
  17. package/dist/review-cart.scss +5 -3
  18. package/dist/shipping-payments.scss +475 -187
  19. package/dist/types/builder/enums/data-connectors.d.ts +0 -1
  20. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +28 -12
  21. package/dist/types/builder/tools/element-edit/bundle.d.ts +837 -4
  22. package/dist/types/builder/tools/element-edit/bundleDetails.d.ts +868 -84
  23. package/dist/types/builder/tools/element-edit/filters.d.ts +8 -1
  24. package/dist/types/builder/tools/element-edit/imageInstance.d.ts +33 -0
  25. package/dist/types/builder/tools/element-edit/product-image.d.ts +1 -0
  26. package/dist/types/builder/tools/element-edit/variantPicker.d.ts +1 -6
  27. package/dist/types/website/constants/data-connectors.d.ts +0 -4
  28. package/dist/website.js +1 -1
  29. package/dist/widget.scss +1 -0
  30. package/package.json +1 -1
package/dist/add-products-tab.scss CHANGED
@@ -80,7 +80,7 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
80
80
  display: flex;
81
81
  justify-content: space-between;
82
82
  align-items: center;
83
- border-bottom: 1px solid #e0e0e0;
83
+ border-bottom: 1px solid var(--_thm-cs-be-se-3);
84
84
  padding-bottom: 16px;
85
85
  .section-title {
86
86
  font-size: var(
@@ -113,15 +113,15 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
113
113
  .search-input {
114
114
  display: flex;
115
115
  align-items: center;
116
- border: 1px solid #d1d5db;
116
+ border: 1px solid var(--_thm-cs-be-se-3);
117
117
  border-radius: 4px;
118
- padding: 0.25rem 0.5rem;
119
- background: #fff;
120
- height: 40px;
118
+ padding: 8px 12px;
119
+ background: transparent;
120
+ // height: 40px;
121
121
 
122
122
  .icon {
123
- margin-right: 0.5rem;
124
- color: #6b7280;
123
+ margin-right: 8px;
124
+ color: var(--_thm-cs-be-se-3);
125
125
  }
126
126
 
127
127
  input {
@@ -236,6 +236,7 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
236
236
  gap: 16px;
237
237
  max-height: 750px;
238
238
  overflow-y: auto;
239
+ overflow-x: hidden;
239
240
 
240
241
  @media (max-width: 500px) {
241
242
  grid-template-columns: 1fr;
@@ -279,13 +280,22 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
279
280
  // border: 0.5px solid #243dc6;
280
281
  // border-radius: 4px;
281
282
  // border-width: 0.5px;
282
- padding: prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-pg);
283
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-pg));
283
284
 
284
285
  // background-color: prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-bd-cr);
285
286
  @include BgColorLighter(var(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-bd-cr), 5%);
286
- border-width: prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-br-wh);
287
- border-color: prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-br-cr);
288
- border-style: prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-br-se);
287
+ border-width: var(
288
+ --_sf-hr-br-wh,
289
+ prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-br-wh)
290
+ );
291
+ border-color: var(
292
+ --_sf-hr-br-cr,
293
+ prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-br-cr)
294
+ );
295
+ border-style: var(
296
+ --_sf-hr-br-se,
297
+ prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-br-se)
298
+ );
289
299
  border-radius: prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-br-rs);
290
300
  box-shadow: prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-sw-ae)
291
301
  prepareMediaVariable(--_ctm-dn-pt-cd-pt-cd-wt-sd-se-sw-br)
@@ -444,7 +454,14 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
444
454
  display: flex;
445
455
  flex-direction: row;
446
456
  align-items: center;
447
- span {
457
+ .svg_icon {
458
+ svg {
459
+ path {
460
+ stroke: var(--_thm-cs-be-se-3);
461
+ }
462
+ }
463
+ }
464
+ .product_info {
448
465
  gap: 6px;
449
466
  display: flex;
450
467
  flex-direction: row;
@@ -456,16 +473,55 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
456
473
  height: 20px;
457
474
 
458
475
  path {
459
- stroke: var(--_gray-400);
476
+ stroke: var(--_thm-cs-be-se-3);
460
477
  }
461
478
  }
462
479
  }
463
480
 
464
- font-family: "Lato";
465
- font-weight: 700;
466
- font-size: 16px;
467
- line-height: 150%;
468
- color: var(--_gray-600);
481
+ // font-family: "Lato";
482
+ // font-weight: 700;
483
+ // font-size: 16px;
484
+ // line-height: 150%;
485
+ // color: var(--_gray-600);
486
+ font-family: var(
487
+ --_ctm-mob-dn-pt-cd-pt-cd-io-ft-fy,
488
+ var(--_ctm-tab-dn-pt-cd-pt-cd-io-ft-fy, var(--_ctm-dn-pt-cd-pt-cd-io-ft-fy))
489
+ );
490
+ font-size: var(
491
+ --_ctm-mob-dn-pt-cd-pt-cd-io-ft-se,
492
+ var(--_ctm-tab-dn-pt-cd-pt-cd-io-ft-se, var(--_ctm-dn-pt-cd-pt-cd-io-ft-se))
493
+ );
494
+ font-weight: var(
495
+ --_ctm-mob-dn-pt-cd-pt-cd-io-ft-wt,
496
+ var(--_ctm-tab-dn-pt-cd-pt-cd-io-ft-wt, var(--_ctm-dn-pt-cd-pt-cd-io-ft-wt))
497
+ );
498
+ color: var(
499
+ --_ctm-mob-dn-pt-cd-pt-cd-io-cr,
500
+ var(--_ctm-tab-dn-pt-cd-pt-cd-io-cr, var(--_ctm-dn-pt-cd-pt-cd-io-cr))
501
+ );
502
+ line-height: var(
503
+ --_ctm-mob-dn-pt-cd-pt-cd-io-le-ht,
504
+ var(--_ctm-tab-dn-pt-cd-pt-cd-io-le-ht, var(--_ctm-dn-pt-cd-pt-cd-io-le-ht))
505
+ );
506
+ letter-spacing: var(
507
+ --_ctm-mob-dn-pt-cd-pt-cd-io-lr-sg,
508
+ var(--_ctm-tab-dn-pt-cd-pt-cd-io-lr-sg, var(--_ctm-dn-pt-cd-pt-cd-io-lr-sg))
509
+ );
510
+ text-decoration: var(
511
+ --_ctm-mob-dn-pt-cd-pt-cd-io-ue,
512
+ var(--_ctm-tab-dn-pt-cd-pt-cd-io-ue, var(--_ctm-dn-pt-cd-pt-cd-io-ue))
513
+ );
514
+ font-style: var(
515
+ --_ctm-mob-dn-pt-cd-pt-cd-io-ft-se-ic,
516
+ var(
517
+ --_ctm-tab-dn-pt-cd-pt-cd-io-ft-se-ic,
518
+ var(--_ctm-dn-pt-cd-pt-cd-io-ft-se-ic)
519
+ )
520
+ );
521
+ padding: var(
522
+ --_ctm-mob-dn-pt-cd-pt-cd-io-pg,
523
+ var(--_ctm-tab-dn-pt-cd-pt-cd-io-pg, var(--_ctm-dn-pt-cd-pt-cd-io-pg))
524
+ );
469
525
  }
470
526
  }
471
527
  .product-cart {
@@ -484,8 +540,8 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
484
540
  }
485
541
  }
486
542
  .cart-badge {
487
- background-color: #ffd700;
488
- color: #101810;
543
+ background-color: var(--_thm-cs-at-py);
544
+ color: #ffffff;
489
545
  border-radius: 4px;
490
546
  font-size: 12px;
491
547
  font-weight: 400;
@@ -506,14 +562,24 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
506
562
  }
507
563
  }
508
564
  .add-product-list-details {
509
- border-left: 1px solid var(--_gray-200);
565
+ // border-left: 1px solid var(--_thm-cs-be-se-3);
566
+ border-color: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-br-cr);
567
+ border-width: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-br-wh);
568
+ border-style: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-br-se);
510
569
  }
511
570
  .customizer-panel {
512
571
  display: flex;
513
572
  flex-direction: column;
514
- gap: 12px;
515
- border-left: 0.5px solid #d0d5dd;
516
- padding-left: 48px;
573
+ // gap: 12px;
574
+ // border-left: 0.5px solid #d0d5dd;
575
+ // padding-left: 48px;
576
+ padding: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-pg);
577
+ gap: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-im-gp);
578
+ border-radius: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-br-rs);
579
+ background-color: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-bd-cr);
580
+ // border-color: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-br-cr);
581
+ // border-width: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-br-wh);
582
+ // border-style: prepareMediaVariable(--_ctm-dn-pt-ds-pt-ds-wt-br-se);
517
583
 
518
584
  .product-header {
519
585
  display: flex;
@@ -735,20 +801,70 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
735
801
  }
736
802
  }
737
803
 
804
+ // .product_qty_wrapper {
805
+ // display: flex;
806
+ // // width: 124px;
807
+ // flex-direction: column;
808
+ // align-items: flex-start;
809
+ // gap: 6px;
810
+ // width: 120px;
811
+
812
+ // .product_qty_container {
813
+ // display: flex;
814
+ // align-items: flex-start;
815
+ // align-self: stretch;
816
+ // border-radius: 4px;
817
+ // border: 0.5px solid #d0d5dd;
818
+ // background: #fff;
819
+ // box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
820
+
821
+ // .product_qty_label {
822
+ // display: flex;
823
+ // padding: 8px 12px;
824
+ // align-items: center;
825
+ // border-radius: 8px 0px 0px 8px;
826
+ // p {
827
+ // color: #475467;
828
+ // font-size: 16px;
829
+ // font-weight: 400;
830
+ // line-height: 24px;
831
+ // }
832
+ // }
833
+
834
+ // .product_qty_number {
835
+ // display: flex;
836
+ // padding: 8px 12px;
837
+ // align-items: center;
838
+ // gap: 8px;
839
+ // flex: 1 0 0;
840
+ // align-self: stretch;
841
+ // border-radius: 0px 4px 4px 0px;
842
+ // background: #fff;
843
+ // border-left: 1px solid #d0d5dd;
844
+ // max-width: 80px;
845
+ // text-align: center;
846
+ // &::-webkit-outer-spin-button,
847
+ // &::-webkit-inner-spin-button {
848
+ // -webkit-appearance: none;
849
+ // margin: 0;
850
+ // }
851
+ // }
852
+ // }
853
+ // }
738
854
  .product_qty_wrapper {
739
855
  display: flex;
740
856
  // width: 124px;
741
857
  flex-direction: column;
742
858
  align-items: flex-start;
743
859
  gap: 6px;
744
- width: 120px;
860
+ width: 113px;
745
861
 
746
862
  .product_qty_container {
747
863
  display: flex;
748
864
  align-items: flex-start;
749
865
  align-self: stretch;
750
866
  border-radius: 4px;
751
- border: 0.5px solid #d0d5dd;
867
+ border: 0.5px solid var(--_thm-cs-be-se-3);
752
868
  background: #fff;
753
869
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
754
870
 
@@ -764,19 +880,29 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
764
880
  line-height: 24px;
765
881
  }
766
882
  }
767
-
768
- .product_qty_number {
883
+ .product_qty_input_container {
884
+ height: 40px;
769
885
  display: flex;
770
- padding: 8px 12px;
771
- align-items: center;
772
- gap: 8px;
773
- flex: 1 0 0;
774
- align-self: stretch;
886
+ // position: relative;
887
+ width: 55px;
775
888
  border-radius: 0px 4px 4px 0px;
776
889
  background: #fff;
777
- border-left: 1px solid #d0d5dd;
778
- max-width: 80px;
890
+ border-left: 1px solid var(--_thm-cs-be-se-3);
891
+ padding: 8px 12px;
892
+ }
893
+ .product_qty_number {
894
+ // display: flex;
895
+ // padding: 8px 12px;
896
+ align-items: center;
897
+ // gap: 8px;
898
+ // flex: 1 0 0;
899
+ // align-self: stretch;
900
+ // border-radius: 0px 4px 4px 0px;
901
+ // background: #fff;
902
+ // border-left: 1px solid #d0d5dd;
903
+ // max-width: 80px;
779
904
  text-align: center;
905
+ width: 75%;
780
906
  &::-webkit-outer-spin-button,
781
907
  &::-webkit-inner-spin-button {
782
908
  -webkit-appearance: none;
@@ -1395,6 +1521,7 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
1395
1521
 
1396
1522
  border-radius: var(--toggle-height); /* Full pill shape */
1397
1523
  box-sizing: border-box;
1524
+ padding: 2px;
1398
1525
  }
1399
1526
  &[data-swatch-shape-selected="circle"] {
1400
1527
  & div,
@@ -2157,7 +2284,7 @@ div[data-div-type="cms-buy-for-tabs-container-wrapper"] {
2157
2284
  }
2158
2285
 
2159
2286
  .title {
2160
- margin-bottom: 4px;
2287
+ // margin-bottom: 4px;
2161
2288
  color: var(
2162
2289
  --_ctm-mob-dn-pt-ds-vt-pr-on-te-cr,
2163
2290
  var(--_ctm-tab-dn-pt-ds-vt-pr-on-te-cr, var(--_ctm-dn-pt-ds-vt-pr-on-te-cr))