@sc-360-v2/storefront-cms-library 0.3.21 → 0.3.22

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.
package/dist/faq.scss CHANGED
@@ -345,51 +345,48 @@
345
345
  var(--_ctm-tab-dn-ed-an-im-bd-cr, var(--_ctm-dn-ed-an-im-bd-cr))
346
346
  );
347
347
 
348
- p {
349
- // padding-inline: var(--_sf-cd-gp);
350
- color: var(
351
- --_ctm-mob-dn-ed-an-im-cr,
352
- var(--_ctm-tab-dn-ed-an-im-cr, var(--_ctm-dn-ed-an-im-cr))
353
- );
354
- font-family: var(
355
- --_ctm-mob-dn-ed-an-im-ft-fy,
356
- var(--_ctm-tab-dn-ed-an-im-ft-fy, var(--_ctm-dn-ed-an-im-ft-fy))
357
- ),
358
- sans-serif;
359
- font-size: var(
360
- --_ctm-mob-dn-ed-an-im-ft-se,
361
- var(--_ctm-tab-dn-ed-an-im-ft-se, var(--_ctm-dn-ed-an-im-ft-se))
362
- );
363
- font-weight: var(
364
- --_ctm-mob-dn-ed-an-im-ft-wt,
365
- var(--_ctm-tab-dn-ed-an-im-ft-wt, var(--_ctm-dn-ed-an-im-ft-wt))
366
- );
367
- font-style: var(
368
- --_ctm-mob-dn-ed-an-im-ft-se-ic,
369
- var(--_tst-tab-dn-ed-an-im-ft-se-ic, var(--_tst-dn-ed-an-im-ft-se-ic))
370
- );
371
- text-align: var(
372
- --_ctm-mob-dn-ed-an-im-tt-an,
373
- var(--_ctm-tab-dn-ed-an-im-tt-anvvar(--_ctm-dn-ed-an-im-tt-an))
374
- );
375
- letter-spacing: var(
376
- --_ctm-mob-dn-ed-an-im-lr-sg,
377
- var(--_ctm-tab-dn-ed-an-im-lr-sg, var(--_ctm-dn-ed-an-im-lr-sg))
378
- );
379
- line-height: var(
380
- --_ctm-mob-dn-ed-an-im-le-ht,
381
- var(--_ctm-tab-dn-ed-an-im-le-ht, var(--_ctm-dn-ed-an-im-le-ht))
382
- );
383
- // text-decoration: var(
384
- // --_ctm-dn-ed-an-im-lh,
385
- // var(--_ctm-dn-ed-an-im-ue),
386
- // var(--_tst-dn-cd-an-im-lh)
387
- // );
388
- text-decoration: var(
389
- --_ctm-mob-dn-ed-an-im-ue,
390
- var(--_ctm-tab-dn-ed-an-im-ue, var(--_ctm-dn-ed-an-im-ue))
391
- );
392
- }
348
+ color: var(
349
+ --_ctm-mob-dn-ed-an-im-cr,
350
+ var(--_ctm-tab-dn-ed-an-im-cr, var(--_ctm-dn-ed-an-im-cr))
351
+ );
352
+ font-family: var(
353
+ --_ctm-mob-dn-ed-an-im-ft-fy,
354
+ var(--_ctm-tab-dn-ed-an-im-ft-fy, var(--_ctm-dn-ed-an-im-ft-fy))
355
+ ),
356
+ sans-serif;
357
+ font-size: var(
358
+ --_ctm-mob-dn-ed-an-im-ft-se,
359
+ var(--_ctm-tab-dn-ed-an-im-ft-se, var(--_ctm-dn-ed-an-im-ft-se))
360
+ );
361
+ font-weight: var(
362
+ --_ctm-mob-dn-ed-an-im-ft-wt,
363
+ var(--_ctm-tab-dn-ed-an-im-ft-wt, var(--_ctm-dn-ed-an-im-ft-wt))
364
+ );
365
+ font-style: var(
366
+ --_ctm-mob-dn-ed-an-im-ft-se-ic,
367
+ var(--_tst-tab-dn-ed-an-im-ft-se-ic, var(--_tst-dn-ed-an-im-ft-se-ic))
368
+ );
369
+ text-align: var(
370
+ --_ctm-mob-dn-ed-an-im-tt-an,
371
+ var(--_ctm-tab-dn-ed-an-im-tt-anvvar(--_ctm-dn-ed-an-im-tt-an))
372
+ );
373
+ letter-spacing: var(
374
+ --_ctm-mob-dn-ed-an-im-lr-sg,
375
+ var(--_ctm-tab-dn-ed-an-im-lr-sg, var(--_ctm-dn-ed-an-im-lr-sg))
376
+ );
377
+ line-height: var(
378
+ --_ctm-mob-dn-ed-an-im-le-ht,
379
+ var(--_ctm-tab-dn-ed-an-im-le-ht, var(--_ctm-dn-ed-an-im-le-ht))
380
+ );
381
+ // text-decoration: var(
382
+ // --_ctm-dn-ed-an-im-lh,
383
+ // var(--_ctm-dn-ed-an-im-ue),
384
+ // var(--_tst-dn-cd-an-im-lh)
385
+ // );
386
+ text-decoration: var(
387
+ --_ctm-mob-dn-ed-an-im-ue,
388
+ var(--_ctm-tab-dn-ed-an-im-ue, var(--_ctm-dn-ed-an-im-ue))
389
+ );
393
390
  .icon {
394
391
  display: var(--_sf-show-icon-ff, flex);
395
392
  svg {
@@ -418,45 +415,43 @@
418
415
  var(--_ctm-tab-dn-ed-an-im-bd-cr-dc, var(--_ctm-dn-ed-an-im-bd-cr-dc))
419
416
  );
420
417
 
421
- p {
422
- color: var(
423
- --_ctm-mob-dn-ed-an-im-cr-dc,
424
- var(--_ctm-tab-dn-ed-an-im-cr-dc, var(--_ctm-dn-ed-an-im-cr-dc))
425
- );
426
- font-family: var(
427
- --_ctm-mob-dn-ed-an-im-ft-fy-dc,
428
- var(--_ctm-tab-dn-ed-an-im-ft-fy-dc, var(--_ctm-dn-ed-an-im-ft-fy-dc))
429
- ),
430
- sans-serif;
431
- font-size: var(
432
- --_ctm-mob-dn-ed-an-im-ft-se-dc,
433
- var(--_ctm-tab-dn-ed-an-im-ft-se-dc, var(--_ctm-dn-ed-an-im-ft-se-dc))
434
- );
435
- font-weight: var(
436
- --_ctm-mob-dn-ed-an-im-ft-wt-dc,
437
- var(--_ctm-tab-dn-ed-an-im-ft-wt-dc, var(--_ctm-dn-ed-an-im-ft-wt-dc))
438
- );
439
- font-style: var(
440
- --_ctm-mob-dn-ed-an-im-ft-se-ic-dc,
441
- var(--_ctm-tab-dn-ed-an-im-ft-se-ic-dc, var(--_ctm-dn-ed-an-im-ft-se-ic-dc))
442
- );
443
- text-align: var(
444
- --_ctm-mob-dn-ed-an-im-tt-an-dc,
445
- var(--_ctm-tab-dn-ed-an-im-tt-an-dc, var(--_ctm-dn-ed-an-im-tt-an-dc))
446
- );
447
- letter-spacing: var(
448
- --_ctm-mob-dn-ed-an-im-lr-sg-dc,
449
- var(--_ctm-tab-dn-ed-an-im-lr-sg-dc, var(--_ctm-dn-ed-an-im-lr-sg-dc))
450
- );
451
- line-height: var(
452
- --_ctm-mob-dn-ed-an-im-le-ht-dc,
453
- var(--_ctm-tab-dn-ed-an-im-le-ht-dc, var(--_ctm-dn-ed-an-im-le-ht-dc))
454
- );
455
- text-decoration: var(
456
- --_ctm-mob-dn-ed-an-im-ue-dc,
457
- var(--_ctm-tab-dn-ed-an-im-ue-dc, var(--_ctm-dn-ed-an-im-ue-dc))
458
- );
459
- }
418
+ color: var(
419
+ --_ctm-mob-dn-ed-an-im-cr-dc,
420
+ var(--_ctm-tab-dn-ed-an-im-cr-dc, var(--_ctm-dn-ed-an-im-cr-dc))
421
+ );
422
+ font-family: var(
423
+ --_ctm-mob-dn-ed-an-im-ft-fy-dc,
424
+ var(--_ctm-tab-dn-ed-an-im-ft-fy-dc, var(--_ctm-dn-ed-an-im-ft-fy-dc))
425
+ ),
426
+ sans-serif;
427
+ font-size: var(
428
+ --_ctm-mob-dn-ed-an-im-ft-se-dc,
429
+ var(--_ctm-tab-dn-ed-an-im-ft-se-dc, var(--_ctm-dn-ed-an-im-ft-se-dc))
430
+ );
431
+ font-weight: var(
432
+ --_ctm-mob-dn-ed-an-im-ft-wt-dc,
433
+ var(--_ctm-tab-dn-ed-an-im-ft-wt-dc, var(--_ctm-dn-ed-an-im-ft-wt-dc))
434
+ );
435
+ font-style: var(
436
+ --_ctm-mob-dn-ed-an-im-ft-se-ic-dc,
437
+ var(--_ctm-tab-dn-ed-an-im-ft-se-ic-dc, var(--_ctm-dn-ed-an-im-ft-se-ic-dc))
438
+ );
439
+ text-align: var(
440
+ --_ctm-mob-dn-ed-an-im-tt-an-dc,
441
+ var(--_ctm-tab-dn-ed-an-im-tt-an-dc, var(--_ctm-dn-ed-an-im-tt-an-dc))
442
+ );
443
+ letter-spacing: var(
444
+ --_ctm-mob-dn-ed-an-im-lr-sg-dc,
445
+ var(--_ctm-tab-dn-ed-an-im-lr-sg-dc, var(--_ctm-dn-ed-an-im-lr-sg-dc))
446
+ );
447
+ line-height: var(
448
+ --_ctm-mob-dn-ed-an-im-le-ht-dc,
449
+ var(--_ctm-tab-dn-ed-an-im-le-ht-dc, var(--_ctm-dn-ed-an-im-le-ht-dc))
450
+ );
451
+ text-decoration: var(
452
+ --_ctm-mob-dn-ed-an-im-ue-dc,
453
+ var(--_ctm-tab-dn-ed-an-im-ue-dc, var(--_ctm-dn-ed-an-im-ue-dc))
454
+ );
460
455
  }
