@sc-360-v2/storefront-cms-library 0.5.72 → 0.5.73

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 (124) hide show
  1. package/dist/add-existing-form.scss +13 -5
  2. package/dist/add-order.scss +126 -236
  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 +189 -407
  6. package/dist/allocationDetails.scss +1661 -2143
  7. package/dist/allocations-quota-details.scss +159 -323
  8. package/dist/allocations.scss +475 -793
  9. package/dist/amount-estimator.scss +405 -743
  10. package/dist/badge.scss +43 -18
  11. package/dist/brand-basic-elements.scss +76 -124
  12. package/dist/brand.scss +28 -55
  13. package/dist/breadcrumbs.scss +356 -718
  14. package/dist/builder.js +1 -1
  15. package/dist/bulk-variant-picker.scss +1128 -2027
  16. package/dist/bundle.scss +841 -1477
  17. package/dist/bundleDetails.scss +3774 -5072
  18. package/dist/button.scss +79 -103
  19. package/dist/buy-for-tab-container.scss +77 -106
  20. package/dist/buyForHeaders.scss +1722 -2976
  21. package/dist/cart-details.scss +481 -1012
  22. package/dist/cart-summary.scss +557 -1149
  23. package/dist/cart-wrapper.scss +37 -79
  24. package/dist/cart.scss +117 -225
  25. package/dist/cartAttributes.scss +416 -735
  26. package/dist/category-groups-element.scss +127 -108
  27. package/dist/category-groups-product-grid.scss +120 -147
  28. package/dist/category-groups-product-image.scss +1162 -1457
  29. package/dist/category-groups-product-options.scss +613 -680
  30. package/dist/category-groups-product-price.scss +1966 -3244
  31. package/dist/category-groups-quota-details.scss +210 -464
  32. package/dist/category.scss +26 -50
  33. package/dist/checkout.scss +24 -16
  34. package/dist/confirm-modal.scss +22 -2
  35. package/dist/container.scss +32 -54
  36. package/dist/countdown.scss +255 -443
  37. package/dist/coupon.scss +351 -710
  38. package/dist/default-dropdown.scss +12 -1
  39. package/dist/embroider-template-1-v2.scss +123 -172
  40. package/dist/embroider-template-1.scss +68 -104
  41. package/dist/embroidery.scss +30 -31
  42. package/dist/employee-bulk-order.scss +418 -142
  43. package/dist/faq.scss +228 -408
  44. package/dist/filter-results.scss +125 -265
  45. package/dist/filters.scss +900 -1797
  46. package/dist/gallery-slider-temp.scss +432 -750
  47. package/dist/global-styles.scss +218 -198
  48. package/dist/grid.scss +25 -33
  49. package/dist/hotspot.scss +68 -115
  50. package/dist/image-temp.scss +21 -20
  51. package/dist/item-stock.scss +9 -16
  52. package/dist/kitDetails.scss +2719 -4299
  53. package/dist/kits.scss +24 -19
  54. package/dist/language-selector.scss +211 -361
  55. package/dist/last-x-orders.scss +95 -174
  56. package/dist/layouter-item.scss +75 -103
  57. package/dist/layouter-pro-item.scss +89 -95
  58. package/dist/layouter-pro.scss +87 -92
  59. package/dist/layouter.scss +383 -445
  60. package/dist/light-box-v2.scss +89 -104
  61. package/dist/login.scss +287 -566
  62. package/dist/map.scss +221 -368
  63. package/dist/marchandiserSets.scss +95 -104
  64. package/dist/mega-menu-container.scss +96 -109
  65. package/dist/mega-menu.scss +624 -731
  66. package/dist/menu-item.scss +2 -2
  67. package/dist/menu-v2.scss +507 -619
  68. package/dist/multi-select-dropdown.scss +27 -3
  69. package/dist/my-templates.scss +38 -9
  70. package/dist/option-bar.scss +215 -375
  71. package/dist/order-status.scss +646 -1117
  72. package/dist/overflow-module.scss +6 -7
  73. package/dist/past-orders.scss +118 -149
  74. package/dist/payment-methods.scss +46 -30
  75. package/dist/pickup-locations.scss +558 -1118
  76. package/dist/position-module.scss +20 -17
  77. package/dist/prefix-list.scss +21 -10
  78. package/dist/product-actions.scss +1750 -2055
  79. package/dist/product-basic-elements.scss +108 -169
  80. package/dist/product-highlights.scss +107 -152
  81. package/dist/product-image-bundles.scss +337 -642
  82. package/dist/product-inventory.scss +673 -1357
  83. package/dist/product-labels.scss +84 -105
  84. package/dist/product-options.scss +1117 -1274
  85. package/dist/product-price.scss +1283 -2561
  86. package/dist/product-promotions.scss +1388 -2830
  87. package/dist/product-sizechart.scss +516 -905
  88. package/dist/product.scss +28 -61
  89. package/dist/productDetails.scss +19 -39
  90. package/dist/profile.scss +207 -447
  91. package/dist/quantity-selector.scss +837 -1074
  92. package/dist/quick-inventory-check.scss +95 -174
  93. package/dist/quick-links.scss +55 -133
  94. package/dist/quick-order-pad.scss +218 -271
  95. package/dist/quota-details.scss +152 -282
  96. package/dist/quotes.scss +89 -122
  97. package/dist/repeater-embla-controls.scss +35 -15
  98. package/dist/repeater-grid-toggle.scss +156 -166
  99. package/dist/repeater-item.scss +41 -64
  100. package/dist/repeater.scss +671 -814
  101. package/dist/request-for-quotes.scss +66 -16
  102. package/dist/responsive-behaviour.scss +3 -1
  103. package/dist/rfqs.scss +118 -181
  104. package/dist/scroll.scss +93 -172
  105. package/dist/search.scss +179 -326
  106. package/dist/section.scss +27 -51
  107. package/dist/shipping-payments.scss +198 -58
  108. package/dist/simple-list.scss +74 -164
  109. package/dist/social.scss +80 -145
  110. package/dist/sort.scss +11 -19
  111. package/dist/stack.scss +23 -34
  112. package/dist/static-global.scss +44 -26
  113. package/dist/stockStatus.scss +11 -19
  114. package/dist/store-locations.scss +577 -1105
  115. package/dist/tab-container.scss +81 -108
  116. package/dist/table-common.scss +217 -408
  117. package/dist/table.scss +271 -502
  118. package/dist/text-temp.scss +8 -7
  119. package/dist/theme-classes.scss +17 -13
  120. package/dist/uom-selector.scss +489 -949
  121. package/dist/user-elements.scss +529 -837
  122. package/dist/variant-picker.scss +1281 -2555
  123. package/dist/volume-pricing.scss +541 -1037
  124. package/package.json +1 -1
