@sc-360-v2/storefront-cms-library 0.3.69 → 0.3.70

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 (49) hide show
  1. package/dist/add-order.scss +31 -14
  2. package/dist/builder.js +1 -1
  3. package/dist/bulk-order-pad.scss +0 -5
  4. package/dist/bundle.scss +1 -0
  5. package/dist/cart-details.scss +45 -2
  6. package/dist/checkbox-radio.scss +16 -0
  7. package/dist/checkout.scss +63 -63
  8. package/dist/confirmationModal.scss +2 -4
  9. package/dist/dropdownTemplate.scss +285 -307
  10. package/dist/employee-bulk-order.scss +2674 -2667
  11. package/dist/modal.scss +7 -0
  12. package/dist/profile.scss +2 -1
  13. package/dist/quick-links.scss +175 -18
  14. package/dist/request-for-quotes.scss +348 -48
  15. package/dist/skeleton.scss +1 -1
  16. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +11 -11
  17. package/dist/types/builder/tools/element-edit/breadcrumbs.d.ts +1 -1
  18. package/dist/types/builder/tools/element-edit/bundle.d.ts +5 -1
  19. package/dist/types/builder/tools/element-edit/bundleDetails.d.ts +1 -1
  20. package/dist/types/builder/tools/element-edit/buttonInstance.d.ts +3 -24
  21. package/dist/types/builder/tools/element-edit/buyForWithTab.d.ts +18 -18
  22. package/dist/types/builder/tools/element-edit/cartAttributes.d.ts +10 -10
  23. package/dist/types/builder/tools/element-edit/cartDetails.d.ts +3 -3
  24. package/dist/types/builder/tools/element-edit/cartSummary.d.ts +30 -114
  25. package/dist/types/builder/tools/element-edit/checkout.d.ts +39 -57
  26. package/dist/types/builder/tools/element-edit/common.d.ts +1 -1
  27. package/dist/types/builder/tools/element-edit/countdown.d.ts +1 -1
  28. package/dist/types/builder/tools/element-edit/filterResults.d.ts +3 -17
  29. package/dist/types/builder/tools/element-edit/grid.d.ts +3 -3
  30. package/dist/types/builder/tools/element-edit/icon-list.d.ts +2 -9
  31. package/dist/types/builder/tools/element-edit/iconLibrary.d.ts +1 -1
  32. package/dist/types/builder/tools/element-edit/layouter-pro-item.d.ts +2 -2
  33. package/dist/types/builder/tools/element-edit/layouterPro.d.ts +2 -2
  34. package/dist/types/builder/tools/element-edit/line.d.ts +1 -1
  35. package/dist/types/builder/tools/element-edit/marchandiserSets.d.ts +1 -1
  36. package/dist/types/builder/tools/element-edit/orderStatus.d.ts +24 -24
  37. package/dist/types/builder/tools/element-edit/productCustomizations.d.ts +1 -1
  38. package/dist/types/builder/tools/element-edit/quickLinks.d.ts +4 -4
  39. package/dist/types/builder/tools/element-edit/scroll.d.ts +1 -1
  40. package/dist/types/builder/tools/element-edit/shipping-payments.d.ts +4 -22
  41. package/dist/types/builder/tools/element-edit/shippingEstimator.d.ts +1 -1
  42. package/dist/types/builder/tools/element-edit/social.d.ts +1 -1
  43. package/dist/types/builder/tools/element-edit/table.d.ts +1 -0
  44. package/dist/types/builder/tools/element-edit/tabs.d.ts +1 -1
  45. package/dist/types/builder/tools/element-edit/tabsV2.d.ts +1 -1
  46. package/dist/types/builder/tools/element-edit/userElements.d.ts +5 -5
  47. package/dist/types/builder/tools/element-edit/video.d.ts +14 -9
  48. package/dist/video.scss +9 -4
  49. package/package.json +1 -1
package/dist/modal.scss CHANGED
@@ -462,6 +462,13 @@ $shadow-md: 0 8px 20px rgba(0, 0, 0, 0.1);
462
462
  flex: 1 1 auto;
463
463
  overflow-y: auto;
464
464
 
