@sc-360-v2/storefront-cms-library 0.5.53 → 0.5.55

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 (106) hide show
  1. package/dist/add-products-tab-details.scss +3 -0
  2. package/dist/allocation-header-quota-details.scss +520 -0
  3. package/dist/allocationDetails.scss +617 -644
  4. package/dist/allocations-quota-details.scss +454 -0
  5. package/dist/allocations.scss +8 -0
  6. package/dist/amount-estimator.scss +1088 -1083
  7. package/dist/badge.scss +396 -388
  8. package/dist/breadcrumbs.scss +17 -0
  9. package/dist/builder.js +1 -1
  10. package/dist/bulk-variant-picker.scss +4 -0
  11. package/dist/bundle copy.scss +26 -0
  12. package/dist/bundle.scss +10 -0
  13. package/dist/bundleDetails.scss +14 -0
  14. package/dist/button copy.scss +2 -0
  15. package/dist/button.scss +2 -0
  16. package/dist/buyForHeaders.scss +19 -0
  17. package/dist/cart-details.scss +101 -18
  18. package/dist/cart-summary.scss +18 -0
  19. package/dist/cart.scss +2 -0
  20. package/dist/cartAttributes.scss +4 -0
  21. package/dist/category-groups-quota-details.scss +124 -38
  22. package/dist/checkout.scss +6 -0
  23. package/dist/countdown.scss +2 -0
  24. package/dist/coupon.scss +8 -0
  25. package/dist/embroidery.scss +2 -0
  26. package/dist/employee-bulk-order.scss +5 -0
  27. package/dist/faq.scss +9 -0
  28. package/dist/filters.scss +2 -0
  29. package/dist/form-zindex-module.scss +24 -24
  30. package/dist/gallery-slider-temp.scss +205 -14
  31. package/dist/hotspot.scss +5 -1
  32. package/dist/icon-list.scss +2 -0
  33. package/dist/kitDetails.scss +2 -0
  34. package/dist/kits.scss +2 -0
  35. package/dist/language-selector.scss +2 -0
  36. package/dist/last-x-orders.scss +5 -0
  37. package/dist/login.scss +63 -9
  38. package/dist/map.scss +6 -0
  39. package/dist/mega-menu.scss +41 -0
  40. package/dist/menu-v2.scss +83 -6
  41. package/dist/order-status.scss +228 -136
  42. package/dist/past-orders.scss +989 -975
  43. package/dist/pickup-locations.scss +1172 -1167
  44. package/dist/product-image-allocation.scss +59 -0
  45. package/dist/product-inventory.scss +1381 -1378
  46. package/dist/product-promotions.scss +2768 -2759
  47. package/dist/product-sizechart.scss +4 -0
  48. package/dist/profile.scss +8 -0
  49. package/dist/quantity-selector.scss +4 -0
  50. package/dist/quick-inventory-check.scss +5 -0
  51. package/dist/quick-order-pad.scss +5 -0
  52. package/dist/quota-details.scss +99 -15
  53. package/dist/repeater copy.scss +3 -0
  54. package/dist/repeater-grid-toggle.scss +2 -0
  55. package/dist/repeater.scss +2 -0
  56. package/dist/rfqs.scss +10 -0
  57. package/dist/scroll.scss +46 -0
  58. package/dist/search.scss +4 -0
  59. package/dist/shipping-payments.scss +4 -0
  60. package/dist/social.scss +5 -0
  61. package/dist/store-locations.scss +1402 -1398
  62. package/dist/tab-v2.scss +2 -0
  63. package/dist/table-common.scss +509 -506
  64. package/dist/table.scss +687 -685
  65. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +28 -0
  66. package/dist/types/builder/tools/element-edit/allocationDetails.d.ts +5 -0
  67. package/dist/types/builder/tools/element-edit/allocations.d.ts +1 -0
  68. package/dist/types/builder/tools/element-edit/breadcrumbs.d.ts +5 -0
  69. package/dist/types/builder/tools/element-edit/bundle.d.ts +40 -0
  70. package/dist/types/builder/tools/element-edit/bundleDetails.d.ts +20 -0
  71. package/dist/types/builder/tools/element-edit/buttonInstance.d.ts +18 -0
  72. package/dist/types/builder/tools/element-edit/buyForWithTab.d.ts +1 -0
  73. package/dist/types/builder/tools/element-edit/cartAttributes.d.ts +9 -0
  74. package/dist/types/builder/tools/element-edit/cartDetails.d.ts +79 -1
  75. package/dist/types/builder/tools/element-edit/cartSummary.d.ts +259 -0
  76. package/dist/types/builder/tools/element-edit/categoryGroups.d.ts +28 -0
  77. package/dist/types/builder/tools/element-edit/checkout.d.ts +1 -0
  78. package/dist/types/builder/tools/element-edit/common.d.ts +23 -0
  79. package/dist/types/builder/tools/element-edit/countdown.d.ts +1 -0
  80. package/dist/types/builder/tools/element-edit/coupon.d.ts +19 -0
  81. package/dist/types/builder/tools/element-edit/embroidery.d.ts +9 -0
  82. package/dist/types/builder/tools/element-edit/filterResults.d.ts +10 -0
  83. package/dist/types/builder/tools/element-edit/gallery-slider.d.ts +19 -0
  84. package/dist/types/builder/tools/element-edit/icon-list.d.ts +31 -0
  85. package/dist/types/builder/tools/element-edit/iconInstace.d.ts +1 -0
  86. package/dist/types/builder/tools/element-edit/iconLibrary.d.ts +2 -7
  87. package/dist/types/builder/tools/element-edit/kitDetails.d.ts +19 -0
  88. package/dist/types/builder/tools/element-edit/kits.d.ts +9 -0
  89. package/dist/types/builder/tools/element-edit/language-menu.d.ts +0 -1
  90. package/dist/types/builder/tools/element-edit/orderStatus.d.ts +320 -168
  91. package/dist/types/builder/tools/element-edit/quickLinks.d.ts +10 -0
  92. package/dist/types/builder/tools/element-edit/quotaDetails.d.ts +1 -0
  93. package/dist/types/builder/tools/element-edit/rfqs.d.ts +5 -0
  94. package/dist/types/builder/tools/element-edit/scroll.d.ts +1 -0
  95. package/dist/types/builder/tools/element-edit/shipping-payments.d.ts +2 -0
  96. package/dist/types/builder/tools/element-edit/social.d.ts +1 -0
  97. package/dist/types/builder/tools/element-edit/table.d.ts +1 -0
  98. package/dist/types/builder/tools/element-edit/tabs.d.ts +18 -0
  99. package/dist/types/builder/tools/element-edit/tabsV2.d.ts +17 -0
  100. package/dist/types/builder/tools/element-edit/userElements.d.ts +197 -7
  101. package/dist/types/builder/tools/element-edit/video.d.ts +2 -0
  102. package/dist/user-elements.scss +263 -221
  103. package/dist/variant-picker.scss +2 -0
  104. package/dist/video.scss +2 -0
  105. package/dist/volume-pricing.scss +3 -0
  106. package/package.json +1 -1