package/dist/button.scss CHANGED
@@ -13,11 +13,12 @@
13
13
  color: #c62828;
14
14
  white-space: normal;
15
15
  }
16
+
16
17
  [data-div-type="element"] {
17
18
  &[data-element-type="button"] {
18
19
  min-height: 24px !important;
19
20
 
20
- & > .wrapper {
21
+ &>.wrapper {
21
22
  // width: 100%;
22
23
  height: 100%;
23
24
  height: var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht))) !important;
@@ -26,136 +27,98 @@
26
27
  &[data-show-shadow="false"] {
27
28
  --_show-shadow: none;
28
29
  }
30
+
29
31
  &[data-icon-position="left"] {
30
32
  --_sf-fd-bn: row;
31
33
  }
34
+
32
35
  &[data-icon-position="right"] {
33
36
  --_sf-fd-bn: row-reverse;
34
37
  }
38
+
35
39
  &[data-icon-position="center"] {
36
40
  --_sf-fd-bn: row;
37
41
  }
38
42
 
39
43
  &:hover {
40
- --_sf-hr-bd-cr: var(
41
- --_ctm-mob-dn-hr-se-bd-cr,
42
- var(--_ctm-tab-dn-hr-se-bd-cr, var(--_ctm-dn-hr-se-bd-cr))
43
- );
44
- --_sf-hr-br-cr: var(
45
- --_ctm-mob-dn-hr-se-br-cr,
46
- var(--_ctm-tab-dn-hr-se-br-cr, var(--_ctm-dn-hr-se-br-cr))
47
- );
48
- --_sf-hr-br-se: var(
49
- --_ctm-mob-dn-hr-se-br-se,
50
- var(--_ctm-tab-dn-hr-se-br-se, var(--_ctm-dn-hr-se-br-se))
51
- );
52
- --_sf-hr-br-wh: var(
53
- --_ctm-mob-dn-hr-se-br-wh,
54
- var(--_ctm-tab-dn-hr-se-br-wh, var(--_ctm-dn-hr-se-br-wh))
55
- );
56
- --_sf-hr-br-rs: var(
57
- --_ctm-mob-dn-hr-se-br-rs,
58
- var(--_ctm-tab-dn-hr-se-br-rs, var(--_ctm-dn-hr-se-br-rs))
59
- );
44
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-hr-se-bd-cr,
45
+ var(--_ctm-tab-dn-hr-se-bd-cr, var(--_ctm-dn-hr-se-bd-cr)));
46
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-hr-se-br-cr,
47
+ var(--_ctm-tab-dn-hr-se-br-cr, var(--_ctm-dn-hr-se-br-cr)));
48
+ --_sf-hr-br-se: var(--_ctm-mob-dn-hr-se-br-se,
49
+ var(--_ctm-tab-dn-hr-se-br-se, var(--_ctm-dn-hr-se-br-se)));
50
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-hr-se-br-wh,
51
+ var(--_ctm-tab-dn-hr-se-br-wh, var(--_ctm-dn-hr-se-br-wh)));
52
+ --_sf-hr-br-rs: var(--_ctm-mob-dn-hr-se-br-rs,
53
+ var(--_ctm-tab-dn-hr-se-br-rs, var(--_ctm-dn-hr-se-br-rs)));
60
54
 