465
+ .dropdown-with-input-section {
466
+ // border: 0.5px solid var(--_gray-300);
467
+ .dropdown-menu {
468
+ margin-left: -7px !important;
469
+ }
470
+ }
471
+
465
472
  .wishlist-modal {
466
473
  display: flex;
467
474
  flex-direction: column;
package/dist/profile.scss CHANGED
@@ -301,9 +301,10 @@
301
301
  --_ctm-mob-dn-dn-is-dt-se-bd-cr,
302
302
  var(--_ctm-tab-dn-dn-is-dt-se-bd-cr, var(--_ctm-dn-dn-is-dt-se-bd-cr))
303
303
  );
304
- border-radius: 10px;
304
+ border-radius: 4px;
305
305
  // padding: 8px 0;
306
306
  z-index: 10;
307
+ overflow: hidden;
307
308
  }
308
309
 
309
310
  .add_order_item {
@@ -30,6 +30,154 @@
30
30
  // height: 100%;
31
31
  }
32
32
 
33
+ // &[data-items-default-border="true"] {
34
+ // .quick__links__container .items__container .links__item {
35
+ // border-width: prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-wh);
36
+ // border-color: prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-cr);
37
+ // border-style: prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-se);
38
+ // border-radius: prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-rs);
39
+ // }
40
+ // }
41
+
42
+ // &[data-items-hover-border="true"] {
43
+ // .quick__links__container .items__container .links__item:hover {
44
+ // border-width: prepareMediaVariable(--_ctm-dn-im-se-hr-se-br-wh);
45
+ // border-color: prepareMediaVariable(--_ctm-dn-im-se-hr-se-br-cr);
46
+ // border-style: prepareMediaVariable(--_ctm-dn-im-se-hr-se-br-se);
47
+ // border-radius: prepareMediaVariable(--_ctm-dn-im-se-hr-se-br-rs);
48
+ // }
49
+ // }
50
+
51
+ // &[data-items-default-shadow="true"] {
52
+ // .quick__links__container .items__container .links__item {
53
+ // box-shadow: prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-ae)
54
+ // prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-br)
55
+ // prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-sd)
56
+ // prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-cr);
57
+ // }
58
+ // }
59
+
60
+ // &[data-items-hover-shadow="true"] {
61
+ // .quick__links__container .items__container .links__item:hover {
62
+ // box-shadow: prepareMediaVariable(--_ctm-dn-im-se-hr-se-sw-ae)
63
+ // prepareMediaVariable(--_ctm-dn-im-se-hr-se-sw-br)
64
+ // prepareMediaVariable(--_ctm-dn-im-se-hr-se-sw-sd)
65
+ // prepareMediaVariable(--_ctm-dn-im-se-hr-se-sw-cr);
66
+ // }
67
+ // }
68
+
69
+ &[data-items-default-border="true"] {
70
+ .quick__links__container .items__container .links__item,
71
+ .quick__links__container
72
+ .items__container
73
+ .dropdown__container
74
+ .est__dropdown__main
75
+ .est__dropdown
76
+ .list
77
+ .list__option {
78
+ border-width: prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-wh);
79
+ border-color: prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-cr);
80
+ border-style: prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-se);
81
+ border-radius: prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-rs);
82
+ }
83
+ }
84
+
85
+ &[data-items-hover-border="true"] {
86
+ .quick__links__container .items__container .links__item:hover,
87
+ .quick__links__container
88
+ .items__container
89
+ .dropdown__container
90
+ .est__dropdown__main
91
+ .est__dropdown
92
+ .list
93
+ .list__option:hover {
94
+ border-width: prepareMediaVariable(--_ctm-dn-im-se-hr-se-br-wh);
95
+ border-color: prepareMediaVariable(--_ctm-dn-im-se-hr-se-br-cr);
96
+ border-style: prepareMediaVariable(--_ctm-dn-im-se-hr-se-br-se);
97
+ border-radius: prepareMediaVariable(--_ctm-dn-im-se-hr-se-br-rs);
98
+ }
99
+ }
100
+
101
+ &[data-items-default-shadow="true"] {
102
+ .quick__links__container .items__container .links__item,
103
+ .quick__links__container
104
+ .items__container
105
+ .dropdown__container
106
+ .est__dropdown__main
107
+ .est__dropdown
108
+ .list
109
+ .list__option {
110
+ box-shadow: prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-ae)
111
+ prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-br)
112
+ prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-sd)
113
+ prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-cr);
114
+ }
115
+ }
116
+
117
+ &[data-items-hover-shadow="true"] {
118
+ .quick__links__container .items__container .links__item:hover,
119
+ .quick__links__container
120
+ .items__container
121
+ .dropdown__container
122
+ .est__dropdown__main
123
+ .est__dropdown
124
+ .list
125
+ .list__option:hover {
126
+ box-shadow: prepareMediaVariable(--_ctm-dn-im-se-hr-se-sw-ae)
127
+ prepareMediaVariable(--_ctm-dn-im-se-hr-se-sw-br)
128
+ prepareMediaVariable(--_ctm-dn-im-se-hr-se-sw-sd)
129
+ prepareMediaVariable(--_ctm-dn-im-se-hr-se-sw-cr);
130
+ }
131
+ }
132
+
133
+ &[data-items-alignment="left"] {
134
+ .quick__links__container {
135
+ .items__container,
136
+ .items__container .dropdown__container .est__dropdown__main .est__dropdown {
137
+ justify-content: flex-start;
138
+ align-items: flex-start;
139
+
140
+ .est__dropdown__button,
141
+ .list {
142
+ justify-content: flex-start;
143
+ align-items: flex-start;
144
+ }
145
+ }
146
+ }
147
+ }
148
+
149
+ &[data-items-alignment="center"] {
150
+ .quick__links__container {
151
+ .items__container,
152
+ .items__container .dropdown__container .est__dropdown__main .est__dropdown {
153
+ justify-content: center;
154
+ align-items: center;
155
+
156
+ .est__dropdown__button,
157
+ .list {
158
+ justify-content: center;
159
+ align-items: center;
160
+ }
161
+ }
162
+ }
163
+ }
164
+
165
+ &[data-items-alignment="right"] {
166
+ .quick__links__container {
167
+ .items__container,
168
+ .items__container .dropdown__container .est__dropdown__main .est__dropdown {
169
+ justify-content: flex-end;
170
+ align-items: flex-end;
171
+
172
+ .est__dropdown__button,
173
+ .list {
174
+ justify-content: flex-end;
175
+ align-items: flex-end;
176
+ }
177
+ }
178
+ }
179
+ }
180
+
33
181
  &[data-display-style="Vertical"] {
34
182
  .quick__links__container .items__container {
35
183
  display: flex;
@@ -354,28 +502,37 @@
354
502
  }
355
503
 
356
504
  .items__container {
357
- .links__item {
505
+ .links__item,
506
+ .dropdown__container .est__dropdown__main .est__dropdown .list .list__option {
358
507
  display: block;
359
- font-family: prepareMediaVariable(--_ctm-dn-im-se-ft-fy);
360
- font-size: prepareMediaVariable(--_ctm-dn-im-se-ft-se);
361
- color: prepareMediaVariable(--_ctm-dn-im-se-cr);
362
- font-weight: prepareMediaVariable(--_ctm-dn-im-se-ft-wt);
363
- font-style: prepareMediaVariable(--_ctm-dn-im-se-ft-se-ic);
364
- text-decoration: prepareMediaVariable(--_ctm-dn-im-se-ue);
365
- text-align: prepareMediaVariable(--_ctm-dn-im-se-tt-an);
366
- letter-spacing: prepareMediaVariable(--_ctm-dn-im-se-lr-sg);
367
- line-height: prepareMediaVariable(--_ctm-dn-im-se-le-ht);
368
- background-color: prepareMediaVariable(--_ctm-dn-im-se-bd-cr);
369
- border-width: prepareMediaVariable(--_ctm-dn-im-se-br-wh);
370
- border-color: prepareMediaVariable(--_ctm-dn-im-se-br-cr);
371
- border-style: prepareMediaVariable(--_ctm-dn-im-se-br-se);
372
- border-radius: prepareMediaVariable(--_ctm-dn-im-se-br-rs);
373
- box-shadow: prepareMediaVariable(--_ctm-dn-im-se-sw-ae)
374
- prepareMediaVariable(--_ctm-dn-im-se-sw-br) prepareMediaVariable(--_ctm-dn-im-se-sw-sd)
375
- prepareMediaVariable(--_ctm-dn-im-se-sw-cr);
508
+ font-family: prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-fy);
509
+ font-size: prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-se);
510
+ color: prepareMediaVariable(--_ctm-dn-im-se-dt-se-cr);
511
+ font-weight: prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-wt);
512
+ font-style: prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-se-ic);
513
+ text-decoration: prepareMediaVariable(--_ctm-dn-im-se-dt-se-ue);
514
+ text-align: prepareMediaVariable(--_ctm-dn-im-se-dt-se-tt-an);
515
+ letter-spacing: prepareMediaVariable(--_ctm-dn-im-se-dt-se-lr-sg);
516
+ line-height: prepareMediaVariable(--_ctm-dn-im-se-dt-se-le-ht);
517
+ background-color: prepareMediaVariable(--_ctm-dn-im-se-dt-se-bd-cr);
376
518
  padding: 2px 8px;