461
456
  }
462
457
  }
@@ -0,0 +1,451 @@
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+ @use "./functions.scss" as *;
4
+
5
+ [data-div-type="element"] {
6
+ &[data-element-type="languageMenu"] {
7
+ margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
8
+
9
+ & > .wrapper {
10
+ width: 100%;
11
+ // height: 100%;
12
+ }
13
+ &[data-show-shadow="false"] {
14
+ --_show-shadow: none;
15
+ }
16
+ .language__conatiner {
17
+ background-color: var(
18
+ --_ctm-mob-dn-wt-se-bd-cr,
19
+ var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr))
20
+ );
21
+
22
+ border-color: var(
23
+ --_ctm-mob-dn-wt-se-br-cr,
24
+ var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr))
25
+ );
26
+
27
+ border-style: var(
28
+ --_ctm-mob-dn-wt-se-br-se,
29
+ var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se))
30
+ );
31
+
32
+ border-width: var(
33
+ --_ctm-mob-dn-wt-se-br-wh,
34
+ var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh))
35
+ );
36
+
37
+ border-radius: var(
38
+ --_ctm-mob-dn-wt-se-br-rs,
39
+ var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs))
40
+ );
41
+
42
+ box-shadow: var(
43
+ --_show-shadow,
44
+ var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae)))
45
+ var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br)))
46
+ var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd)))
47
+ var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr)))
48
+ );
49
+
50
+ padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
51
+ // gap: var(
52
+ // --_ctm-mob-lt-it-ad-mn-qy-sg,
53
+ // var(--_ctm-tab-lt-it-ad-mn-qy-sg, var(--_ctm-lt-it-ad-mn-qy-sg))
54
+ // );
55
+ display: flex;
56
+ gap: var(--_ctm-mob-lt-gp-bn-is, var(--_ctm-tab-lt-gp-bn-is, var(--_ctm-lt-gp-bn-is)));
57
+
58
+ .option:hover {
59
+ --_sf-hr-bd-cr: var(
60
+ --_ctm-mob-dn-im-se-hr-se-bd-cr,
61
+ var(--_ctm-tab-dn-im-se-hr-se-bd-cr, var(--_ctm-dn-im-se-hr-se-bd-cr))
62
+ );
63
+ --_sf-hr-br-cr: var(
64
+ --_ctm-mob-dn-im-se-hr-se-br-cr,
65
+ var(--_ctm-tab-dn-im-se-hr-se-br-cr, var(--_ctm-dn-im-se-hr-se-br-cr))
66
+ );
67
+ --_sf-hr-br-se: var(
68
+ --_ctm-mob-dn-im-se-hr-se-br-se,
69
+ var(--_ctm-tab-dn-im-se-hr-se-br-se, var(--_ctm-dn-im-se-hr-se-br-se))
70
+ );
71
+ --_sf-hr-br-wh: var(
72
+ --_ctm-mob-dn-im-se-hr-se-br-wh,
73
+ var(--_ctm-tab-dn-im-se-hr-se-br-wh, var(--_ctm-dn-im-se-hr-se-br-wh))
74
+ );
75
+ --_sf-hr-br-rs: var(
76
+ --_ctm-mob-dn-im-se-hr-se-br-rs,
77
+ var(--_ctm-tab-dn-im-se-hr-se-br-rs, var(--_ctm-dn-im-se-hr-se-br-rs))
78
+ );
79
+
80
+ // for shadow
81
+ --_sf-hr-sw-ae: var(
82
+ --_ctm-mob-dn-im-se-hr-se-sw-ae,
83
+ var(--_ctm-tab-dn-im-se-hr-se-sw-ae, var(--_ctm-dn-im-se-hr-se-sw-ae))
84
+ );
85
+ --_sf-hr-sw-br: var(
86
+ --_ctm-mob-dn-im-se-hr-se-sw-br,
87
+ var(--_ctm-tab-dn-im-se-hr-se-sw-br, var(--_ctm-dn-im-se-hr-se-sw-br))
88
+ );
89
+ --_sf-hr-sw-hr: var(
90
+ --_ctm-mob-dn-im-se-hr-se-sw-hr,
91
+ var(--_ctm-tab-dn-im-se-hr-se-sw-hr, var(--_ctm-dn-im-se-hr-se-sw-hr))
92
+ );
93
+ --_sf-hr-sw-cr: var(
94
+ --_ctm-mob-dn-im-se-hr-se-sw-cr,
95
+ var(--_ctm-tab-dn-im-se-hr-se-sw-cr, var(--_ctm-dn-im-se-hr-se-sw-cr))
96
+ );
97
+
98
+ // for font
99
+
100
+ --_sf-hr-cr: var(
101
+ --_ctm-mob-dn-im-se-hr-se-cr,
102
+ var(--_ctm-tab-dn-im-se-hr-se-cr, var(--_ctm-dn-im-se-hr-se-cr))
103
+ );
104
+ --_sf-hr-ft-fy: var(
105
+ --_ctm-mob-dn-im-se-hr-se-ft-fy,
106
+ var(--_ctm-tab-dn-im-se-hr-se-ft-fy, var(--_ctm-dn-im-se-hr-se-ft-fy))
107
+ );
108
+ --_sf-hr-ft-se: var(
109
+ --_ctm-mob-dn-im-se-hr-se-ft-se,
110
+ var(--_ctm-tab-dn-im-se-hr-se-ft-se, var(--_ctm-dn-im-se-hr-se-ft-se))
111
+ );
112
+ --_sf-hr-ft-wt: var(
113
+ --_ctm-mob-dn-im-se-hr-se-ft-wt,
114
+ var(--_ctm-tab-dn-im-se-hr-se-ft-wt, var(--_ctm-dn-im-se-hr-se-ft-wt))
115
+ );
116
+ --_sf-hr-ft-se-ic: var(
117
+ --_ctm-mob-dn-im-se-hr-se-ft-se-ic,
118
+ var(--_ctm-tab-dn-im-se-hr-se-ft-se-ic, var(--_ctm-dn-im-se-hr-se-ft-se-ic))
119
+ );
120
+ --_sf-hr-tt-an: var(
121
+ --_ctm-mob-dn-im-se-hr-se-tt-an,
122
+ var(--_ctm-tab-dn-im-se-hr-se-tt-an, var(--_ctm-dn-im-se-hr-se-tt-an))
123
+ );
124
+ --_sf-hr-lr-sg: var(
125
+ --_ctm-mob-dn-im-se-hr-se-lr-sg,
126
+ var(--_ctm-tab-dn-im-se-hr-se-lr-sg, var(--_ctm-dn-im-se-hr-se-lr-sg))
127
+ );
128
+ --_sf-hr-le-ht: var(
129
+ --_ctm-mob-dn-im-se-hr-se-le-ht,
130
+ var(--_ctm-tab-dn-im-se-hr-se-le-ht, var(--_ctm-dn-im-se-hr-se-le-ht))
131
+ );
132
+
133
+ --_sf-hr-ue: var(
134
+ --_ctm-mob-dn-im-se-hr-se-ue,
135
+ var(--_ctm-tab-dn-im-se-hr-se-ue, var(--_ctm-dn-im-se-hr-se-ue))
136
+ );
137
+ }
138
+
139
+ .option[data-selected="true"] {
140
+ --_sf-sd-bd-cr: var(
141
+ --_ctm-mob-dn-im-se-sd-se-bd-cr,
142
+ var(--_ctm-tab-dn-im-se-sd-se-bd-cr, var(--_ctm-dn-im-se-sd-se-bd-cr))
143
+ );
144
+ --_sf-sd-br-cr: var(
145
+ --_ctm-mob-dn-im-se-sd-se-br-cr,
146
+ var(--_ctm-tab-dn-im-se-sd-se-br-cr, var(--_ctm-dn-im-se-sd-se-br-cr))
147
+ );
148
+ --_sf-sd-br-se: var(
149
+ --_ctm-mob-dn-im-se-sd-se-br-se,
150
+ var(--_ctm-tab-dn-im-se-sd-se-br-se, var(--_ctm-dn-im-se-sd-se-br-se))
151
+ );
152
+ --_sf-sd-br-wh: var(
153
+ --_ctm-mob-dn-im-se-sd-se-br-wh,
154
+ var(--_ctm-tab-dn-im-se-sd-se-br-wh, var(--_ctm-dn-im-se-sd-se-br-wh))
155
+ );
156
+ // new
157
+ --_sf-sd-sw-ae: var(
158
+ --_ctm-mob-dn-im-se-sd-se-sw-ae,
159
+ var(--_ctm-tab-dn-im-se-sd-se-sw-ae, var(--_ctm-dn-im-se-sd-se-sw-ae))
160
+ );
161
+ --_sf-sd-sw-br: var(
162
+ --_ctm-mob-dn-im-se-sd-se-sw-br,
163
+ var(--_ctm-tab-dn-im-se-sd-se-sw-br, var(--_ctm-dn-im-se-sd-se-sw-br))
164
+ );
165
+ --_sf-sd-sw-sd: var(
166
+ --_ctm-mob-dn-im-se-sd-se-sw-sd,
167
+ var(--_ctm-tab-dn-im-se-sd-se-sw-sd, var(--_ctm-dn-im-se-sd-se-sw-sd))
168
+ );
169
+ --_sf-sd-sw-cr: var(
170
+ --_ctm-mob-dn-im-se-sd-se-sw-cr,
171
+ var(--_ctm-tab-dn-im-se-sd-se-sw-cr, var(--_ctm-dn-im-se-sd-se-sw-cr))
172
+ );
173
+
174
+ // for font
175
+
176
+ --_sf-sd-cr: var(
177
+ --_ctm-mob-dn-im-se-sd-se-cr,
178
+ var(--_ctm-tab-dn-im-se-sd-se-cr, var(--_ctm-dn-im-se-sd-se-cr))
179
+ );
180
+ --_sf-sd-ft-fy: var(
181
+ --_ctm-mob-dn-im-se-sd-se-ft-fy,
182
+ var(--_ctm-tab-dn-im-se-sd-se-ft-fy, var(--_ctm-dn-im-se-sd-se-ft-fy))
183
+ );
184
+ --_sf-sd-ft-se: var(
185
+ --_ctm-mob-dn-im-se-sd-se-ft-se,
186
+ var(--_ctm-tab-dn-im-se-sd-se-ft-se, var(--_ctm-dn-im-se-sd-se-ft-se))
187
+ );
188
+ --_sf-sd-ft-wt: var(
189
+ --_ctm-mob-dn-im-se-sd-se-ft-wt,
190
+ var(--_ctm-tab-dn-im-se-sd-se-ft-wt, var(--_ctm-dn-im-se-sd-se-ft-wt))
191
+ );
192
+ --_sf-sd-ft-se-ic: var(
193
+ --_ctm-mob-dn-im-se-sd-se-ft-se-ic,
194
+ var(--_ctm-tab-dn-im-se-sd-se-ft-se-ic, var(--_ctm-dn-im-se-sd-se-ft-se-ic))
195
+ );
196
+ --_sf-sd-tt-an: var(
197
+ --_ctm-mob-dn-im-se-sd-se-tt-an,
198
+ var(--_ctm-tab-dn-im-se-sd-se-tt-an, var(--_ctm-dn-im-se-sd-se-tt-an))
199
+ );
200
+ --_sf-sd-lr-sg: var(
201
+ --_ctm-mob-dn-im-se-sd-se-lr-sg,
202
+ var(--_ctm-tab-dn-im-se-sd-se-lr-sg, var(--_ctm-dn-im-se-sd-se-lr-sg))
203
+ );
204
+ --_sf-sd-le-ht: var(
205
+ --_ctm-mob-dn-im-se-sd-se-le-ht,
206
+ var(--_ctm-tab-dn-im-se-sd-se-le-ht, var(--_ctm-dn-im-se-sd-se-le-ht))
207
+ );
208
+
209
+ --_sf-sd-ue: var(
210
+ --_ctm-mob-dn-im-se-sd-se-ue,
211
+ var(--_ctm-tab-dn-im-se-sd-se-ue, var(--_ctm-dn-im-se-sd-se-ue))
212
+ );
213
+ }
214
+
215
+ &[data-flag-style="Rounded"] {
216
+ .language__flag {
217
+ border-radius: 5px;
218
+ }
219
+ }
220
+ &[data-flag-style="Circle"] {
221
+ .language__flag {
222
+ border-radius: 50%;
223
+ }
224
+ }
225
+
226
+ .option {
227
+ width: 100%;
228
+ display: flex;
229
+ align-items: center;
230
+ cursor: pointer;
231
+ justify-content: var(--_ctm-mob-lt-at, var(--_ctm-tab-lt-at, var(--_ctm-lt-at)));
232
+
233
+ position: relative;
234
+ box-sizing: border-box;
235
+
236
+ padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
237
+ gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
238
+ border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-cr));
239
+
240
+ background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-im-se-dt-se-bd-cr));
241
+ border-style: var(--_sf-hr-br-se, prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-se));
242
+ border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-rs));
243
+ border-width: var(--_sf-hr-br-wh, prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-wh));
244
+
245
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-ae))
246
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-br))
247
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-sd))
248
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-cr));
249
+ //
250
+ &[data-selected="true"] {
251
+ border-color: var(--_sf-sd-br-cr, prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-cr));
252
+
253
+ background-color: var(--_sf-sd-bd-cr, prepareMediaVariable(--_ctm-dn-im-se-dt-se-bd-cr));
254
+ border-style: var(--_sf-sd-br-se, prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-se));
255
+ border-width: var(--_sf-sd-br-wh, prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-wh));
256
+ border-radius: var(--_sf-sd-br-rs, prepareMediaVariable(--_ctm-dn-im-se-dt-se-br-rs));
257
+ box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-ae))
258
+ var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-br))
259
+ var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-sd))
260
+ var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-im-se-dt-se-sw-cr));
261
+ .language__name {
262
+ color: var(--_sf-sd-cr, prepareMediaVariable(--_ctm-dn-im-se-dt-se-cr));
263
+ font-family:
264
+ var(--_sf-sd-ft-fy, prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-fy)), sans-serif;
265
+ font-size: var(--_sf-sd-ft-se, prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-se));
266
+ font-weight: var(--_sf-sd-ft-wt, prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-wt));
267
+ font-style: var(
268
+ --_sf-sd-ft-se-ic,
269
+ prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-se-ic)
270
+ );
271
+ text-align: var(--_sf-sd-tt-an, prepareMediaVariable(--_ctm-dn-im-se-dt-se-tt-an));
272
+ letter-spacing: var(--_sf-sd-lr-sg, prepareMediaVariable(--_ctm-dn-im-se-dt-se-lr-sg));
273
+ line-height: var(--_sf-sd-le-ht, prepareMediaVariable(--_ctm-dn-im-se-dt-se-le-ht-dc));
274
+ text-decoration: var(--_sf-sd-ue, prepareMediaVariable(--_ctm-dn-im-se-dt-se-ue));
275
+ }
276
+ }
277
+ }
278
+ &[data-flex-direction="column"] {
279
+ .language__name {
280
+ white-space: unset;
281
+ }
282
+ }
283
+ &[data-flex-direction="row"] {
284
+ overflow-x: auto;
285
+ }
286
+ &[data-show-divider="true"] {
287
+ &[data-flex-direction="row"] {
288
+ .option:not(:last-child)::before {
289
+ content: "";
290
+ position: absolute;
291
+ top: 0;
292
+ bottom: 0; /* For full height divider */
293
+ right: calc(
294
+ -1 *
295
+ (
296
+ var(
297
+ --_ctm-mob-lt-gp-bn-is,
298
+ var(--_ctm-tab-lt-gp-bn-is, var(--_ctm-lt-gp-bn-is))
299
+ ) /
300
+ 2
301
+ )
302
+ ); /* Half of your gap, assuming divider is centered in the gap */
303
+ width: var(
304
+ --_ctm-mob-dn-wt-se-dr-wt,
305
+ var(--_ctm-tab-dn-wt-se-dr-wt, var(--_ctm-dn-wt-se-dr-wt))
306
+ ); /* Divider thickness */
307
+ background-color: var(
308
+ --_ctm-mob-dn-wt-se-dr-cr,
309
+ var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr))
310
+ ); /* Divider color */
311
+ }
312
+ }
313
+ &[data-flex-direction="column"] {
314
+ .option:not(:last-child)::before {
315
+ content: "";
316
+ position: absolute;
317
+ left: 0;
318
+ right: 0;
319
+ bottom: calc(
320
+ -1 *
321
+ (
322
+ var(
323
+ --_ctm-mob-lt-gp-bn-is,
324
+ var(--_ctm-tab-lt-gp-bn-is, var(--_ctm-lt-gp-bn-is))
325
+ ) /
326
+ 2
327
+ )
328
+ );
329
+ height: var(
330
+ --_ctm-mob-dn-wt-se-dr-wt,
331
+ var(--_ctm-tab-dn-wt-se-dr-wt, var(--_ctm-dn-wt-se-dr-wt))
332
+ );
333
+ background-color: var(
334
+ --_ctm-mob-dn-wt-se-dr-cr,
335
+ var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr))
336
+ );
337
+ }
338
+ }
339
+ }
340
+
341
+ .option_select {
342
+ width: 100%;
343
+ display: flex;
344
+ align-items: center;
345
+ justify-content: var(--_ctm-mob-lt-at, var(--_ctm-tab-lt-at, var(--_ctm-lt-at)));
346
+
347
+ position: relative;
348
+
349
+ padding: var(--_ctm-mob-lt-im-pg, var(--_ctm-tab-lt-im-pg, var(--_ctm-lt-im-pg)));
350
+ gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
351
+ }
352
+ .language__flag {
353
+ width: var(--_ctm-mob-lt-fg-se, var(--_ctm-tab-lt-fg-se, var(--_ctm-lt-fg-se)));
354
+ height: var(--_ctm-mob-lt-fg-se, var(--_ctm-tab-lt-fg-se, var(--_ctm-lt-fg-se)));
355
+ object-fit: cover;
356
+ }
357
+
358
+ .language__name {
359
+ color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-im-se-dt-se-cr));
360
+ font-family:
361
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-fy)), sans-serif;
362
+ font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-se));
363
+ font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-wt));
364
+ font-style: var(--_sf-hr-ft-se-ic, prepareMediaVariable(--_ctm-dn-im-se-dt-se-ft-se-ic));
365
+ text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-im-se-dt-se-tt-an));
366
+ letter-spacing: var(--_sf-hr-lr-sg, prepareMediaVariable(--_ctm-dn-im-se-dt-se-lr-sg));
367
+ line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-dn-im-se-dt-se-le-ht-dc));
368
+ text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-im-se-dt-se-ue));
369
+ white-space: nowrap;
370
+ }
371
+
372
+ //Dropdown
373
+ .value__selected__new {
374
+ width: 100%;
375
+ padding: 8px 12px;
376
+ text-align: left;
377
+ }
378
+ .est__dropdown__main {
379
+ position: relative;
380
+ width: 100%;
381
+ margin-top: 0px;
382
+ label {
383
+ font-size: 14px;
384
+ color: var(--_gray-700);
385
+ margin-bottom: 8px;
386
+ display: block;
387
+ }
388
+
389
+ .est__dropdown {
390
+ cursor: pointer;
391
+ position: relative;
392
+ color: var(--_gray-700);
393
+
394
+ // border-radius: 6px;
395
+ // background-color: #fff;
396
+ display: flex;
397
+ justify-content: space-between;
398
+ align-items: center;
399
+ padding: prepareMediaVariable(--_ctm-dn-dn-se-pg);
400
+
401
+ width: 100%;
402
+
403
+ &.open .list {
404
+ display: flex;
405
+ }
406
+ .est__dropdown__button {
407
+ display: flex;
408
+ align-items: center;
409
+ width: 100%;
410
+ }
411
+
412
+ .est__dropdown__icon {
413
+ position: absolute;
414
+ // top: 10px;
415
+ right: 5px;
416
+ }
417
+
418
+ .list {
419
+ display: none;
420
+ flex-direction: column;
421
+ border: 1px solid var(--_gray-200);
422
+ border-radius: 6px;
423
+ position: absolute;
424
+ top: 100%;
425
+ left: 0;
426
+ width: 100%;
427
+ background-color: #fff;
428
+ border-radius: 4px;
429
+ z-index: var(--_higher-zIndex);
430
+ max-height: 200px;
431
+ overflow-y: auto;
432
+ margin-top: var(
433
+ --_ctm-mob-lt-gp-bn-is,
434
+ var(--_ctm-tab-lt-gp-bn-is, var(--_ctm-lt-gp-bn-is))
435
+ );
436
+ gap: var(--_ctm-mob-lt-gp-bn-is, var(--_ctm-tab-lt-gp-bn-is, var(--_ctm-lt-gp-bn-is)));
437
+
438
+ &.top {
439
+ bottom: 100%;
440
+ top: auto;
441
+ }
442
+
443
+ .option {
444
+ cursor: pointer;
445
+ }
446
+ }
447
+ }
448
+ }
449
+ }
450
+ }
451
+ }
@@ -340,8 +340,6 @@
340
340
  position: relative;