61
55
  // for shadow
62
- --_sf-hr-sw-ae: var(
63
- --_ctm-mob-dn-hr-se-sw-ae,
64
- var(--_ctm-tab-dn-hr-se-sw-ae, var(--_ctm-dn-hr-se-sw-ae))
65
- );
66
- --_sf-hr-sw-br: var(
67
- --_ctm-mob-dn-hr-se-sw-br,
68
- var(--_ctm-tab-dn-hr-se-sw-br, var(--_ctm-dn-hr-se-sw-br))
69
- );
70
-
71
- --_sf-hr-sw-cr: var(
72
- --_ctm-mob-dn-hr-se-sw-cr,
73
- var(--_ctm-tab-dn-hr-se-sw-cr, var(--_ctm-dn-hr-se-sw-cr))
74
- );
56
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-hr-se-sw-ae,
57
+ var(--_ctm-tab-dn-hr-se-sw-ae, var(--_ctm-dn-hr-se-sw-ae)));
58
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-hr-se-sw-br,
59
+ var(--_ctm-tab-dn-hr-se-sw-br, var(--_ctm-dn-hr-se-sw-br)));
60
+
61
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-hr-se-sw-cr,
62
+ var(--_ctm-tab-dn-hr-se-sw-cr, var(--_ctm-dn-hr-se-sw-cr)));
75
63
 
76
64
  // for font
77
65
 