377
519
  width: fit-content;
520
+
521
+ &:hover {
522
+ font-family: prepareMediaVariable(--_ctm-dn-im-se-hr-se-ft-fy);
523
+ font-size: prepareMediaVariable(--_ctm-dn-im-se-hr-se-ft-se);
524
+ color: prepareMediaVariable(--_ctm-dn-im-se-hr-se-cr);
525
+ font-weight: prepareMediaVariable(--_ctm-dn-im-se-hr-se-ft-wt);
526
+ font-style: prepareMediaVariable(--_ctm-dn-im-se-hr-se-ft-se-ic);
527
+ text-decoration: prepareMediaVariable(--_ctm-dn-im-se-hr-se-ue);
528
+ text-align: prepareMediaVariable(--_ctm-dn-im-se-hr-se-tt-an);
529
+ letter-spacing: prepareMediaVariable(--_ctm-dn-im-se-hr-se-lr-sg);
530
+ line-height: prepareMediaVariable(--_ctm-dn-im-se-hr-se-le-ht);
531
+ background-color: prepareMediaVariable(--_ctm-dn-im-se-hr-se-bd-cr);
532
+ }
378
533
  }
534
+ }
535
+ .items__container {
379
536
  .dropdown__container {
380
537
  .est__dropdown__main {
381
538
  .est__dropdown {
@@ -2,7 +2,8 @@
2
2
  @use "sass:list";
3
3
 
4
4
  [data-div-type="element"] {
5
- &[data-element-type="myTemplates"] {
5
+ &[data-element-type="requestForQuote"] {
6
+ margin: 0;
6
7
  // width: var(--_lt-wh);
7
8
  // height: var(--_lt-ht);
8
9
  // margin: var(--_lt-mn);
@@ -10,13 +11,13 @@
10
11
  // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
11
12
  // width: 50%;
12
13
  // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
13
- width: var(
14
- --_sf-el-wh-st-mx,
15
- calc(
16
- 1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
17
- )
18
- );
19
- margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
14
+ // width: var(
15
+ // --_sf-el-wh-st-mx,
16
+ // calc(
17
+ // 1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
18
+ // )
19
+ // );
20
+ // margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
20
21
 
21
22
  // height: clamp(var(--_ctm-lt-ht, 50px), 100px, auto) !important;
22
23
  // height: var(--_ctm-lt-ht);
@@ -32,53 +33,352 @@
32
33
  // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
33
34
  // }
34
35
 
36
+ width: 100%;
37
+
35
38
  & > .wrapper {
36
39
  // width: 100%;
37
40
  // height: 100%;
41
+
42
+ .quotes_wrapper {
43
+ display: flex;
44
+ flex-direction: column;
45
+ gap: 24px;
46
+
47
+ .quotes_header {
48
+ width: 100%;
49
+ display: flex;
50
+
51
+ justify-content: space-between;
52
+ align-items: center;
53
+ h2 {
54
+ font-size: 24px;
55
+ color: var(--_gray-900);
56
+ }
57
+ .back_to_cart {
58
+ color: var(--_primary-400);
59
+ &:hover {
60
+ text-decoration: underline;
61
+ }
62
+ }
63
+ }
64
+
65
+ .quotes_body {
66
+ display: flex;
67
+ gap: 60px;
68
+ .quote-items {
69
+ flex: 2;
70
+ .quote-item {
71
+ // padding: 32px 0;
72
+ display: flex;
73
+ gap: 24px;
74
+ &:not(:last-child) {
75
+ border-bottom: 1px dotted var(--_gray-400);
76
+ }
77
+ &:not(:last-child) {
78
+ padding-bottom: 12px;
79
+ }
80
+ &:not(:first-child) {
81
+ padding-top: 12px;
82
+ }
83
+
84
+ .quote-item__image {
85
+ width: 120px;
86
+ height: 120px;
87
+ object-fit: cover;
88
+ border-radius: 4px;
89
+ background-color: #f0f0f0;
90
+ }
91
+
92
+ .quote-item__details {
93
+ flex: 1;
94
+ display: flex;
95
+ flex-direction: column;
96
+
97
+ .quote-item__header {
98
+ margin-bottom: 16px;
99
+ padding-bottom: 16px;
100
+ border-bottom: 1px dotted #d0d0d0;
101
+
102
+ .quote-item__title {
103
+ font-size: 16px;
104
+ font-weight: 600;
105
+ color: #111;
106
+ }
107
+
108
+ .quote-item__meta {
109
+ display: flex;
110
+ gap: 10px;
111
+ font-size: 14px;
112
+ color: var(--_gray-500);
113
+ }
114
+ }
115
+
116
+ .quote-item__row {
117
+ display: flex;
118
+ gap: 16px;
119
+ align-items: flex-start;
120
+
121
+ .field {
122
+ display: flex;
123
+ flex-direction: column;
124
+ font-size: 14px;
125
+ &.price_column {
126
+ padding-right: 40px;
127
+ }
128
+
129
+ label {
130
+ margin-bottom: 6px;
131
+ font-weight: 500;
132
+ color: #333;
133
+ }
134
+
135
+ .value {
136
+ font-weight: 600;
137
+ font-size: 16px;
138
+ color: #111;
139
+ }
140
+
141
+ input {
142
+ height: 40px;
143
+ padding: 8px 12px;
144
+ font-size: 15px;
145
+ border: 1px solid #ccc;
146
+ border-radius: 4px;
147
+ outline: none;
148
+ width: 130px;
149
+
150
+ &:focus {
151
+ border-color: #2563eb;
152
+ box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.3);
153
+ }
154
+ }
155
+
156
+ .input-with-prefix {
157
+ display: flex;
158
+ align-items: center;
159
+ border: 1px solid #ccc;
160
+ border-radius: 4px;
161
+ overflow: hidden;
162
+ width: 130px;
163
+ height: 40px;
164
+ &:focus-within {
165
+ border: 1px solid var(--_primary-300);
166
+ outline: 2px solid var(--_primary-100);
167
+ }
168
+
169
+ span {
170
+ padding: 0 8px;
171
+ font-size: 15px;
172
+ color: var(--_gray-500);
173
+ display: flex;
174
+ align-items: center;
175
+ }
176
+
177
+ input {
178
+ border: none;
179
+ width: 100%;
180
+ height: 100%;
181
+ padding-left: 6px;
182
+ &:focus {
183
+ box-shadow: none;
184
+ outline: none;
185
+ }
186
+ }
187
+ }
188
+ }
189
+
190
+ .quote-item__totals {
191
+ display: flex;
192
+ flex-direction: column;
193
+ gap: 16px;
194
+ text-align: right;
195
+ margin-left: auto;
196
+ min-width: 180px;
197
+
198
+ .quote-total {
199
+ display: flex;
200
+ flex-direction: column;
201
+
202
+ > div {
203
+ display: flex;
204
+ justify-content: flex-end;
205
+ align-items: baseline;
206
+ gap: 4px;
207
+
208
+ .label {
209
+ font-size: 14px;
210
+ color: #444;
211
+ }
212
+
213
+ .amount {
214
+ font-size: 18px;
215
+ font-weight: 700;
216
+ color: #111;
217
+ }
218
+ }
219
+
220
+ small {
221
+ font-size: 13px;
222
+ color: #888;
223
+ margin-top: 4px;
224
+ }
225
+
226
+ &.discounted {
227
+ .label {
228
+ color: #198754;
229
+ }
230
+
231
+ .amount {
232
+ color: #198754;
233
+ }
234
+ }
235
+ }
236
+ }
237
+ }
238
+ }
239
+ }
240
+ }
241
+
242
+ .quote-summary {
243
+ background: var(--_base-white);
244
+ border: 1px solid var(--_gray-300);
245
+ border-radius: 4px;
246
+ width: 100%;
247
+ max-width: 400px;
248
+ overflow: hidden;
249
+ height: fit-content;
250
+ position: sticky;
251
+ top: 10px;
252
+
253
+ &__row {
254
+ display: flex;
255
+ justify-content: space-between;
256
+ align-items: center;
257
+ padding: 12px 0;
258
+ border-bottom: 1px dotted #ccc;
259
+
260
+ .label {
261
+ font-size: 14px;
262
+ color: #666;
263
+ }
264
+
265
+ .value {
266
+ font-size: 16px;
267
+ font-weight: 500;
268
+ color: #333;
269
+
270
+ &.highlight {
271
+ font-size: 20px;
272
+ font-weight: 700;
273
+ color: #000;
274
+ }
275
+ }
276
+
277
+ &--quoted {
278
+ margin-bottom: 20px;
279
+ }
280
+ .label-quote {
281
+ font-weight: 600;
282
+ }
283
+ }
284
+
285
+ &__notes {
286
+ width: 100%;
287
+ height: 100px;
288
+ padding: 12px;
289
+ border: 1px solid #ddd;
290
+ border-radius: 4px;
291
+ resize: none;
292
+ font-size: 14px;
293
+ font-family: inherit;
294
+ margin-bottom: 20px;
295
+ box-sizing: border-box;
296
+ margin-top: 6px;
297
+
298
+ &::placeholder {
299
+ color: #999;
300
+ }
301
+
302
+ &:focus {
303
+ outline: none;
304
+ border-color: var(--_primary-500);
305
+ }
306
+ }
307
+
308
+ &__button {
309
+ width: 100%;
310
+ padding: 14px;
311
+ background-color: var(--_primary-400);
312
+ color: var(--_base-white);
313
+ font-size: 16px;
314
+ font-weight: 600;
315
+ border: none;
316
+ border-radius: 4px;
317
+ cursor: pointer;
318
+ transition: background-color 0.2s ease;
319
+
320
+ &:hover {
321
+ background-color: var(--_primary-500);
322
+ }
323
+ }
324
+ & > h3 {
325
+ font-size: 16px;
326
+ font-weight: 700;
327
+ color: var(--_gray-900);
328
+ background-color: #f5f5f5;
329
+ padding: 12px;
330
+ border-bottom: 1px solid var(--_gray-300);
331
+ }
332
+ .quote-summary-body {
333
+ padding: 0px 16px 16px 16px;
334
+ }
335
+ }
336
+ }
337
+ }
38
338
  }
39
339
  &[data-show-shadow="false"] {
40
340
  --_show-shadow: none;
41
341
  }
42
342
 
43
- .accordion-element {
44
- background-color: var(
45
- --_ctm-mob-dn-fq-wt-bd-cr,
46
- var(--_ctm-tab-dn-fq-wt-bd-cr, var(--_ctm-dn-fq-wt-bd-cr))
47
- );
48
- padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
49
- display: flex;
50
- flex-direction: column;
51
- --_sf-gp: var(
52
- --_ctm-mob-lt-im-sg,
53
- var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px))
54
- );
55
- --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
56
- row-gap: var(--_sf-gp);
57
- width: 100%;
58
- // height: 100%;
59
- border-color: var(
60
- --_ctm-mob-dn-fq-wt-br-cr,
61
- var(--_ctm-tab-dn-fq-wt-br-cr, var(--_ctm-dn-fq-wt-br-cr))
62
- );
63
- border-style: var(
64
- --_ctm-mob-dn-fq-wt-br-se,
65
- var(--_ctm-tab-dn-fq-wt-br-se, var(--_ctm-dn-fq-wt-br-se))
66
- );
67
- border-width: var(
68
- --_ctm-mob-dn-fq-wt-br-wh,
69
- var(--_ctm-tab-dn-fq-wt-br-wh, var(--_ctm-dn-fq-wt-br-wh))
70
- );
71
- border-radius: var(
72
- --_ctm-mob-dn-fq-wt-br-rs,
73
- var(--_ctm-tab-dn-fq-wt-br-rs, var(--_ctm-dn-fq-wt-br-rs))
74
- );
75
- box-shadow: var(
76
- --_show-shadow,
77
- var(--_ctm-mob-dn-fq-wt-sw-ae, var(--_ctm-tab-dn-fq-wt-sw-ae, var(--_ctm-dn-fq-wt-sw-ae)))
78
- var(--_ctm-mob-dn-fq-wt-sw-br, var(--_ctm-tab-dn-fq-wt-sw-br, var(--_ctm-dn-fq-wt-sw-br)))
79
- var(--_ctm-mob-dn-fq-wt-sw-sd, var(--_ctm-tab-dn-fq-wt-sw-sd, var(--_ctm-dn-fq-wt-sw-sd)))
80
- var(--_ctm-mob-dn-fq-wt-sw-cr, var(--_ctm-tab-dn-fq-wt-sw-cr, var(--_ctm-dn-fq-wt-sw-cr)))
81
- );
82
- }
343
+ // .accordion-element {
344
+ // background-color: var(
345
+ // --_ctm-mob-dn-fq-wt-bd-cr,
346
+ // var(--_ctm-tab-dn-fq-wt-bd-cr, var(--_ctm-dn-fq-wt-bd-cr))
347
+ // );
348
+ // padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
349
+ // display: flex;
350
+ // flex-direction: column;
351
+ // --_sf-gp: var(
352
+ // --_ctm-mob-lt-im-sg,
353
+ // var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px))
354
+ // );
355
+ // --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
356
+ // row-gap: var(--_sf-gp);
357
+ // width: 100%;
358
+ // // height: 100%;
359
+ // border-color: var(
360
+ // --_ctm-mob-dn-fq-wt-br-cr,
361
+ // var(--_ctm-tab-dn-fq-wt-br-cr, var(--_ctm-dn-fq-wt-br-cr))
362
+ // );
363
+ // border-style: var(
364
+ // --_ctm-mob-dn-fq-wt-br-se,
365
+ // var(--_ctm-tab-dn-fq-wt-br-se, var(--_ctm-dn-fq-wt-br-se))
366
+ // );
367
+ // border-width: var(
368
+ // --_ctm-mob-dn-fq-wt-br-wh,
369
+ // var(--_ctm-tab-dn-fq-wt-br-wh, var(--_ctm-dn-fq-wt-br-wh))
370
+ // );
371
+ // border-radius: var(
372
+ // --_ctm-mob-dn-fq-wt-br-rs,
373
+ // var(--_ctm-tab-dn-fq-wt-br-rs, var(--_ctm-dn-fq-wt-br-rs))
374
+ // );
375
+ // box-shadow: var(
376
+ // --_show-shadow,
377
+ // var(--_ctm-mob-dn-fq-wt-sw-ae, var(--_ctm-tab-dn-fq-wt-sw-ae, var(--_ctm-dn-fq-wt-sw-ae)))
378
+ // var(--_ctm-mob-dn-fq-wt-sw-br, var(--_ctm-tab-dn-fq-wt-sw-br, var(--_ctm-dn-fq-wt-sw-br)))
379
+ // var(--_ctm-mob-dn-fq-wt-sw-sd, var(--_ctm-tab-dn-fq-wt-sw-sd, var(--_ctm-dn-fq-wt-sw-sd)))
380
+ // var(--_ctm-mob-dn-fq-wt-sw-cr, var(--_ctm-tab-dn-fq-wt-sw-cr, var(--_ctm-dn-fq-wt-sw-cr)))
381
+ // );
382
+ // }
83
383
  }
84
384
  }
@@ -1,6 +1,6 @@
1
1
  .skeleton__element {
2
2
  background-color: var(--_gray-300);
3
- border-radius: 6px;
3
+ border-radius: 4px;
4
4
  position: var(--_p-relative);
5
5
  overflow: hidden;
6
6
  &.rounded {