@sc-360-v2/storefront-cms-library 0.5.59 → 0.5.60

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 (201) hide show
  1. package/dist/add-existing-form.scss +13 -5
  2. package/dist/add-order.scss +129 -245
  3. package/dist/add-products-tab-details.scss +1048 -2097
  4. package/dist/add-products-tab.scss +666 -1204
  5. package/dist/allocation-header-quota-details.scss +198 -411
  6. package/dist/allocationDetails.scss +1645 -2126
  7. package/dist/allocations-quota-details.scss +168 -327
  8. package/dist/allocations.scss +476 -797
  9. package/dist/amount-estimator.scss +405 -743
  10. package/dist/animation-control.scss +23 -23
  11. package/dist/badge.scss +43 -18
  12. package/dist/brand-basic-elements.scss +76 -124
  13. package/dist/brand.scss +28 -55
  14. package/dist/breadcrumbs.scss +356 -718
  15. package/dist/builder.js +1 -1
  16. package/dist/bulk-variant-picker.scss +1133 -2034
  17. package/dist/bundle copy.scss +235 -0
  18. package/dist/bundle.scss +843 -1479
  19. package/dist/bundleDetails.scss +3774 -5063
  20. package/dist/button copy.scss +28 -0
  21. package/dist/button.scss +78 -103
  22. package/dist/buy-for-tab-container.scss +77 -106
  23. package/dist/buy-for-tabs-container-item.scss +80 -80
  24. package/dist/buyForHeaders.scss +1725 -2988
  25. package/dist/cart-details.scss +491 -1012
  26. package/dist/cart-products-sidebar.scss +211 -211
  27. package/dist/cart-summary.scss +559 -1152
  28. package/dist/cart-wrapper.scss +85 -127
  29. package/dist/cart.scss +115 -223
  30. package/dist/cartAttributes.scss +367 -647
  31. package/dist/cartGrouping.scss +89 -89
  32. package/dist/category-groups-element.scss +127 -108
  33. package/dist/category-groups-product-grid.scss +40 -79
  34. package/dist/category-groups-product-image.scss +457 -1390
  35. package/dist/category-groups-product-options.scss +224 -693
  36. package/dist/category-groups-product-price.scss +1326 -4859
  37. package/dist/category-groups-quota-details.scss +217 -466
  38. package/dist/category.scss +26 -50
  39. package/dist/categoryDetails.scss +61 -61
  40. package/dist/categoryWidget.scss +34 -34
  41. package/dist/checkbox-radio.scss +124 -124
  42. package/dist/checkout.scss +1858 -4170
  43. package/dist/common-element.scss +35 -35
  44. package/dist/confirm-modal.scss +22 -2
  45. package/dist/confirmationModal.scss +139 -139
  46. package/dist/container.scss +32 -54
  47. package/dist/countdown.scss +256 -443
  48. package/dist/coupon.scss +355 -714
  49. package/dist/custom-fonts.scss +100 -100
  50. package/dist/default-dropdown.scss +12 -1
  51. package/dist/embroider-preview-element.scss +94 -94
  52. package/dist/embroider-template-1-v2.scss +123 -172
  53. package/dist/embroider-template-1.scss +68 -104
  54. package/dist/embroidery.scss +30 -31
  55. package/dist/employee-bulk-order.scss +418 -142
  56. package/dist/emtpy-templates.scss +165 -165
  57. package/dist/faq.scss +235 -419
  58. package/dist/filter-results.scss +125 -265
  59. package/dist/filters.scss +831 -1682
  60. package/dist/flex-text-editor.scss +271 -271
  61. package/dist/functions.scss +36 -0
  62. package/dist/gallery-slider-temp.scss +435 -758
  63. package/dist/global-styles.scss +23 -7
  64. package/dist/grid.scss +25 -33
  65. package/dist/hotspot.scss +69 -119
  66. package/dist/icon-list.scss +30 -59
  67. package/dist/image-for-product.scss +21 -21
  68. package/dist/image-temp.scss +21 -20
  69. package/dist/item-stock.scss +9 -16
  70. package/dist/kitDetails.scss +2719 -4299
  71. package/dist/kits.scss +24 -19
  72. package/dist/language-selector.scss +233 -375
  73. package/dist/last-x-orders.scss +101 -187
  74. package/dist/layouter-item.scss +75 -103
  75. package/dist/layouter-pro-item.scss +89 -95
  76. package/dist/layouter-pro.scss +87 -92
  77. package/dist/layouter.scss +67 -117
  78. package/dist/light-box-v2.scss +89 -104
  79. package/dist/lightbox.scss +78 -78
  80. package/dist/line.scss +29 -70
  81. package/dist/loader.scss +37 -37
  82. package/dist/login.scss +291 -572
  83. package/dist/map.scss +220 -369
  84. package/dist/marchandiserSets.scss +95 -104
  85. package/dist/mega-menu-container.scss +96 -109
  86. package/dist/mega-menu.scss +624 -734
  87. package/dist/menu-item.scss +19 -19
  88. package/dist/menu-v2.scss +507 -619
  89. package/dist/multi-select-dropdown.scss +27 -3
  90. package/dist/my-templates.scss +38 -9
  91. package/dist/myTemplates.scss +3 -0
  92. package/dist/option-bar.scss +215 -375
  93. package/dist/order-processing.scss +61 -61
  94. package/dist/order-status.scss +643 -1117
  95. package/dist/overflow-module.scss +62 -63
  96. package/dist/past-orders.scss +118 -149
  97. package/dist/payment-methods.scss +46 -30
  98. package/dist/pickup-locations.scss +564 -1121
  99. package/dist/position-module.scss +98 -95
  100. package/dist/prefix-list.scss +97 -86
  101. package/dist/product-actions.scss +1230 -1783
  102. package/dist/product-basic-elements.scss +108 -169
  103. package/dist/product-highlights.scss +116 -157
  104. package/dist/product-image-bundles.scss +345 -671
  105. package/dist/product-image.scss +341 -724
  106. package/dist/product-inventory.scss +673 -1357
  107. package/dist/product-labels.scss +94 -113
  108. package/dist/product-options.scss +288 -486
  109. package/dist/product-price.scss +1284 -2556
  110. package/dist/product-promotions.scss +1388 -2830
  111. package/dist/product-sizechart.scss +516 -905
  112. package/dist/product.scss +28 -61
  113. package/dist/productDetails.scss +19 -38
  114. package/dist/profile.scss +231 -447
  115. package/dist/quantity-selector.scss +313 -550
  116. package/dist/quick-inventory-check.scss +101 -187
  117. package/dist/quick-links.scss +56 -133
  118. package/dist/quick-order-pad.scss +216 -269
  119. package/dist/quota-details.scss +163 -297
  120. package/dist/quotes.scss +82 -121
  121. package/dist/repeater copy.scss +24 -0
  122. package/dist/repeater-embla-controls.scss +34 -14
  123. package/dist/repeater-grid-toggle.scss +156 -166
  124. package/dist/repeater-item.scss +41 -64
  125. package/dist/repeater.scss +579 -688
  126. package/dist/request-for-quotes.scss +66 -16
  127. package/dist/responsive-behaviour.scss +31 -29
  128. package/dist/rfqs.scss +118 -181
  129. package/dist/scroll.scss +89 -167
  130. package/dist/search.scss +179 -326
  131. package/dist/section.scss +27 -51
  132. package/dist/shareCartSideBar.scss +254 -254
  133. package/dist/shipping-estimator.scss +41 -41
  134. package/dist/shipping-payments.scss +198 -58
  135. package/dist/simple-list.scss +65 -135
  136. package/dist/social.scss +78 -143
  137. package/dist/sort.scss +89 -89
  138. package/dist/stack.scss +23 -34
  139. package/dist/static-global.scss +44 -26
  140. package/dist/static-text.scss +52 -52
  141. package/dist/stockStatus.scss +11 -19
  142. package/dist/store-locations.scss +587 -1113
  143. package/dist/sub-category.scss +74 -74
  144. package/dist/submit-quote.scss +275 -275
  145. package/dist/tab-container-item.scss +80 -80
  146. package/dist/tab-container.scss +81 -108
  147. package/dist/tab-v2.scss +277 -604
  148. package/dist/table-common.scss +215 -406
  149. package/dist/table.scss +267 -509
  150. package/dist/text-temp-v2.scss +12 -23
  151. package/dist/text-temp.scss +110 -109
  152. package/dist/theme-classes.scss +17 -13
  153. package/dist/toggle-button.scss +32 -32
  154. package/dist/transform-properties-module.scss +20 -20
  155. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +108 -0
  156. package/dist/types/builder/tools/element-edit/breadcrumbs.d.ts +6 -0
  157. package/dist/types/builder/tools/element-edit/bundle.d.ts +22 -0
  158. package/dist/types/builder/tools/element-edit/bundleDetails.d.ts +64 -0
  159. package/dist/types/builder/tools/element-edit/buttonInstance.d.ts +10 -0
  160. package/dist/types/builder/tools/element-edit/buyForWithTab.d.ts +84 -0
  161. package/dist/types/builder/tools/element-edit/cart.d.ts +6 -0
  162. package/dist/types/builder/tools/element-edit/cartAttributes.d.ts +60 -0
  163. package/dist/types/builder/tools/element-edit/cartDetails.d.ts +16 -0
  164. package/dist/types/builder/tools/element-edit/cartSummary.d.ts +202 -0
  165. package/dist/types/builder/tools/element-edit/categoryGroups.d.ts +158 -0
  166. package/dist/types/builder/tools/element-edit/checkout.d.ts +172 -0
  167. package/dist/types/builder/tools/element-edit/common.d.ts +2 -0
  168. package/dist/types/builder/tools/element-edit/countdown.d.ts +44 -0
  169. package/dist/types/builder/tools/element-edit/coupon.d.ts +28 -0
  170. package/dist/types/builder/tools/element-edit/embroidery.d.ts +37 -0
  171. package/dist/types/builder/tools/element-edit/filterResults.d.ts +4 -0
  172. package/dist/types/builder/tools/element-edit/icon-list.d.ts +11 -0
  173. package/dist/types/builder/tools/element-edit/itemStock.d.ts +2 -0
  174. package/dist/types/builder/tools/element-edit/kitDetails.d.ts +66 -0
  175. package/dist/types/builder/tools/element-edit/kits.d.ts +4 -0
  176. package/dist/types/builder/tools/element-edit/map.d.ts +5 -1
  177. package/dist/types/builder/tools/element-edit/marchandiserSets.d.ts +2 -0
  178. package/dist/types/builder/tools/element-edit/orderStatus.d.ts +17 -0
  179. package/dist/types/builder/tools/element-edit/paymentMethods.d.ts +6 -0
  180. package/dist/types/builder/tools/element-edit/productCustomizations.d.ts +14 -0
  181. package/dist/types/builder/tools/element-edit/quickLinks.d.ts +26 -0
  182. package/dist/types/builder/tools/element-edit/scroll.d.ts +2 -11
  183. package/dist/types/builder/tools/element-edit/search.d.ts +1 -0
  184. package/dist/types/builder/tools/element-edit/searchResultsHeading.d.ts +6 -0
  185. package/dist/types/builder/tools/element-edit/shipping-payments.d.ts +72 -0
  186. package/dist/types/builder/tools/element-edit/shippingEstimator.d.ts +4 -0
  187. package/dist/types/builder/tools/element-edit/social.d.ts +2 -0
  188. package/dist/types/builder/tools/element-edit/spotlight.d.ts +2 -0
  189. package/dist/types/builder/tools/element-edit/table.d.ts +10 -0
  190. package/dist/types/builder/tools/element-edit/tabs.d.ts +6 -0
  191. package/dist/types/builder/tools/element-edit/typographyInstance.d.ts +110 -0
  192. package/dist/types/builder/tools/element-edit/userElements.d.ts +50 -11
  193. package/dist/types/builder/tools/element-edit/variantPicker.d.ts +4 -0
  194. package/dist/types/builder/tools/element-edit/video.d.ts +22 -0
  195. package/dist/uom-selector.scss +489 -943
  196. package/dist/user-elements.scss +537 -826
  197. package/dist/variant-picker.scss +1282 -2559
  198. package/dist/video.scss +147 -325
  199. package/dist/volume-pricing.scss +539 -1035
  200. package/dist/wishlist-overlay.scss +48 -48
  201. package/package.json +131 -131
