@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
@@ -4,35 +4,36 @@
4
4
 
5
5
  [data-div-type="element"] {
6
6
  &[data-element-type="productLabels"] {
7
- width: var(
8
- --_sf-el-wh-st-mx,
9
- calc(
10
- 1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
11
- )
12
- );
7
+ width: var(--_sf-el-wh-st-mx,
8
+ calc(1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))));
13
9
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
14
10
 
15
- & > .wrapper {
11
+ &>.wrapper {
16
12
  width: 100%;
17
13
  }
14
+
18
15
  &[data-show-shadow="false"] {
19
16
  --_show-shadow: none;
20
17
  }
18
+
21
19
  &[data-overflow-items="Scroll"] {
22
20
  .horizontal {
23
21
  width: 100%;
24
22
  overflow-x: auto;
23
+
25
24
  // Keep label chips at their natural (admin-styled) width; only prevent
26
25
  // them from squishing in a horizontal scroll row.
27
26
  .item {
28
27
  flex-shrink: 0;
29
28
  }
30
29
  }
30
+
31
31
  .vertical {
32
32
  overflow-y: auto;
33
33
  max-height: 30%;
34
34
  }
35
35
  }
36
+
36
37
  .text-element {
37
38
  color: #333;
38
39
  font-size: 12px;
@@ -41,41 +42,28 @@
41
42
  line-height: 18px;
42
43
  margin-bottom: 6px;
43
44
  }
45
+
44
46
  .labels__container {
45
- background-color: var(
46
- --_ctm-mob-dn-wt-se-bd-cr,
47
- var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr))
48
- );
49
-
50
- border-color: var(
51
- --_ctm-mob-dn-wt-se-br-cr,
52
- var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr))
53
- );
54
-
55
- border-style: var(
56
- --_ctm-mob-dn-wt-se-br-se,
57
- var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se))
58
- );
59
-
60
- border-width: var(
61
- --_ctm-mob-dn-wt-se-br-wh,
62
- var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh))
63
- );
64
-
65
- border-radius: var(
66
- --_ctm-mob-dn-wt-se-br-rs,
67
- var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs))
68
- );
69
-
70
- box-shadow: var(
71
- --_show-shadow,
72
- var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae)))
73
- var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br)))
74
- var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd)))
75
- var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr)))
76
- );
47
+ background-color: var(--_ctm-mob-dn-wt-se-bd-cr,
48
+ var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr)));
49
+
50
+ border-color: var(--_ctm-mob-dn-wt-se-br-cr,
51
+ var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr)));
52
+
53
+ border-style: var(--_ctm-mob-dn-wt-se-br-se,
54
+ var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se)));
55
+
56
+ border-width: var(--_ctm-mob-dn-wt-se-br-wh,
57
+ var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh)));
58
+
59
+ border-radius: var(--_ctm-mob-dn-wt-se-br-rs,
60
+ var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs)));
61
+
62
+ box-shadow: var(--_show-shadow,
63
+ var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae))) var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br))) var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd))) var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr))));
77
64
 
78
65
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
66
+
79
67
  .stack {
80
68
  display: flex;
81
69
  flex-direction: column;
@@ -89,46 +77,48 @@
89
77
  position: relative;
90
78
  display: inline-flex;
91
79
  }
80
+
92
81
  .items__container {
93
82
  &[data-show-divider="true"] {
94
83
  &[data-flex-direction="row"] {
84
+
85
+ // The divider is a pseudo-element and takes no space of its own, so a thick
86
+ // one grew back over the label beside it — see dividerGapReserve in functions.scss.
87
+ .item:not(:last-child) {
88
+ @include dividerGapReserve(--_ctm-dn-wt-se-dr-wt, right);
89
+ }
90
+
95
91
  .item:not(:last-child)::before {
96
92
  content: "";
97
93
  position: absolute;
98
94
  top: 0;
99
- bottom: 0; /* For full height divider */
100
- right: calc(
101
- -1 *
102
- (var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2)
103
- ); /* Half of your gap + 1px offset */
104
- width: var(
105
- --_ctm-mob-dn-wt-se-dr-wt,
106
- var(--_ctm-tab-dn-wt-se-dr-wt, var(--_ctm-dn-wt-se-dr-wt))
107
- ); /* Divider thickness */
108
- background-color: var(
109
- --_ctm-mob-dn-wt-se-dr-cr,
110
- var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr))
111
- ); /* Divider color */
95
+ bottom: 0;
96
+ /* For full height divider */
97
+ right: dividerGapOffset(--_ctm-lt-im-sg, --_ctm-dn-wt-se-dr-wt);
98
+ width: var(--_ctm-mob-dn-wt-se-dr-wt,
99
+ var(--_ctm-tab-dn-wt-se-dr-wt, var(--_ctm-dn-wt-se-dr-wt)));
100
+ /* Divider thickness */
101
+ background-color: var(--_ctm-mob-dn-wt-se-dr-cr,
102
+ var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr)));
103
+ /* Divider color */
112
104
  }
