@sc-360-v2/storefront-cms-library 0.5.43 → 0.5.44

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 (13) hide show
  1. package/dist/builder.js +1 -1
  2. package/dist/faq.scss +46 -0
  3. package/dist/form-preview.scss +28 -3
  4. package/dist/map.scss +55 -4
  5. package/dist/profile.scss +210 -174
  6. package/dist/quick-links.scss +39 -6
  7. package/dist/rfqs.scss +822 -736
  8. package/dist/search.scss +236 -1
  9. package/dist/types/builder/tools/element-edit/profile.d.ts +16 -1
  10. package/dist/types/builder/tools/element-edit/quickLinks.d.ts +6 -0
  11. package/dist/types/builder/tools/element-edit/rfqs.d.ts +45 -1
  12. package/dist/types/builder/tools/element-edit/search.d.ts +20 -1
  13. package/package.json +1 -1
package/dist/faq.scss CHANGED
@@ -299,6 +299,29 @@
299
299
  }
300
300
  }
301
301
  }
302
+ .accordion-items {
303
+ display: flex;
304
+ gap: 8px;
305
+ .icon {
306
+ display: var(--_hover-show-icon, var(--_show-icon, flex));
307
+ svg {
308
+ width: var(
309
+ --_ctm-mob-dn-io-in-in-se,
310
+ var(--_ctm-tab-dn-io-in-in-se, var(--_ctm-dn-io-in-in-se))
311
+ );
312
+ height: var(
313
+ --_ctm-mob-dn-io-in-in-se,
314
+ var(--_ctm-tab-dn-io-in-in-se, var(--_ctm-dn-io-in-in-se))
315
+ );
316
+ path {
317
+ stroke: var(
318
+ --_ctm-mob-dn-io-in-in-c1,
319
+ var(--_ctm-tab-dn-io-in-in-c1, var(--_ctm-dn-io-in-in-c1))
320
+ );
321
+ }
322
+ }
323
+ }
324
+ }
302
325
  }
303
326
  .accordion-description {
304
327
  display: none;
@@ -461,6 +484,29 @@
461
484
  }
462
485
  }
463
486
  }
487
+ .accordion-items {
488
+ display: flex;
489
+ gap: 8px;
490
+ .icon {
491
+ display: var(--_hover-show-icon, var(--_show-icon, flex));
492
+ svg {
493
+ width: var(
494
+ --_ctm-mob-dn-io-in-in-se,
495
+ var(--_ctm-tab-dn-io-in-in-se, var(--_ctm-dn-io-in-in-se))
496
+ );
497
+ height: var(
498
+ --_ctm-mob-dn-io-in-in-se,
499
+ var(--_ctm-tab-dn-io-in-in-se, var(--_ctm-dn-io-in-in-se))
500
+ );
501
+ path {
502
+ stroke: var(
503
+ --_ctm-mob-dn-io-in-in-c1,
504
+ var(--_ctm-tab-dn-io-in-in-c1, var(--_ctm-dn-io-in-in-c1))
505
+ );
506
+ }
507
+ }
508
+ }
509
+ }
464
510
  }