package/dist/button copy.scss CHANGED
@@ -62,6 +62,18 @@
62
62
  --_ctm-mob-dn-hr-se-ft-fy,
63
63
  var(--_ctm-tab-dn-hr-se-ft-fy, var(--_ctm-dn-hr-se-ft-fy))
64
64
  );
65
+ --_sf-hr-tt-tm: var(
66
+ --_ctm-mob-dn-hr-se-tt-tm,
67
+ var(--_ctm-tab-dn-hr-se-tt-tm, var(--_ctm-dn-hr-se-tt-tm))
68
+ );
69
+ --_sf-hr-wd-wp: var(
70
+ --_ctm-mob-dn-hr-se-wd-wp,
71
+ var(--_ctm-tab-dn-hr-se-wd-wp, var(--_ctm-dn-hr-se-wd-wp))
72
+ );
73
+ --_sf-hr-wd-bk: var(
74
+ --_ctm-mob-dn-hr-se-wd-bk,
75
+ var(--_ctm-tab-dn-hr-se-wd-bk, var(--_ctm-dn-hr-se-wd-bk))
76
+ );
65
77
  --_sf-hr-fs: var(
66
78
  --_ctm-mob-dn-hr-se-ft-se,
67
79
  var(--_ctm-tab-dn-hr-se-ft-se, var(--_ctm-dn-hr-se-ft-se))
@@ -201,6 +213,22 @@
201
213
  --_sf-hr-ff,
202
214
  var(--_ctm-mob-dn-dt-se-ft-fy, var(--_ctm-tab-dn-dt-se-ft-fy, var(--_ctm-dn-dt-se-ft-fy)))
203
215
  );