78
- --_sf-hr-cr: var(
79
- --_ctm-mob-dn-hr-se-cr,
80
- var(--_ctm-tab-dn-hr-se-cr, var(--_ctm-dn-hr-se-cr))
81
- );
82
- --_sf-hr-ft-fy: var(
83
- --_ctm-mob-dn-hr-se-ft-fy,
84
- var(--_ctm-tab-dn-hr-se-ft-fy, var(--_ctm-dn-hr-se-ft-fy))
85
- );
86
- --_sf-hr-tt-tm: var(
87
- --_ctm-mob-dn-hr-se-tt-tm,
88
- var(--_ctm-tab-dn-hr-se-tt-tm, var(--_ctm-dn-hr-se-tt-tm))
89
- );
90
- --_sf-hr-ft-se: var(
91
- --_ctm-mob-dn-hr-se-ft-se,
92
- var(--_ctm-tab-dn-hr-se-ft-se, var(--_ctm-dn-hr-se-ft-se))
93
- );
94
- --_sf-hr-ft-wt: var(
95
- --_ctm-mob-dn-hr-se-ft-wt,
96
- var(--_ctm-tab-dn-hr-se-ft-wt, var(--_ctm-dn-hr-se-ft-wt))
97
- );
98
- --_sf-hr-ft-se-ic: var(
99
- --_ctm-mob-dn-hr-se-ft-se-ic,
100
- var(--_ctm-tab-dn-hr-se-ft-se-ic, var(--_ctm-dn-hr-se-ft-se-ic))
101
- );
102
- --_sf-hr-tt-an: var(
103
- --_ctm-mob-dn-hr-se-tt-an,
104
- var(--_ctm-tab-dn-hr-se-tt-an, var(--_ctm-dn-hr-se-tt-an))
105
- );
106
- --_sf-hr-lr-sg: var(
107
- --_ctm-mob-dn-hr-se-lr-sg,
108
- var(--_ctm-tab-dn-hr-se-lr-sg, var(--_ctm-dn-hr-se-lr-sg))
109
- );
110
- --_sf-hr-le-ht: var(
111
- --_ctm-mob-dn-hr-se-le-ht,
112
- var(--_ctm-tab-dn-hr-se-le-ht, var(--_ctm-dn-hr-se-le-ht))
113
- );
114
-
115
- --_sf-hr-txt-tr: var(
116
- --_ctm-mob-dn-hr-se-tt-tm,
117
- var(--_ctm-tab-dn-hr-se-tt-tm, var(--_ctm-dn-hr-se-tt-tm))
118
- );
119
- --_sf-hr-wd-wp: var(
120
- --_ctm-mob-dn-hr-se-wd-wp,
121
- var(--_ctm-tab-dn-hr-se-wd-wp, var(--_ctm-dn-hr-se-wd-wp))
122
- );
123
- --_sf-hr-wd-bk: var(
124
- --_ctm-mob-dn-hr-se-wd-bk,
125
- var(--_ctm-tab-dn-hr-se-wd-bk, var(--_ctm-dn-hr-se-wd-bk))
126
- );
127
-
128
- --_sf-hr-in-se: var(
129
- --_ctm-mob-dn-hr-se-in-se,
130
- var(--_ctm-tab-dn-hr-se-in-se, var(--_ctm-dn-hr-se-in-se))
131
- );
132
-
133
- --_sf-hr-in-c1: var(
134
- --_ctm-mob-dn-hr-se-in-c1,
135
- var(--_ctm-tab-dn-hr-se-in-c1, var(--_ctm-dn-hr-se-in-c1))
136
- );
137
- --_sf-hr-ue: var(
138
- --_ctm-mob-dn-hr-se-ue,
139
- var(--_ctm-tab-dn-hr-se-ue, var(--_ctm-dn-hr-se-ue))
140
- );
66
+ --_sf-hr-cr: var(--_ctm-mob-dn-hr-se-cr,
67
+ var(--_ctm-tab-dn-hr-se-cr, var(--_ctm-dn-hr-se-cr)));
68
+ --_sf-hr-ft-fy: var(--_ctm-mob-dn-hr-se-ft-fy,
69
+ var(--_ctm-tab-dn-hr-se-ft-fy, var(--_ctm-dn-hr-se-ft-fy)));
70
+ --_sf-hr-tt-tm: var(--_ctm-mob-dn-hr-se-tt-tm,
71
+ var(--_ctm-tab-dn-hr-se-tt-tm, var(--_ctm-dn-hr-se-tt-tm)));
72
+ --_sf-hr-ft-se: var(--_ctm-mob-dn-hr-se-ft-se,
73
+ var(--_ctm-tab-dn-hr-se-ft-se, var(--_ctm-dn-hr-se-ft-se)));
74
+ --_sf-hr-ft-wt: var(--_ctm-mob-dn-hr-se-ft-wt,
75
+ var(--_ctm-tab-dn-hr-se-ft-wt, var(--_ctm-dn-hr-se-ft-wt)));
76
+ --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-hr-se-ft-se-ic,
77
+ var(--_ctm-tab-dn-hr-se-ft-se-ic, var(--_ctm-dn-hr-se-ft-se-ic)));
78
+ --_sf-hr-tt-an: var(--_ctm-mob-dn-hr-se-tt-an,
79
+ var(--_ctm-tab-dn-hr-se-tt-an, var(--_ctm-dn-hr-se-tt-an)));
80
+ --_sf-hr-lr-sg: var(--_ctm-mob-dn-hr-se-lr-sg,
81
+ var(--_ctm-tab-dn-hr-se-lr-sg, var(--_ctm-dn-hr-se-lr-sg)));
82
+ --_sf-hr-le-ht: var(--_ctm-mob-dn-hr-se-le-ht,
83
+ var(--_ctm-tab-dn-hr-se-le-ht, var(--_ctm-dn-hr-se-le-ht)));
84
+
85
+ --_sf-hr-txt-tr: var(--_ctm-mob-dn-hr-se-tt-tm,
86
+ var(--_ctm-tab-dn-hr-se-tt-tm, var(--_ctm-dn-hr-se-tt-tm)));
87
+ --_sf-hr-wd-wp: var(--_ctm-mob-dn-hr-se-wd-wp,
88
+ var(--_ctm-tab-dn-hr-se-wd-wp, var(--_ctm-dn-hr-se-wd-wp)));
89
+ --_sf-hr-wd-bk: var(--_ctm-mob-dn-hr-se-wd-bk,
90
+ var(--_ctm-tab-dn-hr-se-wd-bk, var(--_ctm-dn-hr-se-wd-bk)));
91
+
92
+ --_sf-hr-in-se: var(--_ctm-mob-dn-hr-se-in-se,
93
+ var(--_ctm-tab-dn-hr-se-in-se, var(--_ctm-dn-hr-se-in-se)));
94
+
95
+ --_sf-hr-in-c1: var(--_ctm-mob-dn-hr-se-in-c1,
96
+ var(--_ctm-tab-dn-hr-se-in-c1, var(--_ctm-dn-hr-se-in-c1)));
97
+ --_sf-hr-ue: var(--_ctm-mob-dn-hr-se-ue,
98
+ var(--_ctm-tab-dn-hr-se-ue, var(--_ctm-dn-hr-se-ue)));
141
99
 