113
105
  }
106
+
114
107
  &[data-flex-direction="column"] {
108
+ .item:not(:last-child) {
109
+ @include dividerGapReserve(--_ctm-dn-wt-se-dr-wt);
110
+ }
111
+
115
112
  .item:not(:last-child)::before {
116
113
  content: "";
117
114
  position: absolute;
118
115
  left: 0;
119
116
  right: 0;
120
- bottom: calc(
121
- -1 *
122
- (var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2)
123
- );
124
- height: var(
125
- --_ctm-mob-dn-wt-se-dr-wt,
126
- var(--_ctm-tab-dn-wt-se-dr-wt, var(--_ctm-dn-wt-se-dr-wt))
127
- );
128
- background-color: var(
129
- --_ctm-mob-dn-wt-se-dr-cr,
130
- var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr))
131
- );
117
+ bottom: dividerGapOffset(--_ctm-lt-im-sg, --_ctm-dn-wt-se-dr-wt);
118
+ height: var(--_ctm-mob-dn-wt-se-dr-wt,
119
+ var(--_ctm-tab-dn-wt-se-dr-wt, var(--_ctm-dn-wt-se-dr-wt)));
120
+ background-color: var(--_ctm-mob-dn-wt-se-dr-cr,
121
+ var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr)));
132
122
  }
133
123
  }
134
124
  }
@@ -137,55 +127,35 @@
137
127
  .title {
138
128
  white-space: nowrap;
139
129
  color: var(--_ctm-mob-dn-wt-se-cr, var(--_ctm-tab-dn-wt-se-cr, var(--_ctm-dn-wt-se-cr)));
140
- font-family: var(
141
- --_ctm-mob-dn-wt-se-ft-fy,
142
- var(--_ctm-tab-dn-wt-se-ft-fy, var(--_ctm-dn-wt-se-ft-fy))
143
- );
144
- text-transform: var(
145
- --_ctm-mob-dn-wt-se-tt-tm,
146
- var(--_ctm-tab-dn-wt-se-tt-tm, var(--_ctm-dn-wt-se-tt-tm))
147
- );
148
- word-wrap: var(
149
- --_ctm-mob-dn-wt-se-wd-wp,
150
- var(--_ctm-tab-dn-wt-se-wd-wp, var(--_ctm-dn-wt-se-wd-wp))
151
- );
152
- word-break: var(
153
- --_ctm-mob-dn-wt-se-wd-bk,
154
- var(--_ctm-tab-dn-wt-se-wd-bk, var(--_ctm-dn-wt-se-wd-bk))
155
- );
156
- font-size: var(
157
- --_ctm-mob-dn-wt-se-ft-se,
158
- var(--_ctm-tab-dn-wt-se-ft-se, var(--_ctm-dn-wt-se-ft-se))
159
- );
160
- font-weight: var(
161
- --_ctm-mob-dn-wt-se-ft-wt,
162
- var(--_ctm-tab-dn-wt-se-ft-wt, var(--_ctm-dn-wt-se-ft-wt))
163
- );
164
- font-style: var(
165
- --_ctm-mob-dn-wt-se-ft-se-ic,
166
- var(--_ctm-tab-dn-wt-se-ft-se-ic, var(--_ctm-dn-wt-se-ft-se-ic))
167
- );
168
- text-align: var(
169
- --_ctm-mob-dn-wt-se-tt-an,
170
- var(--_ctm-tab-dn-wt-se-tt-an, var(--_ctm-dn-wt-se-tt-an))
171
- );
172
- letter-spacing: var(
173
- --_ctm-mob-dn-wt-se-lr-sg,
174
- var(--_ctm-tab-dn-wt-se-lr-sg, var(--_ctm-dn-wt-se-lr-sg))
175
- );
176
- line-height: var(
177
- --_ctm-mob-dn-wt-se-le-ht,
178
- var(--_ctm-tab-dn-wt-se-le-ht, var(--_ctm-dn-wt-se-le-ht))
179
- );
180
- text-decoration: var(
181
- --_ctm-mob-dn-wt-se-ue,
182
- var(--_ctm-tab-dn-wt-se-ue, var(--_ctm-dn-wt-se-ue))
183
- );
130
+ font-family: var(--_ctm-mob-dn-wt-se-ft-fy,
131
+ var(--_ctm-tab-dn-wt-se-ft-fy, var(--_ctm-dn-wt-se-ft-fy)));
132
+ text-transform: var(--_ctm-mob-dn-wt-se-tt-tm,
133
+ var(--_ctm-tab-dn-wt-se-tt-tm, var(--_ctm-dn-wt-se-tt-tm)));
134
+ word-wrap: var(--_ctm-mob-dn-wt-se-wd-wp,
135
+ var(--_ctm-tab-dn-wt-se-wd-wp, var(--_ctm-dn-wt-se-wd-wp)));
136
+ word-break: var(--_ctm-mob-dn-wt-se-wd-bk,
137
+ var(--_ctm-tab-dn-wt-se-wd-bk, var(--_ctm-dn-wt-se-wd-bk)));
138
+ font-size: var(--_ctm-mob-dn-wt-se-ft-se,
139
+ var(--_ctm-tab-dn-wt-se-ft-se, var(--_ctm-dn-wt-se-ft-se)));
140
+ font-weight: var(--_ctm-mob-dn-wt-se-ft-wt,
141
+ var(--_ctm-tab-dn-wt-se-ft-wt, var(--_ctm-dn-wt-se-ft-wt)));
142
+ font-style: var(--_ctm-mob-dn-wt-se-ft-se-ic,
143
+ var(--_ctm-tab-dn-wt-se-ft-se-ic, var(--_ctm-dn-wt-se-ft-se-ic)));
144
+ text-align: var(--_ctm-mob-dn-wt-se-tt-an,
145
+ var(--_ctm-tab-dn-wt-se-tt-an, var(--_ctm-dn-wt-se-tt-an)));
146
+ letter-spacing: var(--_ctm-mob-dn-wt-se-lr-sg,
147
+ var(--_ctm-tab-dn-wt-se-lr-sg, var(--_ctm-dn-wt-se-lr-sg)));
148
+ line-height: var(--_ctm-mob-dn-wt-se-le-ht,
149
+ var(--_ctm-tab-dn-wt-se-le-ht, var(--_ctm-dn-wt-se-le-ht)));
150
+ text-decoration: var(--_ctm-mob-dn-wt-se-ue,
151
+ var(--_ctm-tab-dn-wt-se-ue, var(--_ctm-dn-wt-se-ue)));
184
152
  padding: prepareMediaVariable(--_ctm-dn-wt-se-pg);
185
153
  }