216
+ text-transform: var(
217
+ --_sf-hr-tt-tm,
218
+ var(--_ctm-mob-dn-dt-se-tt-tm, var(--_ctm-tab-dn-dt-se-tt-tm, var(--_ctm-dn-dt-se-tt-tm)))
219
+ );
220
+ word-wrap: var(
221
+ --_sf-hr-wd-wp,
222
+ var(--_ctm-mob-dn-dt-se-wd-wp, var(--_ctm-tab-dn-dt-se-wd-wp, var(--_ctm-dn-dt-se-wd-wp)))
223
+ );
224
+ word-break: var(
225
+ --_sf-hr-wd-bk,
226
+ var(--_ctm-mob-dn-dt-se-wd-bk, var(--_ctm-tab-dn-dt-se-wd-bk, var(--_ctm-dn-dt-se-wd-bk)))
227
+ );
228
+ &.flex__overflow {
229
+ white-space: normal;
230
+ @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
231
+ }
204
232
  font-size: var(
205
233
  --_sf-hr-fs,
206
234
  var(--_ctm-mob-dn-dt-se-ft-se, var(--_ctm-tab-dn-dt-se-ft-se, var(--_ctm-dn-dt-se-ft-se)))
package/dist/button.scss CHANGED
@@ -7,7 +7,7 @@
7
7
  &[data-element-type="button"] {
8
8
  min-height: 24px !important;
9
9
 
10
- & > .wrapper {
10
+ &>.wrapper {
11
11
  // width: 100%;
12
12
  height: 100%;
13
13
  height: var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht))) !important;
@@ -16,136 +16,98 @@
16
16
  &[data-show-shadow="false"] {
17
17
  --_show-shadow: none;
18
18
  }
19
+
19
20
  &[data-icon-position="left"] {
20
21
  --_sf-fd-bn: row;
21
22
  }
23
+
22
24
  &[data-icon-position="right"] {
23
25
  --_sf-fd-bn: row-reverse;
24
26
  }
27
+
25
28
  &[data-icon-position="center"] {
26
29
  --_sf-fd-bn: row;
27
30
  }
28
31
 
29
32
  &:hover {
30
- --_sf-hr-bd-cr: var(
31
- --_ctm-mob-dn-hr-se-bd-cr,
32
- var(--_ctm-tab-dn-hr-se-bd-cr, var(--_ctm-dn-hr-se-bd-cr))
33
- );
34
- --_sf-hr-br-cr: var(
35
- --_ctm-mob-dn-hr-se-br-cr,
36
- var(--_ctm-tab-dn-hr-se-br-cr, var(--_ctm-dn-hr-se-br-cr))
37
- );
38
- --_sf-hr-br-se: var(
39
- --_ctm-mob-dn-hr-se-br-se,
40
- var(--_ctm-tab-dn-hr-se-br-se, var(--_ctm-dn-hr-se-br-se))
41
- );
42
- --_sf-hr-br-wh: var(
43
- --_ctm-mob-dn-hr-se-br-wh,
44
- var(--_ctm-tab-dn-hr-se-br-wh, var(--_ctm-dn-hr-se-br-wh))
45
- );
46
- --_sf-hr-br-rs: var(
47
- --_ctm-mob-dn-hr-se-br-rs,
48
- var(--_ctm-tab-dn-hr-se-br-rs, var(--_ctm-dn-hr-se-br-rs))
49
- );
33
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-hr-se-bd-cr,
34
+ var(--_ctm-tab-dn-hr-se-bd-cr, var(--_ctm-dn-hr-se-bd-cr)));
35
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-hr-se-br-cr,
36
+ var(--_ctm-tab-dn-hr-se-br-cr, var(--_ctm-dn-hr-se-br-cr)));
37
+ --_sf-hr-br-se: var(--_ctm-mob-dn-hr-se-br-se,
38
+ var(--_ctm-tab-dn-hr-se-br-se, var(--_ctm-dn-hr-se-br-se)));
39
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-hr-se-br-wh,
40
+ var(--_ctm-tab-dn-hr-se-br-wh, var(--_ctm-dn-hr-se-br-wh)));
41
+ --_sf-hr-br-rs: var(--_ctm-mob-dn-hr-se-br-rs,
42
+ var(--_ctm-tab-dn-hr-se-br-rs, var(--_ctm-dn-hr-se-br-rs)));
50
43
 