142
100
  &[data-hover-show-shadow="false"] {
143
101
  --_hover-show-shadow: none;
144
102
  }
103
+
145
104
  &[data-hover-show-icon="false"] {
146
105
  --_hover-show-icon: none;
147
106
  }
148
107
  }
108
+
149
109
  &[data-show-icon="false"] {
150
110
  --_show-icon: none;
151
111
  }
112
+
152
113
  &[data-element-style="Icon"] {
153
114
  &[data-icon-position="left"] {
154
115
  --_sf-jc: start;
155
116
  }
117
+
156
118
  &[data-icon-position="right"] {
157
119
  --_sf-jc: end;
158
120
  }
121
+
159
122
  &[data-icon-position="center"] {
160
123
  --_sf-jc: center;
161
124
  }
@@ -177,10 +140,7 @@
177
140
 
178
141
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-dt-se-br-rs));
179
142
 
180
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-dt-se-sw-ae))
181
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-dt-se-sw-br))
182
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-dt-se-sw-sd))
183
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-dt-se-sw-cr));
143
+ 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));
184
144
 
185
145
  &[data-show-border="true"] {
186
146
  border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-dt-se-br-cr));
@@ -196,6 +156,7 @@
196
156
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-dt-se-cr));
197
157
 
198
158
  font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-dt-se-ft-fy));
159
+
199
160
  &.flex__overflow {
200
161
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
201
162
  }
@@ -227,6 +188,7 @@
227
188
 
228
189
  .icon {
229
190
  display: var(--_hover-show-icon, var(--_show-icon, flex));
191
+
230
192
  svg {
231
193
  width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-dt-se-in-se));
232
194
  height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-dt-se-in-se));
@@ -238,6 +200,7 @@
238
200
  }
239
201
  }
240
202
  }
203
+
241
204
  [data-element-style="Text"] {
242
205
  display: inline-block;
243
206
  width: 100%;
@@ -270,29 +233,35 @@
270
233
  align-items: center;
271
234
  border-radius: 4px;
272
235
  gap: 8px;
273
- & > span {
236
+
237
+ &>span {
274
238
  display: flex;
275
239
  }
276
240
 
277
241
  &.btn__sm {
278
242
  padding-inline: 16px;
279
243
  font-size: 14px;
244
+
280
245
  svg {
281
246
  width: 16px;
282
247
  height: 16px;
283
248
  }
284
249
  }
250
+
285
251
  &.btn__md {
286
252
  padding-inline: 24px;
287
253
  font-size: 18px;
254
+
288
255
  svg {
289
256
  width: 20px;
290
257
  height: 20px;
291
258
  }
292
259
  }
260
+
293
261
  &.btn__lg {
294
262
  padding-inline: 32px;
295
263
  font-size: 24px;
264
+
296
265
  svg {
297
266
  width: 24px;
298
267
  height: 24px;
@@ -308,27 +277,34 @@
308
277
  color: var(--_base-white);
309
278
  }
310
279
  }
280
+
311
281
  &.secondary {
312
282
  background-color: var(--_gray-100);
313
283
  color: var(--_gray-700);
284
+
314
285
  &:hover {
315
286
  background-color: var(--_gray-200);
316
287
  color: var(--_gray-900);
317
288
  }
318
289
  }
290
+
319
291
  &.tertiary {
320
292
  background-color: transparent;
293
+
321
294
  &.primary__txt {
322
295
  color: var(--_primary-400);
296
+
323
297
  &:hover {
324
298
  color: var(--_primary-500);
325
299
  }
326
300
  }
301
+
327
302
  &.secondary__txt {
328
303
  color: var(--_gray-700);
304
+
329
305
  &:hover {
330
306
  color: var(--_gray-900);
331
307
  }
332
308
  }
333
309
  }
334
- }
310
+ }
@@ -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
+ }