package/dist/table-common.scss CHANGED
@@ -1,506 +1,509 @@
1
- .table__wrapper {
2
- padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg, var(--_tst-lt-pg))));
3
-
4
- // background-color: var(
5
- // --_ctm-mob-dn-te-wt-bd-cr,
6
- // var(--_ctm-tab-dn-te-wt-bd-cr, var(--_ctm-dn-te-wt-bd-cr, var(--_tst-dn-te-wt-bd-cr)))
7
- // );
8
-
9
- height: 100%;
10
-
11
- border-radius: var(
12
- --_ctm-mob-dn-te-wt-br-rs,
13
- var(--_ctm-tab-dn-te-wt-br-rs, var(--_ctm-dn-te-wt-br-rs, var(--_tst-dn-te-wt-br-rs)))
14
- );
15
-
16
- box-shadow: var(
17
- --_show-shadow,
18
- var(--_ctm-mob-dn-te-wt-sw-ae, var(--_ctm-tab-dn-te-wt-sw-ae, var(--_ctm-dn-te-wt-sw-ae)))
19
- var(--_ctm-mob-dn-te-wt-sw-br, var(--_ctm-tab-dn-te-wt-sw-br, var(--_ctm-dn-te-wt-sw-br)))
20
- var(--_ctm-mob-dn-te-wt-sw-sd, var(--_ctm-tab-dn-te-wt-sw-sd, var(--_ctm-dn-te-wt-sw-sd)))
21
- var(--_ctm-mob-dn-te-wt-sw-cr, var(--_ctm-tab-dn-te-wt-sw-cr, var(--_ctm-dn-te-wt-sw-cr)))
22
- );
23
-
24
- width: 100%;
25
-
26
- &[data-header-divider="true"] {
27
- thead tr th {
28
- border-bottom: 1px solid
29
- var(
30
- --_ctm-mob-dn-rw-ad-hr-ds-hr-dr,
31
- var(--_ctm-tab-dn-rw-ad-hr-ds-hr-dr, var(--_ctm-dn-rw-ad-hr-ds-hr-dr))
32
- );
33
- }
34
- }
35
- &[data-row-divider="true"] {
36
- tbody tr td {
37
- border-bottom: 1px solid
38
- var(
39
- --_ctm-mob-dn-rw-ad-hr-ds-rw-dr,
40
- var(--_ctm-tab-dn-rw-ad-hr-ds-rw-dr, var(--_ctm-dn-rw-ad-hr-ds-rw-dr))
41
- );
42
- }
43
- }
44
- &[data-column-divider="true"] {
45
- tbody tr td,
46
- thead tr th {
47
- border-right: 1px solid
48
- var(
49
- --_ctm-mob-dn-rw-ad-hr-ds-cn-dr,
50
- var(--_ctm-tab-dn-rw-ad-hr-ds-cn-dr, var(--_ctm-dn-rw-ad-hr-ds-cn-dr))
51
- );
52
- }
53
-
54
- tbody tr td:last-child,
55
- thead tr th:last-child {
56
- border-right: none;
57
- }
58
- }
59
- &[data-show-more-rows="onScroll"] {
60
- .table__container {
61
- overflow-y: auto;
62
-
63
- &::-webkit-scrollbar {
64
- width: var(
65
- --_ctm-mob-dn-sl-br-sl-br-wh,
66
- var(--_ctm-tab-dn-sl-br-sl-br-wh, var(--_ctm-dn-sl-br-sl-br-wh))
67
- );
68
- }
69
-
70
- &::-webkit-scrollbar-track {
71
- background-color: var(--_base-white);
72
- }
73
-
74
- &::-webkit-scrollbar-thumb {
75
- background-color: var(
76
- --_ctm-mob-dn-sl-br-sl-br-cr,
77
- var(--_ctm-tab-dn-sl-br-sl-br-cr, var(--_ctm-dn-sl-br-sl-br-cr))
78
- );
79
- }
80
-
81
- // // Scrollbar thumb when hovered
82
- // &::-webkit-scrollbar-thumb:hover {
83
- // background-color: #555; // Darker color when hovering over the thumb
84
- // }
85
-
86
- // // For Firefox, using scrollbar-width and scrollbar-color
87
- // scrollbar-width: thin; // Thin scrollbar
88
- // scrollbar-color: #888 #f1f1f1; // Thumb and track colors
89
- }
90
- }
91
-
92
- &[data-alternative-row-colors="true"] {
93
- tbody .tbody__row__divider:nth-child(odd) {
94
- background-color: #f76b6b;
95
- }
96
- }
97
-
98
- .table__container {
99
- background-color: var(
100
- --_ctm-mob-dn-te-bd-cr,
101
- var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr))
102
- );
103
-
104
- border-radius: var(
105
- --_ctm-mob-dn-te-br-rs,
106
- var(--_ctm-tab-dn-te-br-rs, var(--_ctm-dn-te-br-rs))
107
- );
108
-
109
- box-shadow: var(
110
- --_show-table-shadow,
111
- var(--_ctm-mob-dn-te-sw-ae, var(--_ctm-tab-dn-te-sw-ae, var(--_ctm-dn-te-sw-ae)))
112
- var(--_ctm-mob-dn-te-sw-br, var(--_ctm-tab-dn-te-sw-br, var(--_ctm-dn-te-sw-br)))
113
- var(--_ctm-mob-dn-te-sw-sd, var(--_ctm-tab-dn-te-sw-sd, var(--_ctm-dn-te-sw-sd)))
114
- var(--_ctm-mob-dn-te-sw-cr, var(--_ctm-tab-dn-te-sw-cr, var(--_ctm-dn-te-sw-cr)))
115
- );
116
- }
117
-
118
- h3 {
119
- text-align: center;
120
- width: 100%;
121
- margin-bottom: 10px;
122
- }
123
- table {
124
- border-collapse: collapse;
125
- // border: none;
126
- width: 100%;
127
- // height: 100%;
128
- text-align: var(--_ctm-mob-lt-ct-at, var(--_ctm-tab-lt-ct-at, var(--_ctm-lt-ct-at)));
129
-
130
- th,
131
- td {
132
- border: none;
133
- }
134
- thead {
135
- background-color: var(
136
- --_ctm-mob-dn-te-hr-bd-cr,
137
- var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr))
138
- );
139
-
140
- .thead__row__divider {
141
- height: var(--_ctm-mob-lt-hr-ht, var(--_ctm-tab-lt-hr-ht, var(--_ctm-lt-hr-ht)));
142
-
143
- .th__col__divider {
144
- padding: var(
145
- --_ctm-mob-lt-hr-cl-pg,
146
- var(--_ctm-tab-lt-hr-cl-pg, var(--_ctm-lt-hr-cl-pg))
147
- );
148
-
149
- color: var(--_ctm-mob-dn-hr-tt-cr, var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr)));
150
-
151
- font-family: var(
152
- --_ctm-mob-dn-hr-tt-ft-fy,
153
- var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy))
154
- );
155
-
156
- font-size: var(
157
- --_ctm-mob-dn-hr-tt-ft-se,
158
- var(--_ctm-tab-dn-hr-tt-ft-se, var(--_ctm-dn-hr-tt-ft-se))
159
- );
160
-
161
- font-weight: var(
162
- --_ctm-mob-dn-hr-tt-ft-wt,
163
- var(--_ctm-tab-dn-hr-tt-ft-wt, var(--_ctm-dn-hr-tt-ft-wt))
164
- );
165
-
166
- text-decoration: var(
167
- --_ctm-mob-dn-hr-tt-ue,
168
- var(--_ctm-tab-dn-hr-tt-ue, var(--_ctm-dn-hr-tt-ue))
169
- );
170
-
171
- font-style: var(
172
- --_ctm-mob-dn-hr-tt-ft-se-ic,
173
- var(--_ctm-tab-dn-hr-tt-ft-se-ic, var(--_ctm-dn-hr-tt-ft-se-ic))
174
- );
175
-
176
- text-align: var(
177
- --_ctm-mob-dn-hr-tt-tt-an,
178
- var(--_ctm-tab-dn-hr-tt-tt-an, var(--_ctm-dn-hr-tt-tt-an))
179
- );
180
-
181
- letter-spacing: var(
182
- --_ctm-mob-dn-hr-tt-lr-sg,
183
- var(--_ctm-tab-dn-hr-tt-lr-sg, var(--_ctm-dn-hr-tt-lr-sg))
184
- );
185
-
186
- line-height: var(
187
- --_ctm-mob-dn-hr-tt-le-ht,
188
- var(--_ctm-tab-dn-hr-tt-le-ht, var(--_ctm-dn-hr-tt-le-ht))
189
- );
190
- }
191
- }
192
- }
193
- tbody {
194
- .tbody__row__divider {
195
- background-color: var(
196
- --_ctm-mob-dn-te-rw-bd-cr,
197
- var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr))
198
- );
199
-
200
- height: var(--_ctm-mob-lt-rw-ht, var(--_ctm-tab-lt-rw-ht, var(--_ctm-lt-rw-ht)));
201
-
202
- .td__col__divider {
203
- padding: var(
204
- --_ctm-mob-lt-rw-cl-pg,
205
- var(--_ctm-tab-lt-rw-cl-pg, var(--_ctm-lt-rw-cl-pg))
206
- );
207
-
208
- color: var(
209
- --_sf-hr-fc,
210
- var(--_ctm-mob-dn-rw-tt-cr, var(--_ctm-tab-dn-rw-tt-cr, var(--_ctm-dn-rw-tt-cr)))
211
- );
212
-
213
- font-family: var(
214
- --_sf-hr-ff,
215
- var(
216
- --_ctm-mob-dn-rw-tt-ft-fy,
217
- var(--_ctm-tab-dn-rw-tt-ft-fy, var(--_ctm-dn-rw-tt-ft-fy))
218
- )
219
- );
220
-
221
- font-size: var(
222
- --_sf-hr-fs,
223
- var(
224
- --_ctm-mob-dn-rw-tt-ft-se,
225
- var(--_ctm-tab-dn-rw-tt-ft-se, var(--_ctm-dn-rw-tt-ft-se))
226
- )
227
- );
228
-
229
- text-decoration: var(
230
- --_ctm-mob-dn-rw-tt-ue,
231
- var(--_ctm-tab-dn-rw-tt-ue, var(--_ctm-dn-rw-tt-ue))
232
- );
233
-
234
- font-weight: var(
235
- --_sf-hr-fw,
236
- var(
237
- --_ctm-mob-dn-rw-tt-ft-wt,
238
- var(--_ctm-tab-dn-rw-tt-ft-wt, var(--_ctm-dn-rw-tt-ft-wt))
239
- )
240
- );
241
-
242
- font-style: var(
243
- --_sf-hr-ft,
244
- var(
245
- --_ctm-mob-dn-rw-tt-ft-se-ic,
246
- var(--_ctm-tab-dn-rw-tt-ft-se-ic, var(--_ctm-dn-rw-tt-ft-se-ic))
247
- )
248
- );
249
-
250
- text-align: var(
251
- --_sf-hr-ta,
252
- var(
253
- --_ctm-mob-dn-rw-tt-tt-an,
254
- var(--_ctm-tab-dn-rw-tt-tt-an, var(--_ctm-dn-rw-tt-tt-an))
255
- )
256
- );
257
-
258
- letter-spacing: var(
259
- --_sf-hr-ls,
260
- var(
261
- --_ctm-mob-dn-rw-tt-lr-sg,
262
- var(--_ctm-tab-dn-rw-tt-lr-sg, var(--_ctm-dn-rw-tt-lr-sg))
263
- )
264
- );
265
-
266
- line-height: var(
267
- --_sf-hr-lh,
268
- var(
269
- --_ctm-mob-dn-rw-tt-le-ht,
270
- var(--_ctm-tab-dn-rw-tt-le-ht, var(--_ctm-dn-rw-tt-le-ht))
271
- )
272
- );
273
- }
274
- }
275
- }
276
- }
277
-
278
- .pagination {
279
- display: var(--_d-flex);
280
- align-items: var(--_align-center);
281
- justify-content: var(--_ctm-mob-lt-pn-at, var(--_ctm-tab-lt-pn-at, var(--_ctm-lt-pn-at)));
282
- margin-top: 10px;
283
- background-color: var(
284
- --_sf-bd-cr,
285
- var(
286
- --_ctm-mob-dn-pn-dt-se-bd-cr,
287
- var(--_ctm-tab-dn-pn-dt-se-bd-cr, var(--_ctm-dn-pn-dt-se-bd-cr))
288
- )
289
- );
290
- &.pagination__center {
291
- justify-content: var(justify-center);
292
- }
293
-
294
- button {
295
- svg {
296
- width: var(--_width-18);
297
- height: var(--_height-18);
298
- path {
299
- stroke: var(--_gray-500);
300
- // stroke: var(--_ctm-dn-pn-in-c1, var(--_tst-dn-pn-in-c1));
301
- }
302
- }
303
- }
304
- span {
305
- float: left;
306
- padding: var(--_pd-8) var(--_pd-16);
307
- text-decoration: none;
308
- span {
309
- // color: var(--_sf-hr-fc, var(--_ctm-dn-pn-bn-cr, var(--_tst-dn-pn-bn-cr)));
310
- // font-size: var(--_sf-hr-fs, var(--_ctm-dn-pn-ft-se, var(--_tst-dn-pn-ft-se)));
311
- // font-family: var(--_sf-hr-ff, var(--_ctm-dn-pn-ft-fy, var(--_tst-dn-pn-ft-fy))),
312
-
313
- // font-weight: var(--_sf-hr-fw, var(--_ctm-dn-pn-ft-wt, var(--_tst-dn-pn-ft-wt)));
314
- // font-style: var(--_sf-hr-ft, var(--_ctm-dn-pn-ft-se-ic, var(--_tst-dn-pn-ft-se-ic)));
315
- // text-align: var(--_sf-hr-ta, var(--_ctm-dn-pn-tt-an, var(--_tst-dn-pn-tt-an)));
316
- // letter-spacing: var(--_sf-hr-ls, var(--_ctm-dn-pn-lr-sg, var(--_tst-dn-pn-lr-sg)));
317
- // line-height: var(--_sf-hr-lh, var(--_ctm-dn-pn-le-ht, var(--_tst-dn-pn-le-ht)));
318
- }
319
- &.active:hover {
320
- &hover {
321
- --_sf-hr-fc: var(--_ctm-dn-pn-hr-se-cr, var(--_tst-dn-pn-hr-se-cr));
322
- --_sf-hr-ff: var(--_ctm-dn-pn-hr-se-ft-fy, var(--_tst-dn-pn-hr-se-ft-fy));
323
- --_sf-hr-fs: var(--_ctm-dn-pn-hr-se-ft-se, var(--_tst-dn-pn-hr-se-ft-se));
324
- --_sf-hr-fw: var(--_ctm-dn-pn-hr-se-ft-wt, var(--_tst-dn-pn-hr-se-ft-wt));
325
- --_sf-hr-ft: var(--_ctm-dn-pn-hr-se-ft-se-ic, var(--_tst-dn-pn-hr-se-ft-se-ic));
326
- --_sf-hr-ta: var(--_ctm-dn-pn-hr-se-tt-an, var(--_tst-dn-pn-hr-se-tt-an));
327
- --_sf-hr-ls: var(--_ctm-dn-pn-hr-se-lr-sg, var(--_tst-dn-pn-hr-se-lr-sg));
328
- --_sf-hr-lh: var(--_ctm-dn-pn-hr-se-le-ht, var(--_tst-dn-pn-hr-se-le-ht));
329
- }
330
- }
331
- &.active {
332
- color: var(
333
- --_sf-hr-fc,
334
- var(--_ctm-mob-dn-pn-dt-se-cr, var(--_ctm-tab-dn-pn-dt-se-cr, var(--_ctm-dn-pn-dt-se-cr)))
335
- );
336
-
337
- font-family: var(
338
- --_sf-hr-ff,
339
- var(
340
- --_ctm-mob-dn-pn-dt-se-ft-fy,
341
- var(--_ctm-tab-dn-pn-dt-se-ft-fy, var(--_ctm-dn-pn-dt-se-ft-fy))
342
- )
343
- );
344
-
345
- font-size: var(
346
- --_sf-hr-fs,
347
- var(
348
- --_ctm-mob-dn-pn-dt-se-ft-se,
349
- var(--_ctm-tab-dn-pn-dt-se-ft-se, var(--_ctm-dn-pn-dt-se-ft-se))
350
- )
351
- );
352
-
353
- text-decoration: var(
354
- --_sf-hr-td,
355
- var(--_ctm-mob-dn-pn-dt-se-ue, var(--_ctm-tab-dn-pn-dt-se-ue, var(--_ctm-dn-pn-dt-se-ue)))
356
- );
357
-
358
- font-weight: var(
359
- --_sf-hr-fw,
360
- var(
361
- --_ctm-mob-dn-pn-dt-se-ft-wt,
362
- var(--_ctm-tab-dn-pn-dt-se-ft-wt, var(--_ctm-dn-pn-dt-se-ft-wt))
363
- )
364
- );
365
-
366
- font-style: var(
367
- --_sf-hr-ft,
368
- var(
369
- --_ctm-mob-dn-pn-dt-se-ft-se-ic,
370
- var(--_ctm-tab-dn-pn-dt-se-ft-se-ic, var(--_ctm-dn-pn-dt-se-ft-se-ic))
371
- )
372
- );
373
-
374
- text-align: var(
375
- --_sf-hr-ta,
376
- var(
377
- --_ctm-mob-dn-pn-dt-se-tt-an,
378
- var(--_ctm-tab-dn-pn-dt-se-tt-an, var(--_ctm-dn-pn-dt-se-tt-an))
379
- )
380
- );
381
-
382
- letter-spacing: var(
383
- --_sf-hr-ls,
384
- var(
385
- --_ctm-mob-dn-pn-dt-se-lr-sg,
386
- var(--_ctm-tab-dn-pn-dt-se-lr-sg, var(--_ctm-dn-pn-dt-se-lr-sg))
387
- )
388
- );
389
-
390
- line-height: var(
391
- --_sf-hr-lh,
392
- var(
393
- --_ctm-mob-dn-pn-dt-se-le-ht,
394
- var(--_ctm-tab-dn-pn-dt-se-le-ht, var(--_ctm-dn-pn-dt-se-le-ht))
395
- )
396
- );
397
- }
398
- }
399
- .pagination__arrows {
400
- color: var(
401
- --_sf-hr-fc,
402
- var(--_ctm-mob-dn-pn-in-c1, var(--_ctm-tab-dn-pn-in-c1, var(--_ctm-dn-pn-in-c1)))
403
- );
404
-
405
- font-size: var(
406
- --_sf-hr-fs,
407
- var(--_ctm-mob-dn-pn-in-se, var(--_ctm-tab-dn-pn-in-se, var(--_ctm-dn-pn-in-se)))
408
- );
409
- }
410
- }
411
-
412
- .load__more {
413
- margin: 10px;
414
- background-color: var(
415
- --_sf-hr-bd-cr,
416
- var(
417
- --_ctm-mob-dn-ld-me-bn-bd-cr,
418
- var(--_ctm-tab-dn-ld-me-bn-bd-cr, var(--_ctm-dn-ld-me-bn-bd-cr))
419
- )
420
- );
421
- border-radius: var(
422
- --_sf-hr-br-br,
423
- var(
424
- --_ctm-mob-dn-ld-me-bn-br-rs,
425
- var(--_ctm-tab-dn-ld-me-bn-br-rs, var(--_ctm-dn-ld-me-bn-br-rs))
426
- )
427
- );
428
-
429
- h3 {
430
- color: var(
431
- --_sf-hr-fc,
432
- var(--_ctm-mob-dn-ld-me-bn-cr, var(--_ctm-tab-dn-ld-me-bn-cr, var(--_ctm-dn-ld-me-bn-cr)))
433
- );
434
- font-family: var(
435
- --_sf-hr-ff,
436
- var(
437
- --_ctm-mob-dn-ld-me-bn-ft-fy,
438
- var(--_ctm-tab-dn-ld-me-bn-ft-fy, var(--_ctm-dn-ld-me-bn-ft-fy))
439
- )
440
- );
441
- font-size: var(
442
- --_sf-hr-fs,
443
- var(
444
- --_ctm-mob-dn-ld-me-bn-ft-se,
445
- var(--_ctm-tab-dn-ld-me-bn-ft-se, var(--_ctm-dn-ld-me-bn-ft-se))
446
- )
447
- );
448
-
449
- text-decoration: var(
450
- --_ctm-mob-dn-ld-me-bn-ue,
451
- var(--_ctm-tab-dn-ld-me-bn-ue, var(--_ctm-dn-ld-me-bn-ue))
452
- );
453
-
454
- font-weight: var(
455
- --_sf-hr-fw,
456
- var(
457
- --_ctm-mob-dn-ld-me-bn-ft-wt,
458
- var(--_ctm-tab-dn-ld-me-bn-ft-wt, var(--_ctm-dn-ld-me-bn-ft-wt))
459
- )
460
- );
461
-
462
- font-style: var(
463
- --_sf-hr-ft,
464
- var(
465
- --_ctm-mob-dn-ld-me-bn-ft-se-ic,
466
- var(--_ctm-tab-dn-ld-me-bn-ft-se-ic, var(--_ctm-dn-ld-me-bn-ft-se-ic))
467
- )
468
- );
469
-
470
- text-align: var(
471
- --_sf-hr-ta,
472
- var(
473
- --_ctm-mob-dn-ld-me-bn-tt-an,
474
- var(--_ctm-tab-dn-ld-me-bn-tt-an, var(--_ctm-dn-ld-me-bn-tt-an))
475
- )
476
- );
477
-
478
- letter-spacing: var(
479
- --_sf-hr-ls,
480
- var(
481
- --_ctm-mob-dn-ld-me-bn-lr-sg,
482
- var(--_ctm-tab-dn-ld-me-bn-lr-sg, var(--_ctm-dn-ld-me-bn-lr-sg))
483
- )
484
- );
485
-
486
- line-height: var(
487
- --_sf-hr-lh,
488
- var(
489
- --_ctm-mob-dn-ld-me-bn-le-ht,
490
- var(--_ctm-tab-dn-ld-me-bn-le-ht, var(--_ctm-dn-ld-me-bn-le-ht))
491
- )
492
- );
493
- }
494
- // background-color: var(--_primary-400);
495
- // border: 1px solid var(--_primary-400);
496
- // border-radius: var(--_br-6);
497
- // padding: var(--_pd-8) var(--_pd-12);
498
- // color: var(---base-whiet);
499
- // display: inline-block;
500
- // color: var(--_base-white);
501
- // margin: 0 auto;
502
- // width: 150px;
503
- // text-align: center;
504
- // margin-top: 20px;
505
- }
506
- }
1
+ @use "./functions.scss" as *;
2
+ .table__wrapper {
3
+ padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg, var(--_tst-lt-pg))));
4
+
5
+ // background-color: var(
6
+ // --_ctm-mob-dn-te-wt-bd-cr,
7
+ // var(--_ctm-tab-dn-te-wt-bd-cr, var(--_ctm-dn-te-wt-bd-cr, var(--_tst-dn-te-wt-bd-cr)))
8
+ // );
9
+
10
+ height: 100%;
11
+
12
+ border-radius: var(
13
+ --_ctm-mob-dn-te-wt-br-rs,
14
+ var(--_ctm-tab-dn-te-wt-br-rs, var(--_ctm-dn-te-wt-br-rs, var(--_tst-dn-te-wt-br-rs)))
15
+ );
16
+
17
+ box-shadow: var(
18
+ --_show-shadow,
19
+ var(--_ctm-mob-dn-te-wt-sw-ae, var(--_ctm-tab-dn-te-wt-sw-ae, var(--_ctm-dn-te-wt-sw-ae)))
20
+ var(--_ctm-mob-dn-te-wt-sw-br, var(--_ctm-tab-dn-te-wt-sw-br, var(--_ctm-dn-te-wt-sw-br)))
21
+ var(--_ctm-mob-dn-te-wt-sw-sd, var(--_ctm-tab-dn-te-wt-sw-sd, var(--_ctm-dn-te-wt-sw-sd)))
22
+ var(--_ctm-mob-dn-te-wt-sw-cr, var(--_ctm-tab-dn-te-wt-sw-cr, var(--_ctm-dn-te-wt-sw-cr)))
23
+ );
24
+
25
+ width: 100%;
26
+
27
+ &[data-header-divider="true"] {
28
+ thead tr th {
29
+ border-bottom: 1px solid
30
+ var(
31
+ --_ctm-mob-dn-rw-ad-hr-ds-hr-dr,
32
+ var(--_ctm-tab-dn-rw-ad-hr-ds-hr-dr, var(--_ctm-dn-rw-ad-hr-ds-hr-dr))
33
+ );
34
+ }
35
+ }
36
+ &[data-row-divider="true"] {
37
+ tbody tr td {
38
+ border-bottom: 1px solid
39
+ var(
40
+ --_ctm-mob-dn-rw-ad-hr-ds-rw-dr,
41
+ var(--_ctm-tab-dn-rw-ad-hr-ds-rw-dr, var(--_ctm-dn-rw-ad-hr-ds-rw-dr))
42
+ );
43
+ }
44
+ }
45
+ &[data-column-divider="true"] {
46
+ tbody tr td,
47
+ thead tr th {
48
+ border-right: 1px solid
49
+ var(
50
+ --_ctm-mob-dn-rw-ad-hr-ds-cn-dr,
51
+ var(--_ctm-tab-dn-rw-ad-hr-ds-cn-dr, var(--_ctm-dn-rw-ad-hr-ds-cn-dr))
52
+ );
53
+ }
54
+
55
+ tbody tr td:last-child,
56
+ thead tr th:last-child {
57
+ border-right: none;
58
+ }
59
+ }
60
+ &[data-show-more-rows="onScroll"] {
61
+ .table__container {
62
+ overflow-y: auto;
63
+
64
+ &::-webkit-scrollbar {
65
+ width: var(
66
+ --_ctm-mob-dn-sl-br-sl-br-wh,
67
+ var(--_ctm-tab-dn-sl-br-sl-br-wh, var(--_ctm-dn-sl-br-sl-br-wh))
68
+ );
69
+ }
70
+
71
+ &::-webkit-scrollbar-track {
72
+ background-color: var(--_base-white);
73
+ }
74
+
75
+ &::-webkit-scrollbar-thumb {
76
+ background-color: var(
77
+ --_ctm-mob-dn-sl-br-sl-br-cr,
78
+ var(--_ctm-tab-dn-sl-br-sl-br-cr, var(--_ctm-dn-sl-br-sl-br-cr))
79
+ );
80
+ }
81
+
82
+ // // Scrollbar thumb when hovered
83
+ // &::-webkit-scrollbar-thumb:hover {
84
+ // background-color: #555; // Darker color when hovering over the thumb
85
+ // }
86
+
87
+ // // For Firefox, using scrollbar-width and scrollbar-color
88
+ // scrollbar-width: thin; // Thin scrollbar
89
+ // scrollbar-color: #888 #f1f1f1; // Thumb and track colors
90
+ }
91
+ }
92
+
93
+ &[data-alternative-row-colors="true"] {
94
+ tbody .tbody__row__divider:nth-child(odd) {
95
+ background-color: #f76b6b;
96
+ }
97
+ }
98
+
99
+ .table__container {
100
+ background-color: var(
101
+ --_ctm-mob-dn-te-bd-cr,
102
+ var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr))
103
+ );
104
+
105
+ border-radius: var(
106
+ --_ctm-mob-dn-te-br-rs,
107
+ var(--_ctm-tab-dn-te-br-rs, var(--_ctm-dn-te-br-rs))
108
+ );
109
+
110
+ box-shadow: var(
111
+ --_show-table-shadow,
112
+ var(--_ctm-mob-dn-te-sw-ae, var(--_ctm-tab-dn-te-sw-ae, var(--_ctm-dn-te-sw-ae)))
113
+ var(--_ctm-mob-dn-te-sw-br, var(--_ctm-tab-dn-te-sw-br, var(--_ctm-dn-te-sw-br)))
114
+ var(--_ctm-mob-dn-te-sw-sd, var(--_ctm-tab-dn-te-sw-sd, var(--_ctm-dn-te-sw-sd)))
115
+ var(--_ctm-mob-dn-te-sw-cr, var(--_ctm-tab-dn-te-sw-cr, var(--_ctm-dn-te-sw-cr)))
116
+ );
117
+ }
118
+
119
+ h3 {
120
+ text-align: center;
121
+ width: 100%;
122
+ margin-bottom: 10px;
123
+ }
124
+ table {
125
+ border-collapse: collapse;
126
+ // border: none;
127
+ width: 100%;
128
+ // height: 100%;
129
+ text-align: var(--_ctm-mob-lt-ct-at, var(--_ctm-tab-lt-ct-at, var(--_ctm-lt-ct-at)));
130
+
131
+ th,
132
+ td {
133
+ border: none;
134
+ }
135
+ thead {
136
+ background-color: var(
137
+ --_ctm-mob-dn-te-hr-bd-cr,
138
+ var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr))
139
+ );
140
+
141
+ .thead__row__divider {
142
+ height: var(--_ctm-mob-lt-hr-ht, var(--_ctm-tab-lt-hr-ht, var(--_ctm-lt-hr-ht)));
143
+
144
+ .th__col__divider {
145
+ padding: var(
146
+ --_ctm-mob-lt-hr-cl-pg,
147
+ var(--_ctm-tab-lt-hr-cl-pg, var(--_ctm-lt-hr-cl-pg))
148
+ );
149
+
150
+ color: var(--_ctm-mob-dn-hr-tt-cr, var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr)));
151
+
152
+ font-family: var(
153
+ --_ctm-mob-dn-hr-tt-ft-fy,
154
+ var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy))
155
+ );
156
+
157
+ font-size: var(
158
+ --_ctm-mob-dn-hr-tt-ft-se,
159
+ var(--_ctm-tab-dn-hr-tt-ft-se, var(--_ctm-dn-hr-tt-ft-se))
160
+ );
161
+
162
+ font-weight: var(
163
+ --_ctm-mob-dn-hr-tt-ft-wt,
164
+ var(--_ctm-tab-dn-hr-tt-ft-wt, var(--_ctm-dn-hr-tt-ft-wt))
165
+ );
166
+
167
+ text-decoration: var(
168
+ --_ctm-mob-dn-hr-tt-ue,
169
+ var(--_ctm-tab-dn-hr-tt-ue, var(--_ctm-dn-hr-tt-ue))
170
+ );
171
+
172
+ font-style: var(
173
+ --_ctm-mob-dn-hr-tt-ft-se-ic,
174
+ var(--_ctm-tab-dn-hr-tt-ft-se-ic, var(--_ctm-dn-hr-tt-ft-se-ic))
175
+ );
176
+
177
+ text-align: var(
178
+ --_ctm-mob-dn-hr-tt-tt-an,
179
+ var(--_ctm-tab-dn-hr-tt-tt-an, var(--_ctm-dn-hr-tt-tt-an))
180
+ );
181
+
182
+ letter-spacing: var(
183
+ --_ctm-mob-dn-hr-tt-lr-sg,
184
+ var(--_ctm-tab-dn-hr-tt-lr-sg, var(--_ctm-dn-hr-tt-lr-sg))
185
+ );
186
+
187
+ line-height: var(
188
+ --_ctm-mob-dn-hr-tt-le-ht,
189
+ var(--_ctm-tab-dn-hr-tt-le-ht, var(--_ctm-dn-hr-tt-le-ht))
190
+ );
191
+ }
192
+ }
193
+ }
194
+ tbody {
195
+ .tbody__row__divider {
196
+ background-color: var(
197
+ --_ctm-mob-dn-te-rw-bd-cr,
198
+ var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr))
199
+ );
200
+
201
+ height: var(--_ctm-mob-lt-rw-ht, var(--_ctm-tab-lt-rw-ht, var(--_ctm-lt-rw-ht)));
202
+
203
+ .td__col__divider {
204
+ padding: var(
205
+ --_ctm-mob-lt-rw-cl-pg,
206
+ var(--_ctm-tab-lt-rw-cl-pg, var(--_ctm-lt-rw-cl-pg))
207
+ );
208
+
209
+ color: var(
210
+ --_sf-hr-fc,
211
+ var(--_ctm-mob-dn-rw-tt-cr, var(--_ctm-tab-dn-rw-tt-cr, var(--_ctm-dn-rw-tt-cr)))
212
+ );
213
+
214
+ font-family: var(
215
+ --_sf-hr-ff,
216
+ var(
217
+ --_ctm-mob-dn-rw-tt-ft-fy,
218
+ var(--_ctm-tab-dn-rw-tt-ft-fy, var(--_ctm-dn-rw-tt-ft-fy))
219
+ )
220
+ );
221
+
222
+ font-size: var(
223
+ --_sf-hr-fs,
224
+ var(
225
+ --_ctm-mob-dn-rw-tt-ft-se,
226
+ var(--_ctm-tab-dn-rw-tt-ft-se, var(--_ctm-dn-rw-tt-ft-se))
227
+ )
228
+ );
229
+
230
+ text-decoration: var(
231
+ --_ctm-mob-dn-rw-tt-ue,
232
+ var(--_ctm-tab-dn-rw-tt-ue, var(--_ctm-dn-rw-tt-ue))
233
+ );
234
+
235
+ font-weight: var(
236
+ --_sf-hr-fw,
237
+ var(
238
+ --_ctm-mob-dn-rw-tt-ft-wt,
239
+ var(--_ctm-tab-dn-rw-tt-ft-wt, var(--_ctm-dn-rw-tt-ft-wt))
240
+ )
241
+ );
242
+
243
+ font-style: var(
244
+ --_sf-hr-ft,
245
+ var(
246
+ --_ctm-mob-dn-rw-tt-ft-se-ic,
247
+ var(--_ctm-tab-dn-rw-tt-ft-se-ic, var(--_ctm-dn-rw-tt-ft-se-ic))
248
+ )
249
+ );
250
+
251
+ text-align: var(
252
+ --_sf-hr-ta,
253
+ var(
254
+ --_ctm-mob-dn-rw-tt-tt-an,
255
+ var(--_ctm-tab-dn-rw-tt-tt-an, var(--_ctm-dn-rw-tt-tt-an))
256
+ )
257
+ );
258
+
259
+ letter-spacing: var(
260
+ --_sf-hr-ls,
261
+ var(
262
+ --_ctm-mob-dn-rw-tt-lr-sg,
263
+ var(--_ctm-tab-dn-rw-tt-lr-sg, var(--_ctm-dn-rw-tt-lr-sg))
264
+ )
265
+ );
266
+
267
+ line-height: var(
268
+ --_sf-hr-lh,
269
+ var(
270
+ --_ctm-mob-dn-rw-tt-le-ht,
271
+ var(--_ctm-tab-dn-rw-tt-le-ht, var(--_ctm-dn-rw-tt-le-ht))
272
+ )
273
+ );
274
+ }
275
+ }
276
+ }
277
+ }
278
+
279
+ .pagination {
280
+ display: var(--_d-flex);
281
+ align-items: var(--_align-center);
282
+ justify-content: var(--_ctm-mob-lt-pn-at, var(--_ctm-tab-lt-pn-at, var(--_ctm-lt-pn-at)));
283
+ margin-top: 10px;
284
+ background-color: var(
285
+ --_sf-bd-cr,
286
+ var(
287
+ --_ctm-mob-dn-pn-dt-se-bd-cr,
288
+ var(--_ctm-tab-dn-pn-dt-se-bd-cr, var(--_ctm-dn-pn-dt-se-bd-cr))
289
+ )
290
+ );
291
+ &.pagination__center {
292
+ justify-content: var(justify-center);
293
+ }
294
+
295
+ button {
296
+ svg {
297
+ width: var(--_width-18);
298
+ height: var(--_height-18);
299
+ path {
300
+ stroke: var(--_gray-500);
301
+ // stroke: var(--_ctm-dn-pn-in-c1, var(--_tst-dn-pn-in-c1));
302
+ // Overrides the stroke-width presentation attribute baked into the icon markup.
303
+ stroke-width: prepareMediaVariable(--_ctm-dn-pn-se-wh, 1.25);
304
+ }
305
+ }
306
+ }
307
+ span {
308
+ float: left;
309
+ padding: var(--_pd-8) var(--_pd-16);
310
+ text-decoration: none;
311
+ span {
312
+ // color: var(--_sf-hr-fc, var(--_ctm-dn-pn-bn-cr, var(--_tst-dn-pn-bn-cr)));
313
+ // font-size: var(--_sf-hr-fs, var(--_ctm-dn-pn-ft-se, var(--_tst-dn-pn-ft-se)));
314
+ // font-family: var(--_sf-hr-ff, var(--_ctm-dn-pn-ft-fy, var(--_tst-dn-pn-ft-fy))),
315
+
316
+ // font-weight: var(--_sf-hr-fw, var(--_ctm-dn-pn-ft-wt, var(--_tst-dn-pn-ft-wt)));
317
+ // font-style: var(--_sf-hr-ft, var(--_ctm-dn-pn-ft-se-ic, var(--_tst-dn-pn-ft-se-ic)));
318
+ // text-align: var(--_sf-hr-ta, var(--_ctm-dn-pn-tt-an, var(--_tst-dn-pn-tt-an)));
319
+ // letter-spacing: var(--_sf-hr-ls, var(--_ctm-dn-pn-lr-sg, var(--_tst-dn-pn-lr-sg)));
320
+ // line-height: var(--_sf-hr-lh, var(--_ctm-dn-pn-le-ht, var(--_tst-dn-pn-le-ht)));
321
+ }
322
+ &.active:hover {
323
+ &hover {
324
+ --_sf-hr-fc: var(--_ctm-dn-pn-hr-se-cr, var(--_tst-dn-pn-hr-se-cr));
325
+ --_sf-hr-ff: var(--_ctm-dn-pn-hr-se-ft-fy, var(--_tst-dn-pn-hr-se-ft-fy));
326
+ --_sf-hr-fs: var(--_ctm-dn-pn-hr-se-ft-se, var(--_tst-dn-pn-hr-se-ft-se));
327
+ --_sf-hr-fw: var(--_ctm-dn-pn-hr-se-ft-wt, var(--_tst-dn-pn-hr-se-ft-wt));
328
+ --_sf-hr-ft: var(--_ctm-dn-pn-hr-se-ft-se-ic, var(--_tst-dn-pn-hr-se-ft-se-ic));
329
+ --_sf-hr-ta: var(--_ctm-dn-pn-hr-se-tt-an, var(--_tst-dn-pn-hr-se-tt-an));
330
+ --_sf-hr-ls: var(--_ctm-dn-pn-hr-se-lr-sg, var(--_tst-dn-pn-hr-se-lr-sg));
331
+ --_sf-hr-lh: var(--_ctm-dn-pn-hr-se-le-ht, var(--_tst-dn-pn-hr-se-le-ht));
332
+ }
333
+ }
334
+ &.active {
335
+ color: var(
336
+ --_sf-hr-fc,
337
+ var(--_ctm-mob-dn-pn-dt-se-cr, var(--_ctm-tab-dn-pn-dt-se-cr, var(--_ctm-dn-pn-dt-se-cr)))
338
+ );
339
+
340
+ font-family: var(
341
+ --_sf-hr-ff,
342
+ var(
343
+ --_ctm-mob-dn-pn-dt-se-ft-fy,
344
+ var(--_ctm-tab-dn-pn-dt-se-ft-fy, var(--_ctm-dn-pn-dt-se-ft-fy))
345
+ )
346
+ );
347
+
348
+ font-size: var(
349
+ --_sf-hr-fs,
350
+ var(
351
+ --_ctm-mob-dn-pn-dt-se-ft-se,
352
+ var(--_ctm-tab-dn-pn-dt-se-ft-se, var(--_ctm-dn-pn-dt-se-ft-se))
353
+ )
354
+ );
355
+
356
+ text-decoration: var(
357
+ --_sf-hr-td,
358
+ var(--_ctm-mob-dn-pn-dt-se-ue, var(--_ctm-tab-dn-pn-dt-se-ue, var(--_ctm-dn-pn-dt-se-ue)))
359
+ );
360
+
361
+ font-weight: var(
362
+ --_sf-hr-fw,
363
+ var(
364
+ --_ctm-mob-dn-pn-dt-se-ft-wt,
365
+ var(--_ctm-tab-dn-pn-dt-se-ft-wt, var(--_ctm-dn-pn-dt-se-ft-wt))
366
+ )
367
+ );
368
+
369
+ font-style: var(
370
+ --_sf-hr-ft,
371
+ var(
372
+ --_ctm-mob-dn-pn-dt-se-ft-se-ic,
373
+ var(--_ctm-tab-dn-pn-dt-se-ft-se-ic, var(--_ctm-dn-pn-dt-se-ft-se-ic))
374
+ )
375
+ );
376
+
377
+ text-align: var(
378
+ --_sf-hr-ta,
379
+ var(
380
+ --_ctm-mob-dn-pn-dt-se-tt-an,
381
+ var(--_ctm-tab-dn-pn-dt-se-tt-an, var(--_ctm-dn-pn-dt-se-tt-an))
382
+ )
383
+ );
384
+
385
+ letter-spacing: var(
386
+ --_sf-hr-ls,
387
+ var(
388
+ --_ctm-mob-dn-pn-dt-se-lr-sg,
389
+ var(--_ctm-tab-dn-pn-dt-se-lr-sg, var(--_ctm-dn-pn-dt-se-lr-sg))
390
+ )
391
+ );
392
+
393
+ line-height: var(
394
+ --_sf-hr-lh,
395
+ var(
396
+ --_ctm-mob-dn-pn-dt-se-le-ht,
397
+ var(--_ctm-tab-dn-pn-dt-se-le-ht, var(--_ctm-dn-pn-dt-se-le-ht))
398
+ )
399
+ );
400
+ }
401
+ }
402
+ .pagination__arrows {
403
+ color: var(
404
+ --_sf-hr-fc,
405
+ var(--_ctm-mob-dn-pn-in-c1, var(--_ctm-tab-dn-pn-in-c1, var(--_ctm-dn-pn-in-c1)))
406
+ );
407
+
408
+ font-size: var(
409
+ --_sf-hr-fs,
410
+ var(--_ctm-mob-dn-pn-in-se, var(--_ctm-tab-dn-pn-in-se, var(--_ctm-dn-pn-in-se)))
411
+ );
412
+ }
413
+ }
414
+
415
+ .load__more {
416
+ margin: 10px;
417
+ background-color: var(
418
+ --_sf-hr-bd-cr,
419
+ var(
420
+ --_ctm-mob-dn-ld-me-bn-bd-cr,
421
+ var(--_ctm-tab-dn-ld-me-bn-bd-cr, var(--_ctm-dn-ld-me-bn-bd-cr))
422
+ )
423
+ );
424
+ border-radius: var(
425
+ --_sf-hr-br-br,
426
+ var(
427
+ --_ctm-mob-dn-ld-me-bn-br-rs,
428
+ var(--_ctm-tab-dn-ld-me-bn-br-rs, var(--_ctm-dn-ld-me-bn-br-rs))
429
+ )
430
+ );
431
+
432
+ h3 {
433
+ color: var(
434
+ --_sf-hr-fc,
435
+ var(--_ctm-mob-dn-ld-me-bn-cr, var(--_ctm-tab-dn-ld-me-bn-cr, var(--_ctm-dn-ld-me-bn-cr)))
436
+ );
437
+ font-family: var(
438
+ --_sf-hr-ff,
439
+ var(
440
+ --_ctm-mob-dn-ld-me-bn-ft-fy,
441
+ var(--_ctm-tab-dn-ld-me-bn-ft-fy, var(--_ctm-dn-ld-me-bn-ft-fy))
442
+ )
443
+ );
444
+ font-size: var(
445
+ --_sf-hr-fs,
446
+ var(
447
+ --_ctm-mob-dn-ld-me-bn-ft-se,
448
+ var(--_ctm-tab-dn-ld-me-bn-ft-se, var(--_ctm-dn-ld-me-bn-ft-se))
449
+ )
450
+ );
451
+
452
+ text-decoration: var(
453
+ --_ctm-mob-dn-ld-me-bn-ue,
454
+ var(--_ctm-tab-dn-ld-me-bn-ue, var(--_ctm-dn-ld-me-bn-ue))
455
+ );
456
+
457
+ font-weight: var(
458
+ --_sf-hr-fw,
459
+ var(
460
+ --_ctm-mob-dn-ld-me-bn-ft-wt,
461
+ var(--_ctm-tab-dn-ld-me-bn-ft-wt, var(--_ctm-dn-ld-me-bn-ft-wt))
462
+ )
463
+ );
464
+
465
+ font-style: var(
466
+ --_sf-hr-ft,
467
+ var(
468
+ --_ctm-mob-dn-ld-me-bn-ft-se-ic,
469
+ var(--_ctm-tab-dn-ld-me-bn-ft-se-ic, var(--_ctm-dn-ld-me-bn-ft-se-ic))
470
+ )
471
+ );
472
+
473
+ text-align: var(
474
+ --_sf-hr-ta,
475
+ var(
476
+ --_ctm-mob-dn-ld-me-bn-tt-an,
477
+ var(--_ctm-tab-dn-ld-me-bn-tt-an, var(--_ctm-dn-ld-me-bn-tt-an))
478
+ )
479
+ );
480
+
481
+ letter-spacing: var(
482
+ --_sf-hr-ls,
483
+ var(
484
+ --_ctm-mob-dn-ld-me-bn-lr-sg,
485
+ var(--_ctm-tab-dn-ld-me-bn-lr-sg, var(--_ctm-dn-ld-me-bn-lr-sg))
486
+ )
487
+ );
488
+
489
+ line-height: var(
490
+ --_sf-hr-lh,
491
+ var(
492
+ --_ctm-mob-dn-ld-me-bn-le-ht,
493
+ var(--_ctm-tab-dn-ld-me-bn-le-ht, var(--_ctm-dn-ld-me-bn-le-ht))
494
+ )
495
+ );
496
+ }
497
+ // background-color: var(--_primary-400);
498
+ // border: 1px solid var(--_primary-400);
499
+ // border-radius: var(--_br-6);
500
+ // padding: var(--_pd-8) var(--_pd-12);
501
+ // color: var(---base-whiet);
502
+ // display: inline-block;
503
+ // color: var(--_base-white);
504
+ // margin: 0 auto;
505
+ // width: 150px;
506
+ // text-align: center;
507
+ // margin-top: 20px;
508
+ }
509
+ }