51
44
  // for shadow
52
- --_sf-hr-sw-ae: var(
53
- --_ctm-mob-dn-hr-se-sw-ae,
54
- var(--_ctm-tab-dn-hr-se-sw-ae, var(--_ctm-dn-hr-se-sw-ae))
55
- );
56
- --_sf-hr-sw-br: var(
57
- --_ctm-mob-dn-hr-se-sw-br,
58
- var(--_ctm-tab-dn-hr-se-sw-br, var(--_ctm-dn-hr-se-sw-br))
59
- );
60
-
61
- --_sf-hr-sw-cr: var(
62
- --_ctm-mob-dn-hr-se-sw-cr,
63
- var(--_ctm-tab-dn-hr-se-sw-cr, var(--_ctm-dn-hr-se-sw-cr))
64
- );
45
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-hr-se-sw-ae,
46
+ var(--_ctm-tab-dn-hr-se-sw-ae, var(--_ctm-dn-hr-se-sw-ae)));
47
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-hr-se-sw-br,
48
+ var(--_ctm-tab-dn-hr-se-sw-br, var(--_ctm-dn-hr-se-sw-br)));
49
+
50
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-hr-se-sw-cr,
51
+ var(--_ctm-tab-dn-hr-se-sw-cr, var(--_ctm-dn-hr-se-sw-cr)));
65
52
 
66
53
  // for font
67
54
 