154
+
186
155
  .horizontal {
187
156
  display: flex;
188
157
  gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, 10px)));
158
+
189
159
  .item {
190
160
  flex-shrink: 0;
191
161
  }
@@ -193,10 +163,12 @@
193
163
  &[data-overflow-items="Wrap"] {
194
164
  flex-wrap: wrap;
195
165
  }
166
+
196
167
  &[data-overflow-items="Scroll"] {
197
168
  width: 100%;
198
169
  overflow-x: auto;
199
170
  }
171
+
200
172
  &[data-overflow-items="Hidden"] {
201
173
  overflow-x: hidden;
202
174
  }
@@ -204,13 +176,16 @@
204
176
  &[items-content-alignement="right"] {
205
177
  justify-content: flex-end;
206
178
  }
179
+
207
180
  &[items-content-alignement="left"] {
208
181
  justify-content: flex-start;
209
182
  }
183
+
210
184
  &[items-content-alignement="center"] {
211
185
  justify-content: center;
212
186
  }
213
187
  }
188
+
214
189
  .vertical {
215
190
  display: flex;
216
191
  flex-direction: column;
@@ -220,6 +195,7 @@
220
195
  &[data-overflow-items="Scroll"] {
221
196
  overflow-y: auto;
222
197
  }
198
+
223
199
  &[data-overflow-items="Hidden"] {
224
200
  overflow-y: hidden;
225
201
  }
@@ -227,32 +203,37 @@
227
203
  &[items-content-alignement="right"] {
228
204
  align-items: flex-end;
229
205
  }
206
+
230
207
  &[items-content-alignement="left"] {
231
208
  align-items: flex-start;
232
209
  }
210
+
233
211
  &[items-content-alignement="center"] {
234
212
  align-items: center;
235
213
  }
236
214
  }
215
+
237
216
  .grid {
238
217
  display: grid;
239
218
  grid-template-columns: repeat(var(--_ctm-lt-is-pr-rw), minmax(auto, 1fr));
240
- grid-template-columns: repeat(
241
- var(--_ctm-mob-lt-is-pr-rw, var(--_ctm-tab-lt-is-pr-rw, var(--_ctm-lt-is-pr-rw))),
242
- minmax(auto, 1fr)
243
- );
219
+ grid-template-columns: repeat(var(--_ctm-mob-lt-is-pr-rw, var(--_ctm-tab-lt-is-pr-rw, var(--_ctm-lt-is-pr-rw))),
220
+ minmax(auto, 1fr));
244
221
  // Keep admin-styled chips at their natural size instead of stretching
245
222
  // them to fill the grid cell.
246
223
  justify-items: start;
247
224
  gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, 10px)));
248
225
  max-height: prepareMediaVariable(--_ctm-lt-mx-cr-ht);
226
+
249
227
  &[data-overflow-items="Scroll"] {
250
228
  overflow-y: auto;
251
229
  }
230
+
252
231
  &[data-overflow-items="Hidden"] {
253
232
  overflow-y: hidden;
254
233
  }
234
+
255
235
  margin: 0px;
236
+
256
237
  .item {
257
238
  width: auto;
258
239
  }
@@ -260,4 +241,4 @@
260
241
  }
261
242
  }
262
243
  }
263
- }
244
+ }