@sc-360-v2/storefront-cms-library 0.1.94 → 0.1.95

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 (41) hide show
  1. package/README.md +12 -12
  2. package/dist/amount-estimator.scss +438 -4
  3. package/dist/builder.js +1 -1
  4. package/dist/bulk-variant-picker.scss +725 -19
  5. package/dist/gallery-slider-temp.scss +455 -340
  6. package/dist/globals.scss +94 -94
  7. package/dist/menu.scss +89 -0
  8. package/dist/payment-methods.scss +170 -11
  9. package/dist/pickup-locations.scss +437 -11
  10. package/dist/product-actions.scss +881 -77
  11. package/dist/product-highlights.scss +108 -4
  12. package/dist/product-image.scss +466 -338
  13. package/dist/product-inventory.scss +550 -14
  14. package/dist/product-options.scss +156 -0
  15. package/dist/product-price.scss +686 -284
  16. package/dist/product-promotions.scss +1112 -17
  17. package/dist/product.scss +18 -172
  18. package/dist/quantity-selector.scss +52 -4
  19. package/dist/repeater-item.scss +21 -0
  20. package/dist/repeater.scss +106 -0
  21. package/dist/shipping-estimator.scss +7 -5
  22. package/dist/stack.scss +7 -2
  23. package/dist/store-locations.scss +436 -14
  24. package/dist/tooltip.scss +276 -0
  25. package/dist/types/builder/enums/index.d.ts +9 -2
  26. package/dist/types/builder/tools/element-edit/amountEstimator.d.ts +2 -1
  27. package/dist/types/builder/tools/element-edit/index.d.ts +3 -1
  28. package/dist/types/builder/tools/element-edit/productActions.d.ts +1 -0
  29. package/dist/types/builder/tools/element-edit/productDetails.d.ts +6 -31
  30. package/dist/types/builder/tools/element-edit/productDetailsOLd.d.ts +42 -0
  31. package/dist/types/builder/tools/element-edit/productOptions.d.ts +59 -0
  32. package/dist/types/builder/tools/element-edit/repeater.d.ts +2 -1
  33. package/dist/uom-selector.scss +495 -4
  34. package/dist/variant-picker.scss +767 -19
  35. package/dist/volume-pricing.scss +468 -19
  36. package/dist/widget.scss +24 -3
  37. package/package.json +1 -1
  38. package/dist/App.scss +0 -31
  39. package/dist/mixin.scss +0 -9
  40. package/dist/modal.module.scss +0 -121
  41. package/dist/range-slider.module.scss +0 -85