68
- --_sf-hr-cr: var(
69
- --_ctm-mob-dn-hr-se-cr,
70
- var(--_ctm-tab-dn-hr-se-cr, var(--_ctm-dn-hr-se-cr))
71
- );
72
- --_sf-hr-ft-fy: var(
73
- --_ctm-mob-dn-hr-se-ft-fy,
74
- var(--_ctm-tab-dn-hr-se-ft-fy, var(--_ctm-dn-hr-se-ft-fy))
75
- );
76
- --_sf-hr-tt-tm: var(
77
- --_ctm-mob-dn-hr-se-tt-tm,
78
- var(--_ctm-tab-dn-hr-se-tt-tm, var(--_ctm-dn-hr-se-tt-tm))
79
- );
80
- --_sf-hr-ft-se: var(
81
- --_ctm-mob-dn-hr-se-ft-se,
82
- var(--_ctm-tab-dn-hr-se-ft-se, var(--_ctm-dn-hr-se-ft-se))
83
- );
84
- --_sf-hr-ft-wt: var(
85
- --_ctm-mob-dn-hr-se-ft-wt,
86
- var(--_ctm-tab-dn-hr-se-ft-wt, var(--_ctm-dn-hr-se-ft-wt))
87
- );
88
- --_sf-hr-ft-se-ic: var(
89
- --_ctm-mob-dn-hr-se-ft-se-ic,
90
- var(--_ctm-tab-dn-hr-se-ft-se-ic, var(--_ctm-dn-hr-se-ft-se-ic))
91
- );
92
- --_sf-hr-tt-an: var(
93
- --_ctm-mob-dn-hr-se-tt-an,
94
- var(--_ctm-tab-dn-hr-se-tt-an, var(--_ctm-dn-hr-se-tt-an))
95
- );
96
- --_sf-hr-lr-sg: var(
97
- --_ctm-mob-dn-hr-se-lr-sg,
98
- var(--_ctm-tab-dn-hr-se-lr-sg, var(--_ctm-dn-hr-se-lr-sg))
99
- );
100
- --_sf-hr-le-ht: var(
101
- --_ctm-mob-dn-hr-se-le-ht,
102
- var(--_ctm-tab-dn-hr-se-le-ht, var(--_ctm-dn-hr-se-le-ht))
103
- );
104
-
105
- --_sf-hr-txt-tr: var(
106
- --_ctm-mob-dn-hr-se-tt-tm,
107
- var(--_ctm-tab-dn-hr-se-tt-tm, var(--_ctm-dn-hr-se-tt-tm))
108
- );
109
- --_sf-hr-wd-wp: var(
110
- --_ctm-mob-dn-hr-se-wd-wp,
111
- var(--_ctm-tab-dn-hr-se-wd-wp, var(--_ctm-dn-hr-se-wd-wp))
112
- );
113
- --_sf-hr-wd-bk: var(
114
- --_ctm-mob-dn-hr-se-wd-bk,
115
- var(--_ctm-tab-dn-hr-se-wd-bk, var(--_ctm-dn-hr-se-wd-bk))
116
- );
117
-
118
- --_sf-hr-in-se: var(
119
- --_ctm-mob-dn-hr-se-in-se,
120
- var(--_ctm-tab-dn-hr-se-in-se, var(--_ctm-dn-hr-se-in-se))
121
- );
122
-
123
- --_sf-hr-in-c1: var(
124
- --_ctm-mob-dn-hr-se-in-c1,
125
- var(--_ctm-tab-dn-hr-se-in-c1, var(--_ctm-dn-hr-se-in-c1))
126
- );
127
- --_sf-hr-ue: var(
128
- --_ctm-mob-dn-hr-se-ue,
129
- var(--_ctm-tab-dn-hr-se-ue, var(--_ctm-dn-hr-se-ue))
130
- );
55
+ --_sf-hr-cr: var(--_ctm-mob-dn-hr-se-cr,
56
+ var(--_ctm-tab-dn-hr-se-cr, var(--_ctm-dn-hr-se-cr)));
57
+ --_sf-hr-ft-fy: var(--_ctm-mob-dn-hr-se-ft-fy,
58
+ var(--_ctm-tab-dn-hr-se-ft-fy, var(--_ctm-dn-hr-se-ft-fy)));
59
+ --_sf-hr-tt-tm: var(--_ctm-mob-dn-hr-se-tt-tm,
60
+ var(--_ctm-tab-dn-hr-se-tt-tm, var(--_ctm-dn-hr-se-tt-tm)));
61
+ --_sf-hr-ft-se: var(--_ctm-mob-dn-hr-se-ft-se,
62
+ var(--_ctm-tab-dn-hr-se-ft-se, var(--_ctm-dn-hr-se-ft-se)));
63
+ --_sf-hr-ft-wt: var(--_ctm-mob-dn-hr-se-ft-wt,
64
+ var(--_ctm-tab-dn-hr-se-ft-wt, var(--_ctm-dn-hr-se-ft-wt)));
65
+ --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-hr-se-ft-se-ic,
66
+ var(--_ctm-tab-dn-hr-se-ft-se-ic, var(--_ctm-dn-hr-se-ft-se-ic)));
67
+ --_sf-hr-tt-an: var(--_ctm-mob-dn-hr-se-tt-an,
68
+ var(--_ctm-tab-dn-hr-se-tt-an, var(--_ctm-dn-hr-se-tt-an)));
69
+ --_sf-hr-lr-sg: var(--_ctm-mob-dn-hr-se-lr-sg,
70
+ var(--_ctm-tab-dn-hr-se-lr-sg, var(--_ctm-dn-hr-se-lr-sg)));
71
+ --_sf-hr-le-ht: var(--_ctm-mob-dn-hr-se-le-ht,
72
+ var(--_ctm-tab-dn-hr-se-le-ht, var(--_ctm-dn-hr-se-le-ht)));
73
+
74
+ --_sf-hr-txt-tr: var(--_ctm-mob-dn-hr-se-tt-tm,
75
+ var(--_ctm-tab-dn-hr-se-tt-tm, var(--_ctm-dn-hr-se-tt-tm)));
76
+ --_sf-hr-wd-wp: var(--_ctm-mob-dn-hr-se-wd-wp,
77
+ var(--_ctm-tab-dn-hr-se-wd-wp, var(--_ctm-dn-hr-se-wd-wp)));
78
+ --_sf-hr-wd-bk: var(--_ctm-mob-dn-hr-se-wd-bk,
79
+ var(--_ctm-tab-dn-hr-se-wd-bk, var(--_ctm-dn-hr-se-wd-bk)));
80
+
81
+ --_sf-hr-in-se: var(--_ctm-mob-dn-hr-se-in-se,
82
+ var(--_ctm-tab-dn-hr-se-in-se, var(--_ctm-dn-hr-se-in-se)));
83
+
84
+ --_sf-hr-in-c1: var(--_ctm-mob-dn-hr-se-in-c1,
85
+ var(--_ctm-tab-dn-hr-se-in-c1, var(--_ctm-dn-hr-se-in-c1)));
86
+ --_sf-hr-ue: var(--_ctm-mob-dn-hr-se-ue,
87
+ var(--_ctm-tab-dn-hr-se-ue, var(--_ctm-dn-hr-se-ue)));
131
88
 