465
511
  .accordion-description {
466
512
  display: block;
package/dist/form-preview.scss CHANGED
@@ -12,11 +12,36 @@
12
12
  align-items: center;
13
13
  justify-content: center;
14
14
  padding: 20px;
15
- height: 100%;
15
+ // height: 100%;
16
16
  width: 100%;
17
- border-radius: 5px;
18
17
  text-align: center;
19
- background-color: #ffffff;
18
+ background-color: var(
19
+ --_ctm-mob-dn-fm-cr-bd-cr,
20
+ var(--_ctm-tab-dn-fm-cr-bd-cr, var(--_ctm-dn-fm-cr-bd-cr))
21
+ );
22
+ border-color: var(
23
+ --_ctm-mob-dn-fm-cr-br-cr,
24
+ var(--_ctm-tab-dn-fm-cr-br-cr, var(--_ctm-dn-fm-cr-br-cr))
25
+ );
26
+ border-style: var(
27
+ --_ctm-mob-dn-fm-cr-br-se,
28
+ var(--_ctm-tab-dn-fm-cr-br-se, var(--_ctm-dn-fm-cr-br-se))
29
+ );
30
+ border-width: var(
31
+ --_ctm-mob-dn-fm-cr-br-wh,
32
+ var(--_ctm-tab-dn-fm-cr-br-wh, var(--_ctm-dn-fm-cr-br-wh))
33
+ );
34
+ border-radius: var(
35
+ --_ctm-mob-dn-fm-cr-br-rs,
36
+ var(--_ctm-tab-dn-fm-cr-br-rs, var(--_ctm-dn-fm-cr-br-rs))
37
+ );
38
+ box-shadow: var(
39
+ --_ctm-mob-dn-fm-cr-sw-ae,
40
+ var(--_ctm-tab-dn-fm-cr-sw-ae, var(--_ctm-dn-fm-cr-sw-ae))
41
+ )
42
+ var(--_ctm-mob-dn-fm-cr-sw-br, var(--_ctm-tab-dn-fm-cr-sw-br, var(--_ctm-dn-fm-cr-sw-br)))
43
+ var(--_ctm-mob-dn-fm-cr-sw-sd, var(--_ctm-tab-dn-fm-cr-sw-sd, var(--_ctm-dn-fm-cr-sw-sd)))
44
+ var(--_ctm-mob-dn-fm-cr-sw-cr, var(--_ctm-tab-dn-fm-cr-sw-cr, var(--_ctm-dn-fm-cr-sw-cr)));
20
45
 
21
46
  .icon-container {
22
47
  margin-bottom: 10px;
package/dist/map.scss CHANGED
@@ -495,14 +495,23 @@ $data: (
495
495
  .hotspot__main {
496
496
  position: relative;
497
497
  .hotspot {
498
- background: var(--_ctm-dn-ht-se-bd-cr);
498
+ // background: var(--_ctm-dn-ht-se-bd-cr);
499
499
  // height: var(--_ctm-dn-tp-tt-dn-ft-se);
500
500
  // width: var(--_ctm-dn-tp-tt-dn-ft-se);
501
501
  position: absolute;
502
502
  cursor: pointer;
503
- width: var(--_ctm-dn-ht-se-ht-se);
504
- height: var(--_ctm-dn-ht-se-ht-se);
505
- background-color: var(--_ctm-dn-ht-se-bd-cr);
503
+ // width: var(--_ctm-dn-ht-se-ht-se);
504
+ // height: var(--_ctm-dn-ht-se-ht-se);
505
+ // background-color: var(--_ctm-dn-ht-se-bd-cr);
506
+ width: var(
507
+ --_ctm-mob-dn-pn-se-ht-se,
508
+ var(--_ctm-tab-dn-pn-se-ht-se, var(--_ctm-dn-pn-se-ht-se))
509
+ );
510
+ height: var(
511
+ --_ctm-mob-dn-pn-se-ht-se,
512
+ var(--_ctm-tab-dn-pn-se-ht-se, var(--_ctm-dn-pn-se-ht-se))
513
+ );
514
+
506
515
  display: flex;
507
516
  align-items: center;
508
517
  top: 50%;
@@ -529,6 +538,48 @@ $data: (
529
538
  stroke: prepareMediaVariable(--_ctm-dn-pn-se-in-c1);
530
539
  }
531
540
  }
541
+ &[data-show-shape-styles="true"] {
542
+ background-color: var(
543
+ --_ctm-mob-dn-pn-se-bd-cr,
544
+ var(--_ctm-tab-dn-pn-se-bd-cr, var(--_ctm-dn-pn-se-bd-cr))
545
+ );
546
+
547
+ border-style: var(
548
+ --_ctm-mob-dn-pn-se-br-se,
549
+ var(--_ctm-tab-dn-pn-se-br-se, var(--_ctm-dn-pn-se-br-se))
550
+ );
551
+ border-color: var(
552
+ --_ctm-mob-dn-pn-se-br-cr,
553
+ var(--_ctm-tab-dn-pn-se-br-cr, var(--_ctm-dn-pn-se-br-cr))
554
+ );
555
+ border-width: var(
556
+ --_ctm-mob-dn-pn-se-br-wh,
557
+ var(--_ctm-tab-dn-pn-se-br-wh, var(--_ctm-dn-pn-se-br-wh))
558
+ );
559
+ border-radius: var(
560
+ --_ctm-mob-dn-pn-se-br-rs,
561
+ var(--_ctm-tab-dn-pn-se-br-rs, var(--_ctm-dn-pn-se-br-rs))
562
+ );
563
+ box-shadow: var(
564
+ --_show-shadow,
565
+ var(
566
+ --_ctm-mob-dn-pn-se-sw-ae,
567
+ var(--_ctm-tab-dn-pn-se-sw-ae, var(--_ctm-dn-pn-se-sw-ae))
568
+ )
569
+ var(
570
+ --_ctm-mob-dn-pn-se-sw-br,
571
+ var(--_ctm-tab-dn-pn-se-sw-br, var(--_ctm-dn-pn-se-sw-br))
572
+ )
573
+ var(
574
+ --_ctm-mob-dn-pn-se-sw-sd,
575
+ var(--_ctm-tab-dn-pn-se-sw-sd, var(--_ctm-dn-pn-se-sw-sd))
576
+ )
577
+ var(
578
+ --_ctm-mob-dn-pn-se-sw-cr,
579
+ var(--_ctm-tab-dn-pn-se-sw-cr, var(--_ctm-dn-pn-se-sw-cr))
580
+ )
581
+ );
582
+ }
532
583
  }
533
584
  }
534
585
  }
package/dist/profile.scss CHANGED
@@ -27,7 +27,17 @@
27
27
  // align-items: center;
28
28
  // justify-content: center;
29
29
  }