341
341
  width: 100%;
342
342
  margin-top: 0px;
343
- width: prepareMediaVariable(--_ctm-dn-dn-se-wh);
344
-
345
343
  label {
346
344
  font-size: 14px;
347
345
  color: var(--_gray-700);
@@ -443,10 +441,7 @@
443
441
  --_ctm-mob-dn-dn-se-on-ad-lt-sg,
444
442
  var(--_ctm-tab-dn-dn-se-on-ad-lt-sg, var(--_ctm-dn-dn-se-on-ad-lt-sg))
445
443
  );
446
- gap: var(
447
- --_ctm-mob-dn-dn-se-dn-lt-im-sg,
448
- var(--_ctm-tab-dn-dn-se-dn-lt-im-sg, var(--_ctm-dn-dn-se-dn-lt-im-sg))
449
- );
444
+ gap: var(--_ctm-mob-lt-gp-bn-is, var(--_ctm-tab-lt-gp-bn-is, var(--_ctm-lt-gp-bn-is)));
450
445
 
451
446
  &.top {
452
447
  bottom: 100%;
@@ -454,17 +449,7 @@
454
449
  }
455
450
 
456
451
  .list__option {
457
- padding: 12px;
458
452
  cursor: pointer;
459
- padding: var(
460
- --_ctm-mob-dn-dn-se-dn-lt-im-pg,
461
- var(--_ctm-tab-dn-dn-se-dn-lt-im-pg, var(--_ctm-dn-dn-se-dn-lt-im-pg))
462
- );
463
-
464
- &:hover {
465
- background-color: var(--_primary-25);
466
- color: var(--_primary-400);
467
- }
468
453
  }
469
454
  }
470
455
  }
package/dist/section.scss CHANGED
@@ -90,6 +90,7 @@ section {
90
90
  &[data-div-type="cms-section-wrapper"] {
91
91
  // max-width: var(--_sf-wp-mx-wt);
92
92
  max-width: prepareMediaVariable(--_ctm-sec-lt-wh);
93
+ // min-height: prepareMediaVariable(--_ctm-sec-lt-mn-ht);
93
94
  margin-inline: auto;
94
95
  position: var(--_p-relative);
95
96
  width: 100%;
@@ -324,6 +324,7 @@ export declare const CMSElementsListEnum: {
324
324
  PRODUCT_SIZECHART: string;
325
325
  BADGE: string;
326
326
  CART_ATTRIBUTES: string;
327
+ LANGUAGE_MENU: string;
327
328
  };
328
329
  export declare enum CMSResponsiveModeEnums {
329
330
  DESKTOP = "desktop",