132
89
  &[data-hover-show-shadow="false"] {
133
90
  --_hover-show-shadow: none;
134
91
  }
92
+
135
93
  &[data-hover-show-icon="false"] {
136
94
  --_hover-show-icon: none;
137
95
  }
138
96
  }
97
+
139
98
  &[data-show-icon="false"] {
140
99
  --_show-icon: none;
141
100
  }
101
+
142
102
  &[data-element-style="Icon"] {
143
103
  &[data-icon-position="left"] {
144
104
  --_sf-jc: start;
145
105
  }
106
+
146
107
  &[data-icon-position="right"] {
147
108
  --_sf-jc: end;
148
109
  }
110
+
149
111
  &[data-icon-position="center"] {
150
112
  --_sf-jc: center;
151
113
  }
@@ -167,10 +129,7 @@
167
129
 
168
130
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-dt-se-br-rs));
169
131
 
170
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-dt-se-sw-ae))
171
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-dt-se-sw-br))
172
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-dt-se-sw-sd))
173
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-dt-se-sw-cr));
132
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-dt-se-sw-cr));
174
133
 
175
134
  &[data-show-border="true"] {
176
135
  border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-dt-se-br-cr));
@@ -186,6 +145,7 @@
186
145
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-dt-se-cr));
187
146
 
188
147
  font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-dt-se-ft-fy));
148
+
189
149
  &.flex__overflow {
190
150
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
191
151
  }
@@ -217,6 +177,7 @@
217
177
 
218
178
  .icon {
219
179
  display: var(--_hover-show-icon, var(--_show-icon, flex));
180
+
220
181
  svg {
221
182
  width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-dt-se-in-se));
222
183
  height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-dt-se-in-se));
@@ -228,6 +189,7 @@
228
189
  }
229
190
  }
230
191
  }
192
+
231
193
  [data-element-style="Text"] {
232
194
  display: inline-block;
233
195
  width: 100%;
@@ -260,29 +222,35 @@
260
222
  align-items: center;
261
223
  border-radius: 4px;
262
224
  gap: 8px;
263
- & > span {
225
+
226
+ &>span {
264
227
  display: flex;
265
228
  }
266
229
 
267
230
  &.btn__sm {
268
231
  padding-inline: 16px;
269
232
  font-size: 14px;
233
+
270
234
  svg {
271
235
  width: 16px;
272
236
  height: 16px;
273
237
  }
274
238
  }
239
+
275
240
  &.btn__md {
276
241
  padding-inline: 24px;
277
242
  font-size: 18px;
243
+
278
244
  svg {
279
245
  width: 20px;
280
246
  height: 20px;
281
247
  }
282
248
  }
249
+
283
250
  &.btn__lg {
284
251
  padding-inline: 32px;
285
252
  font-size: 24px;
253
+
286
254
  svg {
287
255
  width: 24px;
288
256
  height: 24px;
@@ -298,27 +266,34 @@
298
266
  color: var(--_base-white);
299
267
  }
300
268
  }
269
+
301
270
  &.secondary {
302
271
  background-color: var(--_gray-100);
303
272
  color: var(--_gray-700);
273
+
304
274
  &:hover {
305
275
  background-color: var(--_gray-200);
306
276
  color: var(--_gray-900);
307
277
  }
308
278
  }
279
+
309
280
  &.tertiary {
310
281
  background-color: transparent;
282
+
311
283
  &.primary__txt {
312
284
  color: var(--_primary-400);
285
+
313
286
  &:hover {
314
287
  color: var(--_primary-500);
315
288
  }
316
289
  }
290
+
317
291
  &.secondary__txt {
318
292
  color: var(--_gray-700);
293
+
319
294
  &:hover {
320
295
  color: var(--_gray-900);
321
296
  }
322
297
  }
323
298
  }
324
- }
299
+ }
package/dist/buy-for-tab-container.scss CHANGED
@@ -15,7 +15,8 @@
15
15
  // background: var(--_ctm-buyfo-dn-bd-cr);
16
16
  width: 1200px;
17
17
  margin: 0 auto;
18
- & > div {
18
+
19
+ &>div {
19
20
  &.wrapper {
20
21
  width: 100%;
21
22
  height: 100%;
@@ -26,116 +27,86 @@
26
27
  }
27
28
 
28
29
  &:is([data-background-type="gradient"] > *).wrapper {
29
- --_sf-buyfo-gradient-angle: calc(
30
- #{prepareMediaVariable(--_ctm-buyfo-dn-gt-ae, 90)} * 1deg
31
- );
30
+ --_sf-buyfo-gradient-angle: calc(#{prepareMediaVariable(--_ctm-buyfo-dn-gt-ae, 90)} * 1deg);
32
31
  --_sf-buyfo-gradient-start-color: #{prepareMediaVariable(
33
- --_ctm-buyfo-dn-gt-st-cr,
34
- transparent
35
- )};
36
- --_sf-buyfo-gradient-start-position: calc(
37
- #{prepareMediaVariable(--_ctm-buyfo-dn-gt-st-pn, 0)} * 1%
38
- );
39
- --_sf-buyfo-gradient-end-color: #{prepareMediaVariable(
40
- --_ctm-buyfo-dn-gt-ed-cr,
41
- transparent
42
- )};
43
- --_sf-buyfo-gradient-end-position: calc(
44
- #{prepareMediaVariable(--_ctm-buyfo-dn-gt-ed-pn, 100)} * 1%
45
- );
46
- --_sf-buyfo-gradient-position: #{prepareMediaVariable(--_ctm-buyfo-dn-gt-pn, center)};
32
+ --_ctm-buyfo-dn-gt-st-cr,
33
+ transparent)
47
34
  }