30
+ &[data-layout-alignment="horizontal"] {
31
+ .profile__section {
32
+ flex-direction: row;
33
+ }
34
+ }
30
35
 
36
+ &[data-layout-alignment="vertical"] {
37
+ .profile__section {
38
+ flex-direction: column;
39
+ }
40
+ }
31
41
  &[data-show-text-avatar-border="true"] {
32
42
  .profile__avatar__initials {
33
43
  border-color: prepareMediaVariable(--_ctm-dn-tt-ar-br-cr);
@@ -56,17 +66,9 @@
56
66
  &[data-widget-shadow="false"] {
57
67
  --_show-shadow: none;
58
68
  }
59
-
60
- .profile__section {
61
- position: relative;
62
- cursor: pointer;
69
+ .profile__container {
63
70
  display: flex;
64
- align-items: center;
65
- justify-content: center;
66
- // gap: var(prepareMediaVariable(--_ctm-dn-pe-wt-in-gp));
67
- gap: prepareMediaVariable(--_ctm-dn-pe-wt-in-gp);
68
- width: 100%;
69
- height: 100%;
71
+ justify-content: space-between;
70
72
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
71
73
  background-color: var(
72
74
  --_sf-hr-bd-cr,
@@ -83,206 +85,223 @@
83
85
  var(--_ctm-mob-dn-pe-wt-sw-sd, var(--_ctm-tab-dn-pe-wt-sw-sd, var(--_ctm-dn-pe-wt-sw-sd)))
84
86
  var(--_ctm-mob-dn-pe-wt-sw-cr, var(--_ctm-tab-dn-pe-wt-sw-cr, var(--_ctm-dn-pe-wt-sw-cr)))
85
87
  );
88
+ .profile__section {
89
+ position: relative;
90
+ cursor: pointer;
91
+ display: flex;
92
+ align-items: center;
93
+ justify-content: center;
94
+ // gap: var(prepareMediaVariable(--_ctm-dn-pe-wt-in-gp));
95
+ gap: prepareMediaVariable(--_ctm-dn-pe-wt-in-gp);
96
+ width: 100%;
97
+ height: 100%;
86
98
 
87
- .collapse__icon {
88
- width: prepareMediaVariable(--_ctm-dn-ce-in-in-se);
89
- height: prepareMediaVariable(--_ctm-dn-ce-in-in-se);
90
- transition: rotate 0.4s ease-in-out;
91
- svg {
99
+ .collapse__icon {
92
100
  width: prepareMediaVariable(--_ctm-dn-ce-in-in-se);
93
101
  height: prepareMediaVariable(--_ctm-dn-ce-in-in-se);
94
-
95
- path {
96
- stroke: var(
97
- --_ctm-mob-dn-ce-in-in-c1,
98
- var(--_ctm-tab-dn-ce-in-cr, var(--_ctm-dn-ce-in-in-c1))
99
- );
102
+ transition: rotate 0.4s ease-in-out;
103
+ svg {
104
+ width: prepareMediaVariable(--_ctm-dn-ce-in-in-se);
105
+ height: prepareMediaVariable(--_ctm-dn-ce-in-in-se);
106
+
107
+ path {
108
+ stroke: var(
109
+ --_ctm-mob-dn-ce-in-in-c1,
110
+ var(--_ctm-tab-dn-ce-in-cr, var(--_ctm-dn-ce-in-in-c1))
111
+ );
112
+ }
100
113
  }
101
114
  }
102
- }
103
-
104
- .expand__icon {
105
- width: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
106
- height: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
107
- // transition: rotate 0.4s ease-in-out;
108
- transition: transform 0.4s ease-in-out;
109
- svg {
110
- width: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
111
- height: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
112
115
 
113
- path {
114
- stroke: var(
115
- --_ctm-mob-dn-ed-in-in-c1,
116
- var(--_ctm-tab-dn-ed-in-cr, var(--_ctm-dn-ed-in-in-c1))
117
- );
118
- stroke-width: prepareMediaVariable(--_ctm-dn-ed-in-se-wh);
116
+ .profile__avatar__before__login {
117
+ svg {
118
+ width: prepareMediaVariable(--_ctm-dn-be-ln-ar-in-se);
119
+ height: prepareMediaVariable(--_ctm-dn-be-ln-ar-in-se);
120
+
121
+ path {
122
+ stroke: var(
123
+ --_ctm-mob-dn-be-ln-ar-in-c1,
124
+ var(--_ctm-tab-dn-be-ln-ar-cr, var(--_ctm-dn-be-ln-ar-in-c1))
125
+ );
126
+ stroke-width: prepareMediaVariable(--_ctm-dn-be-ln-ar-se-wh);
127
+ }
119
128
  }
120
129
  }
121
- &.open {
122
- transform: rotate(180deg);
123
- }
124
- }
125
-
126
- .profile__avatar__before__login {
127
- svg {
128
- width: prepareMediaVariable(--_ctm-dn-be-ln-ar-in-se);
129
- height: prepareMediaVariable(--_ctm-dn-be-ln-ar-in-se);
130
130
 
131
- path {
132
- stroke: var(
133
- --_ctm-mob-dn-be-ln-ar-in-c1,
134
- var(--_ctm-tab-dn-be-ln-ar-cr, var(--_ctm-dn-be-ln-ar-in-c1))
135
- );
136
- stroke-width: prepareMediaVariable(--_ctm-dn-be-ln-ar-se-wh);
131
+ .profile__avatar__after__login {
132
+ svg {
133
+ width: prepareMediaVariable(--_ctm-dn-ar-ln-ar-in-se);
134
+ height: prepareMediaVariable(--_ctm-dn-ar-ln-ar-in-se);
135
+
136
+ path {
137
+ stroke: var(
138
+ --_ctm-mob-dn-ar-ln-ar-in-c1,
139
+ var(--_ctm-tab-dn-ar-ln-ar-cr, var(--_ctm-dn-ar-ln-ar-in-c1))
140
+ );
141
+ stroke-width: prepareMediaVariable(--_ctm-dn-ar-ln-ar-se-wh);
142
+ }
137
143
  }
138
144
  }
139
- }
140
-
141
- .profile__avatar__after__login {
142
- svg {
143
- width: prepareMediaVariable(--_ctm-dn-ar-ln-ar-in-se);
144
- height: prepareMediaVariable(--_ctm-dn-ar-ln-ar-in-se);
145
-
146
- path {
147
- stroke: var(
148
- --_ctm-mob-dn-ar-ln-ar-in-c1,
149
- var(--_ctm-tab-dn-ar-ln-ar-cr, var(--_ctm-dn-ar-ln-ar-in-c1))
150
- );
151
- stroke-width: prepareMediaVariable(--_ctm-dn-ar-ln-ar-se-wh);
152
- }
145
+ .profile__avatar__initials {
146
+ // width: prepareMediaVariable(--_ctm-lt-tt-ar-se);
147
+ // height: prepareMediaVariable(--_ctm-lt-tt-ar-se);
148
+ width: var(--_ctm-mob-lt-tt-ar-se, var(--_ctm-tab-lt-tt-ar-se, var(--_ctm-lt-tt-ar-se)));
149
+ height: var(--_ctm-mob-lt-tt-ar-se, var(--_ctm-tab-lt-tt-ar-se, var(--_ctm-lt-tt-ar-se)));
150
+ background-color: prepareMediaVariable(--_ctm-dn-tt-ar-bd-cr);
151
+
152
+ font-family: prepareMediaVariable(--_ctm-dn-tt-ar-ft-fy);
153
+ font-size: prepareMediaVariable(--_ctm-dn-tt-ar-ft-se);
154
+ color: prepareMediaVariable(--_ctm-dn-tt-ar-cr);
155
+ font-weight: prepareMediaVariable(--_ctm-dn-tt-ar-ft-wt);
156
+ text-decoration: prepareMediaVariable(--_ctm-dn-tt-ar-ue);
157
+ font-style: prepareMediaVariable(--_ctm-dn-tt-ar-ft-se-ic);
158
+ text-align: #{prepareMediaVariable(--_ctm-dn-tt-ar-tt-an)};
159
+ letter-spacing: #{prepareMediaVariable(--_ctm-dn-tt-ar-lr-sg)};
160
+ line-height: #{prepareMediaVariable(--_ctm-dn-tt-ar-le-ht)};
161
+ border-radius: 50%;
162
+ // color: white;
163
+ // font-weight: 600;
164
+ // font-size: 18px;
165
+ display: flex;
166
+ justify-content: center;
167
+ text-transform: uppercase;
168
+ align-items: center;
169
+ // user-select: none;
170
+ // letter-spacing: 1px;
153
171
  }
154
- }
155
- .profile__avatar__initials {
156
- // width: prepareMediaVariable(--_ctm-lt-tt-ar-se);
157
- // height: prepareMediaVariable(--_ctm-lt-tt-ar-se);
158
- width: var(--_ctm-mob-lt-tt-ar-se, var(--_ctm-tab-lt-tt-ar-se, var(--_ctm-lt-tt-ar-se)));
159
- height: var(--_ctm-mob-lt-tt-ar-se, var(--_ctm-tab-lt-tt-ar-se, var(--_ctm-lt-tt-ar-se)));
160
- background-color: prepareMediaVariable(--_ctm-dn-tt-ar-bd-cr);
161
-
162
- font-family: prepareMediaVariable(--_ctm-dn-tt-ar-ft-fy);
163
- font-size: prepareMediaVariable(--_ctm-dn-tt-ar-ft-se);
164
- color: prepareMediaVariable(--_ctm-dn-tt-ar-cr);
165
- font-weight: prepareMediaVariable(--_ctm-dn-tt-ar-ft-wt);
166
- text-decoration: prepareMediaVariable(--_ctm-dn-tt-ar-ue);
167
- font-style: prepareMediaVariable(--_ctm-dn-tt-ar-ft-se-ic);
168
- text-align: #{prepareMediaVariable(--_ctm-dn-tt-ar-tt-an)};
169
- letter-spacing: #{prepareMediaVariable(--_ctm-dn-tt-ar-lr-sg)};
170
- line-height: #{prepareMediaVariable(--_ctm-dn-tt-ar-le-ht)};
171
- border-radius: 50%;
172
- // color: white;
173
- // font-weight: 600;
174
- // font-size: 18px;
175
- display: flex;
176
- justify-content: center;
177
- text-transform: uppercase;
178
- align-items: center;
179
- // user-select: none;
180
- // letter-spacing: 1px;
181
- }
182
172
 
183
- .icon {
184
- display: flex;
185
- align-self: prepareMediaVariable(--_ctm-dn-pe-wt-in-vl-at);
173
+ .icon {
174
+ display: flex;
175
+ align-self: prepareMediaVariable(--_ctm-dn-pe-wt-in-vl-at);
186
176
 
187
- svg {
188
- width: prepareMediaVariable(--_ctm-dn-pe-wt-in-se);
189
- height: prepareMediaVariable(--_ctm-dn-pe-wt-in-se);
177
+ svg {
178
+ width: prepareMediaVariable(--_ctm-dn-pe-wt-in-se);
179
+ height: prepareMediaVariable(--_ctm-dn-pe-wt-in-se);
190
180
 
191
- path {
192
- stroke: prepareMediaVariable(--_ctm-dn-pe-wt-in-c1);
181
+ path {
182
+ stroke: prepareMediaVariable(--_ctm-dn-pe-wt-in-c1);
183
+ }
193
184
  }
194
185
  }
195
- }
196
- // svg {
197
- // path {
198
- // stroke: var(
199
- // --_ctm-mob-dn-ct-in-in-cr,
200
- // var(--_ctm-tab-dn-ct-in-in-cr, var(--_ctm-dn-ct-in-in-cr))
201
- // );
202
- // }
203
- // }
204
-
205
- .profile__content {
206
- // font-size: 14px;
207
- display: flex;
208
- flex-direction: column;
209
- // list-style: none;
210
- // line-height: 18px;
211
- color: var(--_ctm-mob-dn-pe-wt-cr, var(--_ctm-tab-dn-pe-wt-cr, var(--_ctm-dn-pe-wt-cr)));
212
- font-family: var(
213
- --_sf-hr-ff,
214
- var(--_ctm-mob-dn-pe-wt-ft-fy, var(--_ctm-tab-dn-pe-wt-ft-fy, var(--_ctm-dn-pe-wt-ft-fy)))
215
- );
216
- font-size: var(
217
- --_ctm-mob-dn-pe-wt-ft-se,
218
- var(--_ctm-tab-dn-pe-wt-ft-se, var(--_ctm-dn-pe-wt-ft-se))
219
- );
220
- font-weight: var(
221
- --_ctm-mob-dn-pe-wt-ft-wt,
222
- var(--_ctm-tab-dn-pe-wt-ft-wt, var(--_ctm-dn-pe-wt-ft-wt))
223
- );
224
- font-style: var(
225
- --_ctm-mob-dn-pe-wt-ft-se-ic,
226
- var(--_ctm-tab-dn-pe-wt-ft-se-ic, var(--_ctm-dn-pe-wt-ft-se-ic))
227
- );
228
- text-align: var(
229
- --_ctm-mob-dn-pe-wt-tt-an,
230
- var(--_ctm-tab-dn-pe-wt-tt-an, var(--_ctm-dn-pe-wt-tt-an))
231
- );
232
- letter-spacing: var(
233
- --_ctm-mob-dn-pe-wt-lr-sg,
234
- var(--_ctm-tab-dn-pe-wt-lr-sg, var(--_ctm-dn-pe-wt-lr-sg))
235
- );
236
- line-height: var(
237
- --_ctm-mob-dn-pe-wt-le-ht,
238
- var(--_ctm-tab-dn-pe-wt-le-ht, var(--_ctm-dn-pe-wt-le-ht))
239
- );
240
- text-decoration: var(
241
- --_ctm-mob-dn-pe-wt-ue,
242
- var(--_ctm-tab-dn-pe-wt-ue, var(--_ctm-dn-pe-wt-ue))
243
- );
244
- .profile__icon {
245
- // font-weight: 600;
246
- // font-size: 16px;
247
- color: var(
248
- --_ctm-mob-dn-pe-wt-cr-dc,
249
- var(--_ctm-tab-dn-pe-wt-cr-dc, var(--_ctm-dn-pe-wt-cr-dc))
250
- );
186
+ // svg {
187
+ // path {
188
+ // stroke: var(
189
+ // --_ctm-mob-dn-ct-in-in-cr,
190
+ // var(--_ctm-tab-dn-ct-in-in-cr, var(--_ctm-dn-ct-in-in-cr))
191
+ // );
192
+ // }
193
+ // }
194
+
195
+ .profile__content {
196
+ // font-size: 14px;
197
+ display: flex;
198
+ flex-direction: column;
199
+ // list-style: none;
200
+ // line-height: 18px;
201
+ color: var(--_ctm-mob-dn-pe-wt-cr, var(--_ctm-tab-dn-pe-wt-cr, var(--_ctm-dn-pe-wt-cr)));
251
202
  font-family: var(
252
203
  --_sf-hr-ff,
253
204
  var(
254
- --_ctm-mob-dn-pe-wt-ft-fy-dc,
255
- var(--_ctm-tab-dn-pe-wt-ft-fy-dc, var(--_ctm-dn-pe-wt-ft-fy-dc))
205
+ --_ctm-mob-dn-pe-wt-ft-fy,
206
+ var(--_ctm-tab-dn-pe-wt-ft-fy, var(--_ctm-dn-pe-wt-ft-fy))
256
207
  )
257
208
  );
258
209
  font-size: var(
259
- --_ctm-mob-dn-pe-wt-ft-se-dc,
260
- var(--_ctm-tab-dn-pe-wt-ft-se-dc, var(--_ctm-dn-pe-wt-ft-se-dc))
210
+ --_ctm-mob-dn-pe-wt-ft-se,
211
+ var(--_ctm-tab-dn-pe-wt-ft-se, var(--_ctm-dn-pe-wt-ft-se))
261
212
  );
262
213
  font-weight: var(
263
- --_ctm-mob-dn-pe-wt-ft-wt-dc,
264
- var(--_ctm-tab-dn-pe-wt-ft-wt-dc, var(--_ctm-dn-pe-wt-ft-wt-dc))
214
+ --_ctm-mob-dn-pe-wt-ft-wt,
215
+ var(--_ctm-tab-dn-pe-wt-ft-wt, var(--_ctm-dn-pe-wt-ft-wt))
265
216
  );
266
217
  font-style: var(
267
- --_ctm-mob-dn-pe-wt-ft-se-ic-dc,
268
- var(--_ctm-tab-dn-pe-wt-ft-se-ic-dc, var(--_ctm-dn-pe-wt-ft-se-ic-dc))
218
+ --_ctm-mob-dn-pe-wt-ft-se-ic,
219
+ var(--_ctm-tab-dn-pe-wt-ft-se-ic, var(--_ctm-dn-pe-wt-ft-se-ic))
269
220
  );
270
221
  text-align: var(
271
- --_ctm-mob-dn-pe-wt-tt-an-dc,
272
- var(--_ctm-tab-dn-pe-wt-tt-an-dc, var(--_ctm-dn-pe-wt-tt-an-dc))
222
+ --_ctm-mob-dn-pe-wt-tt-an,
223
+ var(--_ctm-tab-dn-pe-wt-tt-an, var(--_ctm-dn-pe-wt-tt-an))
273
224
  );
274
225
  letter-spacing: var(
275
- --_ctm-mob-dn-pe-wt-lr-sg-dc,
276
- var(--_ctm-tab-dn-pe-wt-lr-sg-dc, var(--_ctm-dn-pe-wt-lr-sg-dc))
226
+ --_ctm-mob-dn-pe-wt-lr-sg,
227
+ var(--_ctm-tab-dn-pe-wt-lr-sg, var(--_ctm-dn-pe-wt-lr-sg))
277
228
  );
278
229
  line-height: var(
279
- --_ctm-mob-dn-pe-wt-le-ht-dc,
280
- var(--_ctm-tab-dn-pe-wt-le-ht-dc, var(--_ctm-dn-pe-wt-le-ht-dc))
230
+ --_ctm-mob-dn-pe-wt-le-ht,
231
+ var(--_ctm-tab-dn-pe-wt-le-ht, var(--_ctm-dn-pe-wt-le-ht))
281
232
  );
282
233
  text-decoration: var(
283
- --_ctm-mob-dn-pe-wt-ue-dc,
284
- var(--_ctm-tab-dn-pe-wt-ue-dc, var(--_ctm-dn-pe-wt-ue-dc))
234
+ --_ctm-mob-dn-pe-wt-ue,
235
+ var(--_ctm-tab-dn-pe-wt-ue, var(--_ctm-dn-pe-wt-ue))
285
236
  );
237
+ .profile__icon {
238
+ // font-weight: 600;
239
+ // font-size: 16px;
240
+ color: var(
241
+ --_ctm-mob-dn-pe-wt-cr-dc,
242
+ var(--_ctm-tab-dn-pe-wt-cr-dc, var(--_ctm-dn-pe-wt-cr-dc))
243
+ );
244
+ font-family: var(
245
+ --_sf-hr-ff,
246
+ var(
247
+ --_ctm-mob-dn-pe-wt-ft-fy-dc,
248
+ var(--_ctm-tab-dn-pe-wt-ft-fy-dc, var(--_ctm-dn-pe-wt-ft-fy-dc))
249
+ )
250
+ );
251
+ font-size: var(
252
+ --_ctm-mob-dn-pe-wt-ft-se-dc,
253
+ var(--_ctm-tab-dn-pe-wt-ft-se-dc, var(--_ctm-dn-pe-wt-ft-se-dc))
254
+ );
255
+ font-weight: var(
256
+ --_ctm-mob-dn-pe-wt-ft-wt-dc,
257
+ var(--_ctm-tab-dn-pe-wt-ft-wt-dc, var(--_ctm-dn-pe-wt-ft-wt-dc))
258
+ );
259
+ font-style: var(
260
+ --_ctm-mob-dn-pe-wt-ft-se-ic-dc,
261
+ var(--_ctm-tab-dn-pe-wt-ft-se-ic-dc, var(--_ctm-dn-pe-wt-ft-se-ic-dc))
262
+ );
263
+ text-align: var(
264
+ --_ctm-mob-dn-pe-wt-tt-an-dc,
265
+ var(--_ctm-tab-dn-pe-wt-tt-an-dc, var(--_ctm-dn-pe-wt-tt-an-dc))
266
+ );
267
+ letter-spacing: var(
268
+ --_ctm-mob-dn-pe-wt-lr-sg-dc,
269
+ var(--_ctm-tab-dn-pe-wt-lr-sg-dc, var(--_ctm-dn-pe-wt-lr-sg-dc))
270
+ );
271
+ line-height: var(
272
+ --_ctm-mob-dn-pe-wt-le-ht-dc,
273
+ var(--_ctm-tab-dn-pe-wt-le-ht-dc, var(--_ctm-dn-pe-wt-le-ht-dc))
274
+ );
275
+ text-decoration: var(
276
+ --_ctm-mob-dn-pe-wt-ue-dc,
277
+ var(--_ctm-tab-dn-pe-wt-ue-dc, var(--_ctm-dn-pe-wt-ue-dc))
278
+ );
279
+ }
280
+ }
281
+ }
282
+ .expand__icon {
283
+ width: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
284
+ height: auto;
285
+ // transition: rotate 0.4s ease-in-out;
286
+ transition: transform 0.4s ease-in-out;
287
+
288
+ display: var(--_d-flex);
289
+ align-self: var(--_in-hr-as, prepareMediaVariable(--_ctm-dn-ed-in-vl-at));
290
+
291
+ svg {
292
+ width: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
293
+ height: prepareMediaVariable(--_ctm-dn-ed-in-in-se);
294
+
295
+ path {
296
+ stroke: var(
297
+ --_ctm-mob-dn-ed-in-in-c1,
298
+ var(--_ctm-tab-dn-ed-in-cr, var(--_ctm-dn-ed-in-in-c1))
299
+ );
300
+ stroke-width: prepareMediaVariable(--_ctm-dn-ed-in-se-wh);
301
+ }
302
+ }
303
+ &.open {
304
+ transform: rotate(180deg);
286
305
  }
287
306
  }
288
307
  }
@@ -328,6 +347,19 @@
328
347
  --_ctm-mob-dn-dn-is-dt-se-bd-cr,
329
348
  var(--_ctm-tab-dn-dn-is-dt-se-bd-cr, var(--_ctm-dn-dn-is-dt-se-bd-cr))
330
349
  );
350
+ .icon {
351
+ svg {
352
+ width: prepareMediaVariable(--_ctm-dn-dn-is-cr-in-se);
353
+ height: prepareMediaVariable(--_ctm-dn-dn-is-cr-in-se);
354
+
355
+ path {
356
+ stroke: var(
357
+ --_ctm-mob-dn-dn-is-cr-in-c1,
358
+ var(--_ctm-tab-dn-ed-in-cr, var(--_ctm-dn-dn-is-cr-in-c1))
359
+ );
360
+ }
361
+ }
362
+ }
331
363
  // font-size: 15px;
332
364
  // font-weight: 500;
333
365
  // color: #1f2937;
@@ -357,6 +389,10 @@
357
389
  var(--_ctm-tab-dn-dn-is-dt-se-br-wh, var(--_ctm-dn-dn-is-dt-se-br-wh))
358
390
  )
359
391
  );
392
+ gap: var(
393
+ --_ctm-mob-dn-dn-is-cr-in-gp,
394
+ var(--_ctm-tab-dn-dn-is-cr-in-gp, var(--_ctm-dn-dn-is-cr-in-gp))
395
+ );
360
396
  }
361
397
  &[data-dropdown-items-default-shadow="true"] {
362
398
  box-shadow: var(
package/dist/quick-links.scss CHANGED
@@ -533,16 +533,49 @@
533
533
  }
534
534
  }
535
535
  }
536
+ .placeholder__text {
537
+ display: flex !important;
538
+ justify-content: space-between !important;
539
+ color: var(--_gray-700) !important;
540
+ border: 1px solid var(--_gray-400) !important;
541
+ border-radius: 6px !important;
542
+ padding: 8px 12px !important;
543
+ background-color: #fff !important;
544
+ width: 100% !important;
545
+ }
546
+ .est__dropdown .list {
547
+ gap: var(
548
+ --_ctm-mob-lt-dn-gp-bn-is,
549
+ var(--_ctm-tab-lt-dn-gp-bn-is, var(--_ctm-lt-dn-gp-bn-is))
550
+ );
551
+ }
536
552
  .items__container {
537
553
  .dropdown__container {
538
554
  .est__dropdown__main {
539
555
  .est__dropdown {
540
- .est__dropdown__button,
541
- .list {
542
- width: var(
543
- --_ctm-mob-lt-dn-wh,
544
- var(--_ctm-tab-dn-wh, var(--_ctm-lt-dn-wh))
545
- ) !important;
556
+ .est__dropdown__button {
557
+ .value__selected {
558
+ color: none !important;
559
+ border: 0px !important;
560
+ border-radius: 0px !important;
561
+ padding: 0px !important;
562
+ background-color: transparent;
563
+ }
564
+ .list {
565
+ width: var(
566
+ --_ctm-mob-lt-dn-wh,
567
+ var(--_ctm-tab-dn-wh, var(--_ctm-lt-dn-wh))
568
+ ) !important;
569
+ gap: var(
570
+ --_ctm-mob-lt-dn-gp-bn-is,
571
+ var(--_ctm-tab-lt-dn-gp-bn-is, var(--_ctm-lt-dn-gp-bn-is))
572
+ );
573
+ justify-content: flex-start;
574
+ align-items: flex-start;
575
+ height: auto;
576
+ display: flex;
577
+ justify-content: space-between;
578
+ }
546
579
  }
547
580
  }
548
581
  }