package/dist/product-inventory.scss CHANGED
@@ -5,27 +5,563 @@
5
5
  &[data-element-type="productInventory"] {
6
6
  width: var(--_sf-nw-wh, var(--_tst-lt-wh));
7
7
  margin: var(--_ctm-lt-mn, --_tst-lt-mn);
8
- aspect-ratio: 1 / var(--_sf-aspect-ratio);
9
-
8
+ // aspect-ratio: 1 / var(--_sf-aspect-ratio);
10
9
  & > .wrapper {
11
10
  width: 100%;
12
11
  }
13
-
14
12
  &[data-show-shadow="false"] {
15
- --_show-shadow: none;
13
+ --_show-shadow-im-se: none;
16
14
  }
17
- table {
18
- font-family: arial, sans-serif;
19
- border-collapse: collapse;
20
- width: 100%;
21
- height: 100%;
15
+ &[data-show-border="false"] {
16
+ --_show-border-im-se: none;
17
+ }
18
+ &[data-overflow-items="Wrap"] {
19
+ .horizontal {
20
+ flex-wrap: wrap;
21
+ }
22
22
  }
23
+ &[data-overflow-items="Scroll"] {
24
+ .horizontal {
25
+ width: 100%;
26
+ overflow-x: auto;
27
+ .item {
28
+ width: 100%;
29
+ flex-shrink: 0;
30
+ }
31
+ }
32
+ .vertical {
33
+ overflow-y: auto;
34
+ max-height: 30%;
35
+ }
36
+ }
37
+ .store__container {
38
+ display: flex;
39
+ flex-direction: column;
40
+ align-items: center;
41
+ padding: var(--_ctm-lt-pg);
42
+ .stack {
43
+ .static {
44
+ color: var(--_ctm-dn-iy-tt-se-cr-dc);
45
+ font-family: var(--_ctm-dn-iy-tt-se-ft-fy-dc), sans-serif;
46
+ font-size: var(--_ctm-dn-iy-tt-se-ft-se-dc);
47
+ font-weight: var(--_ctm-dn-iy-tt-se-ft-wt-dc);
48
+ font-style: var(--_ctm-dn-iy-tt-se-ft-se-ic-dc);
49
+ text-align: var(--_ctm-dn-iy-tt-se-tt-an-dc);
50
+ letter-spacing: var(--_ctm-dn-iy-tt-se-lr-sg-dc);
51
+ line-height: var(--_ctm-dn-iy-tt-se-le-ht-dc);
52
+ text-decoration: var(--_ctm-dn-iy-tt-se-ue-dc);
53
+ }
54
+ .dynamic {
55
+ color: var(--_ctm-dn-iy-tt-se-cr);
56
+ font-family: var(--_ctm-dn-iy-tt-se-ft-fy), sans-serif;
57
+ font-size: var(--_ctm-dn-iy-tt-se-ft-se);
58
+ font-weight: var(--_ctm-dn-iy-tt-se-ft-wt);
59
+ font-style: var(--_ctm-dn-iy-tt-se-ft-se-ic);
60
+ text-align: var(--_ctm-dn-iy-tt-se-tt-an);
61
+ letter-spacing: var(--_ctm-dn-iy-tt-se-lr-sg);
62
+ line-height: var(--_ctm-dn-iy-tt-se-le-ht);
63
+ text-decoration: var(--_ctm-dn-iy-tt-se-ue);
64
+ }
65
+ .horizontal {
66
+ display: flex;
67
+ flex-direction: row;
68
+ align-items: center;
69
+ margin-top: 10px;
70
+ gap: var(--_ctm-lt-im-sg);
71
+ .item {
72
+ padding: var(--_ctm-dn-im-se-vl-pg) var(--_ctm-dn-im-se-hl-pg);
73
+ display: flex;
74
+ flex-direction: column;
75
+ background-color: var(--_ctm-dn-im-se-bd-cr);
76
+ border-color: var(
77
+ --_show-border-im-se,
78
+ var(--_ctm-dn-im-se-br-cr, var(--_tst-dn-br-cr))
79
+ );
80
+ border-style: var(
81
+ --_show-border-im-se,
82
+ var(--_ctm-dn-im-se-br-se, var(--_tst-dn-br-se))
83
+ );
84
+ border-width: var(
85
+ --_show-border-im-se,
86
+ var(--_ctm-dn-im-se-br-wh, var(--_tst-dn-br-wh))
87
+ );
88
+ border-radius: var(--_ctm-dn-im-se-br-rs, var(--_tst-dn-br-rs));
89
+ box-shadow: var(
90
+ --_show-shadow-im-se,
91
+ var(--_ctm-dn-im-se-sw-ae, var(--_tst-dn-sw-ae))
92
+ var(--_ctm-dn-im-se-sw-br, var(--_tst-dn-sw-br))
93
+ var(--_ctm-dn-im-se-sw-sd, var(--_tst-dn-sw-sd))
94
+ var(--_ctm-dn-im-se-sw-cr, var(--_tst-dn-sw-cr))
95
+ );
96
+ .name {
97
+ color: var(--_ctm-dn-ln-ne-cr);
98
+ font-family: var(--_ctm-dn-ln-ne-ft-fy), sans-serif;
99
+ font-size: var(--_ctm-dn-ln-ne-ft-se);
100
+ font-weight: var(--_ctm-dn-ln-ne-ft-wt);
101
+ font-style: var(--_ctm-dn-ln-ne-ft-se-ic);
102
+ text-align: var(--_ctm-dn-ln-ne-tt-an);
103
+ letter-spacing: var(--_ctm-dn-ln-ne-lr-sg);
104
+ line-height: var(--_ctm-dn-ln-ne-le-ht);
105
+ text-decoration: var(--_ctm-dn-ln-ne-ue);
106
+ }
107
+ .address {
108
+ color: var(--_ctm-dn-ln-as-cr);
109
+ font-family: var(--_ctm-dn-ln-as-ft-fy), sans-serif;
110
+ font-size: var(--_ctm-dn-ln-as-ft-se);
111
+ font-weight: var(--_ctm-dn-ln-as-ft-wt);
112
+ font-style: var(--_ctm-dn-ln-as-ft-se-ic);
113
+ text-align: var(--_ctm-dn-ln-as-tt-an);
114
+ letter-spacing: var(--_ctm-dn-ln-as-lr-sg);
115
+ line-height: var(--_ctm-dn-ln-as-le-ht);
116
+ text-decoration: var(--_ctm-dn-ln-as-ue);
117
+ }
118
+ .inventory {
119
+ color: var(--_ctm-dn-ln-iy-cr);
120
+ font-family: var(--_ctm-dn-ln-iy-ft-fy), sans-serif;
121
+ font-size: var(--_ctm-dn-ln-iy-ft-se);
122
+ font-weight: var(--_ctm-dn-ln-iy-ft-wt);
123
+ font-style: var(--_ctm-dn-ln-iy-ft-se-ic);
124
+ text-align: var(--_ctm-dn-ln-iy-tt-an);
125
+ letter-spacing: var(--_ctm-dn-ln-iy-lr-sg);
126
+ line-height: var(--_ctm-dn-ln-iy-le-ht);
127
+ text-decoration: var(--_ctm-dn-ln-iy-ue);
128
+ }
129
+ .status {
130
+ color: var(--_ctm-dn-ln-iy-ss-cr);
131
+ font-family: var(--_ctm-dn-ln-iy-ss-ft-fy), sans-serif;
132
+ font-size: var(--_ctm-dn-ln-iy-ss-ft-se);
133
+ font-weight: var(--_ctm-dn-ln-iy-ss-ft-wt);
134
+ font-style: var(--_ctm-dn-ln-iy-ss-ft-se-ic);
135
+ text-align: var(--_ctm-dn-ln-iy-ss-tt-an);
136
+ letter-spacing: var(--_ctm-dn-ln-iy-ss-lr-sg);
137
+ line-height: var(--_ctm-dn-ln-iy-ss-le-ht);
138
+ text-decoration: var(--_ctm-dn-ln-iy-ss-ue);
139
+ }
140
+ }
141
+ }
142
+ .vertical {
143
+ display: flex;
144
+ flex-direction: column;
145
+ align-items: flex-start;
146
+ gap: var(--_ctm-lt-im-sg);
147
+
148
+ .item {
149
+ display: flex;
150
+ flex-direction: column;
151
+ width: 100%;
152
+ padding: var(--_ctm-dn-im-se-vl-pg) var(--_ctm-dn-im-se-hl-pg);
153
+ display: flex;
154
+ flex-direction: column;
155
+ background-color: var(--_ctm-dn-im-se-bd-cr);
156
+ border-color: var(
157
+ --_show-border-im-se,
158
+ var(--_ctm-dn-im-se-br-cr, var(--_tst-dn-br-cr))
159
+ );
160
+ border-style: var(
161
+ --_show-border-im-se,
162
+ var(--_ctm-dn-im-se-br-se, var(--_tst-dn-br-se))
163
+ );
164
+ border-width: var(
165
+ --_show-border-im-se,
166
+ var(--_ctm-dn-im-se-br-wh, var(--_tst-dn-br-wh))
167
+ );
168
+ border-radius: var(--_ctm-dn-im-se-br-rs, var(--_tst-dn-br-rs));
169
+ box-shadow: var(
170
+ --_show-shadow-im-se,
171
+ var(--_ctm-dn-im-se-sw-ae, var(--_tst-dn-sw-ae))
172
+ var(--_ctm-dn-im-se-sw-br, var(--_tst-dn-sw-br))
173
+ var(--_ctm-dn-im-se-sw-sd, var(--_tst-dn-sw-sd))
174
+ var(--_ctm-dn-im-se-sw-cr, var(--_tst-dn-sw-cr))
175
+ );
176
+ .name {
177
+ color: var(--_ctm-dn-ln-ne-cr);
178
+ font-family: var(--_ctm-dn-ln-ne-ft-fy), sans-serif;
179
+ font-size: var(--_ctm-dn-ln-ne-ft-se);
180
+ font-weight: var(--_ctm-dn-ln-ne-ft-wt);
181
+ font-style: var(--_ctm-dn-ln-ne-ft-se-ic);
182
+ text-align: var(--_ctm-dn-ln-ne-tt-an);
183
+ letter-spacing: var(--_ctm-dn-ln-ne-lr-sg);
184
+ line-height: var(--_ctm-dn-ln-ne-le-ht);
185
+ text-decoration: var(--_ctm-dn-ln-ne-ue);
186
+ }
187
+ .address {
188
+ color: var(--_ctm-dn-ln-as-cr);
189
+ font-family: var(--_ctm-dn-ln-as-ft-fy), sans-serif;
190
+ font-size: var(--_ctm-dn-ln-as-ft-se);
191
+ font-weight: var(--_ctm-dn-ln-as-ft-wt);
192
+ font-style: var(--_ctm-dn-ln-as-ft-se-ic);
193
+ text-align: var(--_ctm-dn-ln-as-tt-an);
194
+ letter-spacing: var(--_ctm-dn-ln-as-lr-sg);
195
+ line-height: var(--_ctm-dn-ln-as-le-ht);
196
+ text-decoration: var(--_ctm-dn-ln-as-ue);
197
+ }
198
+ .inventory {
199
+ color: var(--_ctm-dn-ln-iy-cr);
200
+ font-family: var(--_ctm-dn-ln-iy-ft-fy), sans-serif;
201
+ font-size: var(--_ctm-dn-ln-iy-ft-se);
202
+ font-weight: var(--_ctm-dn-ln-iy-ft-wt);
203
+ font-style: var(--_ctm-dn-ln-iy-ft-se-ic);
204
+ text-align: var(--_ctm-dn-ln-iy-tt-an);
205
+ letter-spacing: var(--_ctm-dn-ln-iy-lr-sg);
206
+ line-height: var(--_ctm-dn-ln-iy-le-ht);
207
+ text-decoration: var(--_ctm-dn-ln-iy-ue);
208
+ }
209
+ .status {
210
+ color: var(--_ctm-dn-ln-iy-ss-cr);
211
+ font-family: var(--_ctm-dn-ln-iy-ss-ft-fy), sans-serif;
212
+ font-size: var(--_ctm-dn-ln-iy-ss-ft-se);
213
+ font-weight: var(--_ctm-dn-ln-iy-ss-ft-wt);
214
+ font-style: var(--_ctm-dn-ln-iy-ss-ft-se-ic);
215
+ text-align: var(--_ctm-dn-ln-iy-ss-tt-an);
216
+ letter-spacing: var(--_ctm-dn-ln-iy-ss-lr-sg);
217
+ line-height: var(--_ctm-dn-ln-iy-ss-le-ht);
218
+ text-decoration: var(--_ctm-dn-ln-iy-ss-ue);
219
+ }
220
+ }
221
+ }
222
+ }
223
+ .store__button {
224
+ .button {
225
+ display: flex;
226
+ align-items: center;
227
+ background-color: var(--_ctm-dn-vw-iy-bn-dt-se-bd-cr);
228
+ gap: var(--_ctm-dn-vw-iy-bn-dt-se-in-ad-tt-sg);
229
+ padding: 10px;
230
+ width: 100%;
231
+ justify-content: center;
232
+ min-width: 100px;
233
+ min-height: 50px;
234
+ border-color: var(
235
+ --_show-border-im-se,
236
+ var(--_ctm-dn-vw-iy-bn-dt-se-br-cr, var(--_tst-dn-br-cr))
237
+ );
238
+ border-style: var(
239
+ --_show-border-im-se,
240
+ var(--_ctm-dn-vw-iy-bn-dt-se-br-se, var(--_tst-dn-br-se))
241
+ );
242
+ border-width: var(
243
+ --_show-border-im-se,
244
+ var(--_ctm-dn-vw-iy-bn-dt-se-br-wh, var(--_tst-dn-br-wh))
245
+ );
246
+ border-radius: var(--_ctm-dn-vw-iy-bn-dt-se-br-rs, var(--_tst-dn-br-rs));
247
+ box-shadow: var(
248
+ --_show-shadow-im-se,
249
+ var(--_ctm-dn-vw-iy-bn-dt-se-sw-ae, var(--_tst-dn-sw-ae))
250
+ var(--_ctm-dn-vw-iy-bn-dt-se-sw-br, var(--_tst-dn-sw-br))
251
+ var(--_ctm-dn-vw-iy-bn-dt-se-sw-sd, var(--_tst-dn-sw-sd))
252
+ var(--_ctm-dn-vw-iy-bn-dt-se-sw-cr, var(--_tst-dn-sw-cr))
253
+ );
254
+ .icon {
255
+ svg {
256
+ width: var(--_ctm-dn-vw-iy-bn-dt-se-in-se);
257
+ height: var(--_ctm-dn-vw-iy-bn-dt-se-in-se);
258
+ path {
259
+ stroke: var(--_ctm-dn-vw-iy-bn-dt-se-in-c1);
260
+ }
261
+ }
262
+ }
263
+ .text {
264
+ color: var(--_ctm-dn-vw-iy-bn-dt-se-cr);
265
+ font-family: var(--_ctm-dn-vw-iy-bn-dt-se-ft-fy), sans-serif;
266
+ font-size: var(--_ctm-dn-vw-iy-bn-dt-se-ft-se);
267
+ font-weight: var(--_ctm-dn-vw-iy-bn-dt-se-ft-wt);
268
+ font-style: var(--_ctm-dn-vw-iy-bn-dt-se-ft-se-ic);
269
+ text-align: var(--_ctm-dn-vw-iy-bn-dt-se-tt-an);
270
+ letter-spacing: var(--_ctm-dn-vw-iy-bn-dt-se-lr-sg);
271
+ line-height: var(--_ctm-dn-vw-iy-bn-dt-se-le-ht);
272
+ text-decoration: var(--_ctm-dn-vw-iy-bn-dt-se-ue);
273
+ }
274
+ &:hover {
275
+ background-color: var(--_ctm-dn-vw-iy-bn-hr-se-bd-cr);
276
+ gap: var(--_ctm-dn-vw-iy-bn-hr-se-in-ad-tt-sg);
277
+ min-width: 100px;
278
+ min-height: 50px;
279
+ border-color: var(
280
+ --_show-border-im-se,
281
+ var(--_ctm-dn-vw-iy-bn-hr-se-br-cr, var(--_tst-dn-br-cr))
282
+ );
283
+ border-style: var(
284
+ --_show-border-im-se,
285
+ var(--_ctm-dn-vw-iy-bn-hr-se-br-se, var(--_tst-dn-br-se))
286
+ );
287
+ border-width: var(
288
+ --_show-border-im-se,
289
+ var(--_ctm-dn-vw-iy-bn-hr-se-br-wh, var(--_tst-dn-br-wh))
290
+ );
291
+ border-radius: var(--_ctm-dn-vw-iy-bn-hr-se-br-rs, var(--_tst-dn-br-rs));
292
+ box-shadow: var(
293
+ --_show-shadow-im-se,
294
+ var(--_ctm-dn-vw-iy-bn-hr-se-sw-ae, var(--_tst-dn-sw-ae))
295
+ var(--_ctm-dn-vw-iy-bn-hr-se-sw-br, var(--_tst-dn-sw-br))
296
+ var(--_ctm-dn-vw-iy-bn-hr-se-sw-sd, var(--_tst-dn-sw-sd))
297
+ var(--_ctm-dn-vw-iy-bn-hr-se-sw-cr, var(--_tst-dn-sw-cr))
298
+ );
299
+ .icon {
300
+ svg {
301
+ width: var(--_ctm-dn-vw-iy-bn-hr-se-in-se);
302
+ height: var(--_ctm-dn-vw-iy-bn-hr-se-in-se);
303
+ path {
304
+ stroke: var(--_ctm-dn-vw-iy-bn-hr-se-in-c1);
305
+ }
306
+ }
307
+ }
308
+ .text {
309
+ color: var(--_ctm-dn-vw-iy-bn-hr-se-cr);
310
+ font-family: var(--_ctm-dn-vw-iy-bn-hr-se-ft-fy), sans-serif;
311
+ font-size: var(--_ctm-dn-vw-iy-bn-hr-se-ft-se);
312
+ font-weight: var(--_ctm-dn-vw-iy-bn-hr-se-ft-wt);
313
+ font-style: var(--_ctm-dn-vw-iy-bn-hr-se-ft-se-ic);
314
+ text-align: var(--_ctm-dn-vw-iy-bn-hr-se-tt-an);
315
+ letter-spacing: var(--_ctm-dn-vw-iy-bn-hr-se-lr-sg);
316
+ line-height: var(--_ctm-dn-vw-iy-bn-hr-se-le-ht);
317
+ text-decoration: var(--_ctm-dn-vw-iy-bn-hr-se-ue);
318
+ }
319
+ }
320
+ }
321
+ .upfront_container {
322
+ margin-top: 10px;
323
+
324
+ .vertical {
325
+ display: flex;
326
+ flex-direction: column;
327
+ align-items: flex-start;
328
+ gap: var(--_ctm-lt-im-sg);
329
+
330
+ .item {
331
+ display: flex;
332
+ flex-direction: column;
333
+ width: 100%;
334
+ padding: var(--_ctm-dn-im-se-vl-pg) var(--_ctm-dn-im-se-hl-pg);
335
+ display: flex;
336
+ flex-direction: column;
337
+ background-color: var(--_ctm-dn-im-se-bd-cr);
338
+ border-color: var(
339
+ --_show-border-im-se,
340
+ var(--_ctm-dn-im-se-br-cr, var(--_tst-dn-br-cr))
341
+ );
342
+ border-style: var(
343
+ --_show-border-im-se,
344
+ var(--_ctm-dn-im-se-br-se, var(--_tst-dn-br-se))
345
+ );
346
+ border-width: var(
347
+ --_show-border-im-se,
348
+ var(--_ctm-dn-im-se-br-wh, var(--_tst-dn-br-wh))
349
+ );
350
+ border-radius: var(--_ctm-dn-im-se-br-rs, var(--_tst-dn-br-rs));
351
+ box-shadow: var(
352
+ --_show-shadow-im-se,
353
+ var(--_ctm-dn-im-se-sw-ae, var(--_tst-dn-sw-ae))
354
+ var(--_ctm-dn-im-se-sw-br, var(--_tst-dn-sw-br))
355
+ var(--_ctm-dn-im-se-sw-sd, var(--_tst-dn-sw-sd))
356
+ var(--_ctm-dn-im-se-sw-cr, var(--_tst-dn-sw-cr))
357
+ );
358
+ .name {
359
+ color: var(--_ctm-dn-ln-ne-cr);
360
+ font-family: var(--_ctm-dn-ln-ne-ft-fy), sans-serif;
361
+ font-size: var(--_ctm-dn-ln-ne-ft-se);
362
+ font-weight: var(--_ctm-dn-ln-ne-ft-wt);
363
+ font-style: var(--_ctm-dn-ln-ne-ft-se-ic);
364
+ text-align: var(--_ctm-dn-ln-ne-tt-an);
365
+ letter-spacing: var(--_ctm-dn-ln-ne-lr-sg);
366
+ line-height: var(--_ctm-dn-ln-ne-le-ht);
367
+ text-decoration: var(--_ctm-dn-ln-ne-ue);
368
+ }
369
+ .address {
370
+ color: var(--_ctm-dn-ln-as-cr);
371
+ font-family: var(--_ctm-dn-ln-as-ft-fy), sans-serif;
372
+ font-size: var(--_ctm-dn-ln-as-ft-se);
373
+ font-weight: var(--_ctm-dn-ln-as-ft-wt);
374
+ font-style: var(--_ctm-dn-ln-as-ft-se-ic);
375
+ text-align: var(--_ctm-dn-ln-as-tt-an);
376
+ letter-spacing: var(--_ctm-dn-ln-as-lr-sg);
377
+ line-height: var(--_ctm-dn-ln-as-le-ht);
378
+ text-decoration: var(--_ctm-dn-ln-as-ue);
379
+ }
380
+ .inventory {
381
+ color: var(--_ctm-dn-ln-iy-cr);
382
+ font-family: var(--_ctm-dn-ln-iy-ft-fy), sans-serif;
383
+ font-size: var(--_ctm-dn-ln-iy-ft-se);
384
+ font-weight: var(--_ctm-dn-ln-iy-ft-wt);
385
+ font-style: var(--_ctm-dn-ln-iy-ft-se-ic);
386
+ text-align: var(--_ctm-dn-ln-iy-tt-an);
387
+ letter-spacing: var(--_ctm-dn-ln-iy-lr-sg);
388
+ line-height: var(--_ctm-dn-ln-iy-le-ht);
389
+ text-decoration: var(--_ctm-dn-ln-iy-ue);
390
+ }
391
+ .status {
392
+ color: var(--_ctm-dn-ln-iy-ss-cr);
393
+ font-family: var(--_ctm-dn-ln-iy-ss-ft-fy), sans-serif;
394
+ font-size: var(--_ctm-dn-ln-iy-ss-ft-se);
395
+ font-weight: var(--_ctm-dn-ln-iy-ss-ft-wt);
396
+ font-style: var(--_ctm-dn-ln-iy-ss-ft-se-ic);
397
+ text-align: var(--_ctm-dn-ln-iy-ss-tt-an);
398
+ letter-spacing: var(--_ctm-dn-ln-iy-ss-lr-sg);
399
+ line-height: var(--_ctm-dn-ln-iy-ss-le-ht);
400
+ text-decoration: var(--_ctm-dn-ln-iy-ss-ue);
401
+ }
402
+ }
403
+ }
404
+ }
405
+ }
406
+ .table-content {
407
+ border-collapse: collapse;
408
+ border: 1px solid #000;
409
+ background-color: var(--_ctm-dn-te-bd-cr);
410
+ border-color: var(--_show-border-im-se, var(--_ctm-dn-te-br-cr, var(--_tst-dn-br-cr)));
411
+ border-style: var(--_show-border-im-se, var(--_ctm-dn-te-br-se, var(--_tst-dn-br-se)));
412
+ border-width: var(--_show-border-im-se, var(--_ctm-dn-te-br-wh, var(--_tst-dn-br-wh)));
413
+ border-radius: var(--_ctm-dn-te-br-rs, var(--_tst-dn-br-rs));
414
+ box-shadow: var(
415
+ --_show-shadow-im-se,
416
+ var(--_ctm-dn-te-sw-ae, var(--_tst-dn-sw-ae))
417
+ var(--_ctm-dn-te-sw-br, var(--_tst-dn-sw-br))
418
+ var(--_ctm-dn-te-sw-sd, var(--_tst-dn-sw-sd))
419
+ var(--_ctm-dn-te-sw-cr, var(--_tst-dn-sw-cr))
420
+ );
421
+ &[data-header-divider="true"] {
422
+ thead tr th {
423
+ border-bottom: 1px solid var(--_ctm-dn-rw-ds-hr-dr);
424
+ }
425
+ }
426
+ &[data-row-divider="true"] {
427
+ tbody tr td {
428
+ border-bottom: 1px solid var(--_ctm-dn-rw-ds-rw-dr);
429
+ }
430
+ }
431
+ &[data-column-divider="true"] {
432
+ tbody tr td,
433
+ thead tr th {
434
+ border-right: 1px solid var(--_ctm-dn-rw-ds-cn-dr);
435
+ }
23
436
 
24
- td,
25
- th {
26
- border: 1px solid #dddddd;
27
- text-align: center;
28
- padding: 8px;
437
+ tbody tr td:last-child,
438
+ thead tr th:last-child {
439
+ border-right: none;
440
+ }
441
+ }
442
+ &[data-alternative-row-colors="true"] {
443
+ tbody tr:nth-child(odd) {
444
+ background-color: var(--_gray-300);
445
+ width: 100%;
446
+ }
447
+ }
448
+ thead {
449
+ height: var(--_ctm-lt-hr-ht);
450
+ tr {
451
+ th {
452
+ padding: var(--_ctm-lt-hr-cl-pg);
453
+ text-align: var(--_ctm-lt-ct-at);
454
+ border: 0;
455
+ background-color: var(--_ctm-dn-te-hr-bd-cr);
456
+ color: var(--_ctm-dn-hr-tt-cr);
457
+ font-family: var(--_ctm-dn-hr-tt-ft-fy), sans-serif;
458
+ font-size: var(--_ctm-dn-hr-tt-ft-se);
459
+ font-weight: var(--_ctm-dn-hr-tt-ft-wt);
460
+ font-style: var(--_ctm-dn-hr-tt-ft-se-ic);
461
+ text-align: var(--_ctm-dn-hr-tt-tt-an);
462
+ letter-spacing: var(--_ctm-dn-hr-tt-lr-sg);
463
+ line-height: var(--_ctm-dn-hr-tt-le-ht);
464
+ text-decoration: var(--_ctm-dn-hr-tt-ue);
465
+ }
466
+ }
467
+ }
468
+ tbody {
469
+ tr {
470
+ padding: var(--_ctm-lt-rw-cl-pg);
471
+ height: var(--_ctm-lt-rw-ht);
472
+ background-color: var(--_ctm-dn-te-rw-bd-cr);
473
+ text-align: var(--_ctm-lt-ct-at);
474
+ th,
475
+ td {
476
+ border: 0;
477
+ padding: inherit;
478
+ color: var(--_ctm-dn-te-rw-cr);
479
+ font-family: var(--_ctm-dn-te-rw-ft-fy), sans-serif;
480
+ font-size: var(--_ctm-dn-te-rw-ft-se);
481
+ font-weight: var(--_ctm-dn-te-rw-ft-wt);
482
+ font-style: var(--_ctm-dn-te-rw-ft-se-ic);
483
+ text-align: var(--_ctm-dn-te-rw-tt-an);
484
+ letter-spacing: var(--_ctm-dn-te-rw-lr-sg);
485
+ line-height: var(--_ctm-dn-te-rw-le-ht);
486
+ text-decoration: var(--_ctm-dn-te-rw-ue);
487
+ }
488
+ }
489
+ }
490
+ }
491
+ .pagination_container {
492
+ display: flex;
493
+ justify-content: center;
494
+ align-items: center;
495
+ gap: 10px;
496
+ button {
497
+ font-size: 16px;
498
+ // padding: 10px 20px;
499
+ // background-color: #000;
500
+ color: #fff;
501
+ border: none;
502
+ cursor: pointer;
503
+ // border-radius: 10px;
504
+ }
505
+ span {
506
+ cursor: pointer;
507
+ color: var(--_ctm-dn-pn-dt-se-cr);
508
+ font-family: var(--_ctm-dn-pn-dt-se-ft-fy), sans-serif;
509
+ font-size: var(--_ctm-dn-pn-dt-se-ft-se);
510
+ font-weight: var(--_ctm-dn-pn-dt-se-ft-wt);
511
+ font-style: var(--_ctm-dn-pn-dt-se-ft-se-ic);
512
+ text-align: var(--_ctm-dn-pn-dt-se-tt-an);
513
+ letter-spacing: var(--_ctm-dn-pn-dt-se-lr-sg);
514
+ line-height: var(--_ctm-dn-pn-dt-se-le-ht);
515
+ text-decoration: var(--_ctm-dn-pn-dt-se-ue);
516
+ }
517
+ .active {
518
+ span {
519
+ background-color: var(--_ctm-dn-pn-dt-se-bd-cr);
520
+ padding: 2px;
521
+ }
522
+ }
523
+ }
524
+ .loadmore_conatiner {
525
+ display: flex;
526
+ justify-content: center;
527
+ align-items: center;
528
+ gap: 10px;
529
+ margin-top: 10px;
530
+ button {
531
+ padding: 10px;
532
+ cursor: pointer;
533
+ color: var(--_ctm-dn-sw-me-is-bn-cr);
534
+ font-family: var(--_ctm-dn-sw-me-is-bn-ft-fy), sans-serif;
535
+ font-size: var(--_ctm-dn-sw-me-is-bn-ft-se);
536
+ font-weight: var(--_ctm-dn-sw-me-is-bn-ft-wt);
537
+ font-style: var(--_ctm-dn-sw-me-is-bn-ft-se-ic);
538
+ text-align: var(--_ctm-dn-sw-me-is-bn-tt-an);
539
+ letter-spacing: var(--_ctm-dn-sw-me-is-bn-lr-sg);
540
+ line-height: var(--_ctm-dn-sw-me-is-bn-le-ht);
541
+ text-decoration: var(--_ctm-dn-sw-me-is-bn-ue);
542
+ background-color: var(--_ctm-dn-sw-me-is-bn-bd-cr);
543
+ border-color: var(
544
+ --_show-border-im-se,
545
+ var(--_ctm-dn-sw-me-is-bn-br-cr, var(--_tst-dn-br-cr))
546
+ );
547
+ border-style: var(
548
+ --_show-border-im-se,
549
+ var(--_ctm-dn-sw-me-is-bn-br-se, var(--_tst-dn-br-se))
550
+ );
551
+ border-width: var(
552
+ --_show-border-im-se,
553
+ var(--_ctm-dn-sw-me-is-bn-br-wh, var(--_tst-dn-br-wh))
554
+ );
555
+ border-radius: var(--_ctm-dn-sw-me-is-bn-br-rs, var(--_tst-dn-br-rs));
556
+ box-shadow: var(
557
+ --_show-shadow-im-se,
558
+ var(--_ctm-dn-sw-me-is-bn-sw-ae, var(--_tst-dn-sw-ae))
559
+ var(--_ctm-dn-sw-me-is-bn-sw-br, var(--_tst-dn-sw-br))
560
+ var(--_ctm-dn-sw-me-is-bn-sw-sd, var(--_tst-dn-sw-sd))
561
+ var(--_ctm-dn-sw-me-is-bn-sw-cr, var(--_tst-dn-sw-cr))
562
+ );
563
+ }
564
+ }
29
565
  }
30
566
  }
31
567
  }