48
35
 
49
- &:is([data-gradient-type="Linear Gradient"] > *).wrapper {
50
- background-image: linear-gradient(
51
- var(--_sf-buyfo-gradient-angle),
52
- var(--_sf-buyfo-gradient-start-color) var(--_sf-buyfo-gradient-start-position),
53
- var(--_sf-buyfo-gradient-end-color) var(--_sf-buyfo-gradient-end-position)
54
- );
55
- }
36
+ ;
37
+ --_sf-buyfo-gradient-start-position: calc(#{prepareMediaVariable(--_ctm-buyfo-dn-gt-st-pn, 0)} * 1%);
38
+ --_sf-buyfo-gradient-end-color: #{prepareMediaVariable(
39
+ --_ctm-buyfo-dn-gt-ed-cr,
40
+ transparent)
41
+ }
56
42
 
57
- &:is([data-gradient-type="Radial Gradient"] > *).wrapper {
58
- background-image: radial-gradient(
59
- circle at var(--_sf-buyfo-gradient-position),
60
- var(--_sf-buyfo-gradient-start-color) var(--_sf-buyfo-gradient-start-position),
61
- var(--_sf-buyfo-gradient-end-color) var(--_sf-buyfo-gradient-end-position)
62
- );
63
- }
64
- &:is([data-background-type="image"] > *).wrapper {
65
- background-image: prepareMediaVariable(--_ctm-buyfo-dn-bd-ie);
66
- background-attachment: prepareMediaVariable(--_ctm-buyfo-dn-bd-at);
67
- background-position: prepareMediaVariable(--_ctm-buyfo-dn-bd-pn);
68
- background-position-y: prepareMediaVariable(--_ctm-buyfo-dn-bd-pn-y);
69
- background-repeat: prepareMediaVariable(--_ctm-buyfo-dn-bd-rt);
70
- background-size: prepareMediaVariable(--_ctm-buyfo-dn-bd-se);
71
- }
43
+ ;
44
+ --_sf-buyfo-gradient-end-position: calc(#{prepareMediaVariable(--_ctm-buyfo-dn-gt-ed-pn, 100)} * 1%);
45
+ --_sf-buyfo-gradient-position: #{prepareMediaVariable(--_ctm-buyfo-dn-gt-pn, center)};
46
+ }
72
47
 
73
- // background-color: var(
74
- // --_ctm-mob-buyfo-dn-bd-cr,
75
- // var(--_ctm-tab-buyfo-dn-bd-cr, var(--_ctm-buyfo-dn-bd-cr))
76
- // );
77
- // background-image: var(
78
- // --_ctm-mob-buyfo-dn-bd-ie,
79
- // var(--_ctm-tab-buyfo-dn-bd-ie, var(--_ctm-buyfo-dn-bd-ie))
80
- // );
81
- // background-attachment: var(
82
- // --_ctm-mob-buyfo-dn-bd-at,
83
- // var(--_ctm-tab-buyfo-dn-bd-at, var(--_ctm-buyfo-dn-bd-at))
84
- // );
85
- // background-position: var(
86
- // --_ctm-mob-buyfo-dn-bd-pn,
87
- // var(--_ctm-tab-buyfo-dn-bd-pn, var(--_ctm-buyfo-dn-bd-pn))
88
- // );
89
- // background-repeat: var(
90
- // --_ctm-mob-buyfo-dn-bd-rt,
91
- // var(--_ctm-tab-buyfo-dn-bd-rt, var(--_ctm-buyfo-dn-bd-rt))
92
- // );
93
- // background-size: var(
94
- // --_ctm-mob-buyfo-dn-bd-se,
95
- // var(--_ctm-tab-buyfo-dn-bd-se, var(--_ctm-buyfo-dn-bd-se))
96
- // );
97
- border-radius: var(
98
- --_ctm-mob-buyfo-dn-br-rs,
99
- var(--_ctm-tab-buyfo-dn-br-rs, var(--_ctm-buyfo-dn-br-rs))
100
- );
101
- border-color: var(
102
- --_ctm-mob-buyfo-dn-br-cr,
103
- var(--_ctm-tab-buyfo-dn-br-cr, var(--_ctm-buyfo-dn-br-cr))
104
- );
105
- border-style: var(
106
- --_ctm-mob-buyfo-dn-br-se,
107
- var(--_ctm-tab-buyfo-dn-br-se, var(--_ctm-buyfo-dn-br-se))
108
- );
109
- border-width: var(
110
- --_ctm-mob-buyfo-dn-br-wh,
111
- var(--_ctm-tab-buyfo-dn-br-wh, var(--_ctm-buyfo-dn-br-wh))
112
- );
113
- box-shadow: var(
114
- --_hover-show-shadow,
115
- var(
116
- --_sf-hr-bx-sw,
117
- var(
118
- --_show-shadow,
119
- var(
120
- --_ctm-mob-dn-dt-se-sw-ae,
121
- var(--_ctm-tab-dn-dt-se-sw-ae, var(--_ctm-dn-dt-se-sw-ae))
122
- )
123
- var(
124
- --_ctm-mob-dn-dt-se-sw-br,
125
- var(--_ctm-tab-dn-dt-se-sw-br, var(--_ctm-dn-dt-se-sw-br))
126
- )
127
- var(
128
- --_ctm-mob-dn-dt-se-sw-sd,
129
- var(--_ctm-tab-dn-dt-se-sw-sd, var(--_ctm-dn-dt-se-sw-sd))
130
- )
131
- var(
132
- --_ctm-mob-dn-dt-se-sw-cr,
133
- var(--_ctm-tab-dn-dt-se-sw-cr, var(--_ctm-dn-dt-se-sw-cr))
134
- )
135
- )
136
- )
137
- );
138
- }
48
+ &:is([data-gradient-type="Linear Gradient"] > *).wrapper {
49
+ background-image: linear-gradient(var(--_sf-buyfo-gradient-angle),
50
+ var(--_sf-buyfo-gradient-start-color) var(--_sf-buyfo-gradient-start-position),
51
+ var(--_sf-buyfo-gradient-end-color) var(--_sf-buyfo-gradient-end-position));
139
52
  }
53
+
54
+ &:is([data-gradient-type="Radial Gradient"] > *).wrapper {
55
+ background-image: radial-gradient(circle at var(--_sf-buyfo-gradient-position),
56
+ var(--_sf-buyfo-gradient-start-color) var(--_sf-buyfo-gradient-start-position),
57
+ var(--_sf-buyfo-gradient-end-color) var(--_sf-buyfo-gradient-end-position));
58
+ }
59
+
60
+ &:is([data-background-type="image"] > *).wrapper {
61
+ background-image: prepareMediaVariable(--_ctm-buyfo-dn-bd-ie);
62
+ background-attachment: prepareMediaVariable(--_ctm-buyfo-dn-bd-at);
63
+ background-position: prepareMediaVariable(--_ctm-buyfo-dn-bd-pn);
64
+ background-position-y: prepareMediaVariable(--_ctm-buyfo-dn-bd-pn-y);
65
+ background-repeat: prepareMediaVariable(--_ctm-buyfo-dn-bd-rt);
66
+ background-size: prepareMediaVariable(--_ctm-buyfo-dn-bd-se);
67
+ }
68
+
69
+ // background-color: var(
70
+ // --_ctm-mob-buyfo-dn-bd-cr,
71
+ // var(--_ctm-tab-buyfo-dn-bd-cr, var(--_ctm-buyfo-dn-bd-cr))
72
+ // );
73
+ // background-image: var(
74
+ // --_ctm-mob-buyfo-dn-bd-ie,
75
+ // var(--_ctm-tab-buyfo-dn-bd-ie, var(--_ctm-buyfo-dn-bd-ie))
76
+ // );
77
+ // background-attachment: var(
78
+ // --_ctm-mob-buyfo-dn-bd-at,
79
+ // var(--_ctm-tab-buyfo-dn-bd-at, var(--_ctm-buyfo-dn-bd-at))
80
+ // );
81
+ // background-position: var(
82
+ // --_ctm-mob-buyfo-dn-bd-pn,
83
+ // var(--_ctm-tab-buyfo-dn-bd-pn, var(--_ctm-buyfo-dn-bd-pn))
84
+ // );
85
+ // background-repeat: var(
86
+ // --_ctm-mob-buyfo-dn-bd-rt,
87
+ // var(--_ctm-tab-buyfo-dn-bd-rt, var(--_ctm-buyfo-dn-bd-rt))
88
+ // );
89
+ // background-size: var(
90
+ // --_ctm-mob-buyfo-dn-bd-se,
91
+ // var(--_ctm-tab-buyfo-dn-bd-se, var(--_ctm-buyfo-dn-bd-se))
92
+ // );
93
+ border-radius: var(--_ctm-mob-buyfo-dn-br-rs,
94
+ var(--_ctm-tab-buyfo-dn-br-rs, var(--_ctm-buyfo-dn-br-rs)));
95
+ border-color: var(--_ctm-mob-buyfo-dn-br-cr,
96
+ var(--_ctm-tab-buyfo-dn-br-cr, var(--_ctm-buyfo-dn-br-cr)));
97
+ border-style: var(--_ctm-mob-buyfo-dn-br-se,
98
+ var(--_ctm-tab-buyfo-dn-br-se, var(--_ctm-buyfo-dn-br-se)));
99
+ border-width: var(--_ctm-mob-buyfo-dn-br-wh,
100
+ var(--_ctm-tab-buyfo-dn-br-wh, var(--_ctm-buyfo-dn-br-wh)));
101
+ box-shadow: var(--_hover-show-shadow,
102
+ var(--_sf-hr-bx-sw,
103
+ var(--_show-shadow,
104
+ var(--_ctm-mob-dn-dt-se-sw-ae,
105
+ var(--_ctm-tab-dn-dt-se-sw-ae, var(--_ctm-dn-dt-se-sw-ae))) var(--_ctm-mob-dn-dt-se-sw-br,
106
+ var(--_ctm-tab-dn-dt-se-sw-br, var(--_ctm-dn-dt-se-sw-br))) var(--_ctm-mob-dn-dt-se-sw-sd,
107
+ var(--_ctm-tab-dn-dt-se-sw-sd, var(--_ctm-dn-dt-se-sw-sd))) var(--_ctm-mob-dn-dt-se-sw-cr,
108
+ var(--_ctm-tab-dn-dt-se-sw-cr, var(--_ctm-dn-dt-se-sw-cr))))));
140
109
  }
141
110
  }
111
+ }
112
+ }