@sc-360-v2/storefront-cms-library 0.3.61 → 0.3.63

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 (47) hide show
  1. package/dist/add-products-tab copy.scss +9 -8
  2. package/dist/add-products-tab.scss +9 -8
  3. package/dist/badge.scss +87 -83
  4. package/dist/builder.js +1 -1
  5. package/dist/buyForHeaders.scss +6086 -1184
  6. package/dist/cart-details.scss +26 -22
  7. package/dist/cart-summary.scss +17 -143
  8. package/dist/cart-wrapper.scss +127 -0
  9. package/dist/cartDropdownOverlay.scss +23 -4
  10. package/dist/checkout.scss +96 -573
  11. package/dist/dropdownTemplate.scss +58 -4
  12. package/dist/icon-list.scss +25 -19
  13. package/dist/icons.js +1 -1
  14. package/dist/image-for-product.scss +19 -0
  15. package/dist/index.js +1 -1
  16. package/dist/item-stock.scss +27 -26
  17. package/dist/mega-menu-container.scss +96 -0
  18. package/dist/mega-menu.scss +832 -0
  19. package/dist/menu-v2.scss +30 -5
  20. package/dist/modal.scss +168 -8
  21. package/dist/order-status.scss +18 -15
  22. package/dist/past-orders.scss +279 -271
  23. package/dist/payment-methods.scss +72 -69
  24. package/dist/position-module.scss +2 -1
  25. package/dist/prefix-list.scss +3 -0
  26. package/dist/quick-links.scss +49 -46
  27. package/dist/quick-order-pad.scss +3 -0
  28. package/dist/quotes.scss +123 -117
  29. package/dist/rfqs.scss +123 -117
  30. package/dist/simple-list.scss +264 -0
  31. package/dist/table.scss +3 -9
  32. package/dist/templates.scss +299 -0
  33. package/dist/types/builder/elements/cart-wrapper/index.d.ts +44 -0
  34. package/dist/types/builder/elements/mega-menu/index.d.ts +47 -0
  35. package/dist/types/builder/elements/mega-menu-container/index.d.ts +44 -0
  36. package/dist/types/builder/elements/simple-list/index.d.ts +47 -0
  37. package/dist/types/builder/enums/index.d.ts +7 -1
  38. package/dist/types/builder/index.d.ts +5 -1
  39. package/dist/types/builder/tools/element-edit/cart-wrapper.d.ts +16 -0
  40. package/dist/types/builder/tools/element-edit/index.d.ts +5 -1
  41. package/dist/types/builder/tools/element-edit/mega-menu.d.ts +41 -0
  42. package/dist/types/builder/tools/element-edit/megaMenuContainer.d.ts +9 -0
  43. package/dist/types/builder/tools/element-edit/simple-list.d.ts +37 -0
  44. package/dist/types/website/constants/data-connectors.d.ts +18 -0
  45. package/dist/website.js +1 -1
  46. package/dist/widget.scss +4 -0
  47. package/package.json +1 -1
@@ -0,0 +1,832 @@
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+ @use "./functions.scss" as *;
4
+ $activeElementSelector: "[data-has-clicked='true']";
5
+ $es: '[data-div-type="element"]';
6
+ $mgc: '[data-element-type="mgContainer"]';
7
+ $smp: '[data-element-type="simple-list"]';
8
+ $wrapper: ".flex__menu__list__wrapper";
9
+ $menuItem: ".flex__menu__item";
10
+ // $subMenuContainer: ".flex__submenu__container";
11
+ // $subMenuItem: ".flex__sub__menu__item";
12
+ // $subMenuItemText: ".flex__sub__menu__item__text";
13
+ $nodatap: ".no__menu_item__p";
14
+ $hrz: "[data-element-type='mega-menu'] > .hrz";
15
+ $vtl: "[data-element-type='mega-menu'] > .vtl";
16
+ $hamburger: ".flex__menu__hamburger";
17
+ $hamburgerActive: "[data-hamburger-active='true']";
18
+ $wrapperData: (
19
+ start: (
20
+ left: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
21
+ ),
22
+ end: (
23
+ right: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
24
+ ),
25
+ center: (
26
+ left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px)}),
27
+ transform: translateX(-50%),
28
+ ),
29
+ );
30
+
31
+ $defaultValues: (
32
+ --_min-submenu-height: getListOfResponsive(650px, 400px, 550px),
33
+ );
34
+
35
+ @mixin hamburgerCSS() {
36
+ position: relative;
37
+ display: var(--_d-flex);
38
+ justify-content: prepareMediaVariable(--_ctm-meg-dn-hr-os-vl-at);
39
+ & > div {
40
+ &#{$wrapper} {
41
+ position: absolute;
42
+ // left: var(--_sf-hm-mc-lt-vl-v2, 0px);
43
+ // width: 100%;
44
+ // width: 100vw;
45
+ top: calc(100% + prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-y, 0px));
46
+ z-index: 2;
47
+ visibility: hidden;
48
+ opacity: 0;
49
+ max-height: 0px;
50
+ overflow: clip;
51
+ display: var(--_d-flex);
52
+ flex-direction: column;
53
+ gap: prepareMediaVariable(--_ctm-lt-im-gp);
54
+ align-items: flex-start;
55
+
56
+ @each $key, $val in $wrapperData {
57
+ &[data-position="#{$key}"] {
58
+ @each $k, $v in $val {
59
+ #{$k}: #{$v};
60
+ }
61
+ }
62
+ }
63
+
64
+ &:is([data-hamburger-active="true"] > *) {
65
+ // animation: animThree var(--_transition-duration) var(--_transition-timing-function) 1
66
+ // forwards alternate;
67
+ visibility: visible;
68
+ opacity: 1;
69
+ width: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-wh, 100%);
70
+ max-height: var(--_min-submenu-height, 650px);
71
+ overflow-y: auto;
72
+ }
73
+
74
+ & > #{$menuItem} {
75
+ width: 100%;
76
+ align-items: flex-start;
77
+ flex-direction: column;
78
+ gap: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-y)};
79
+ // & > #{$subMenuContainer} {
80
+ // width: 100% !important;
81
+ // position: static !important;
82
+ // transform: none !important;
83
+ // }
84
+
85
+ & > #{$es} {
86
+ position: var(--_p-relative) !important;
87
+ width: 100% !important;
88
+ left: 0 !important;
89
+ top: 0 !important;
90
+
91
+ &:is(#{$mgc}) {
92
+ & > .wrapper {
93
+ margin-inline: auto;
94
+ }
95
+ }
96
+ }
97
+ }
98
+
99
+ @keyframes animThree {
100
+ 100% {
101
+ max-height: var(--_min-submenu-height, 650px);
102
+ opacity: 1;
103
+ visibility: visible;
104
+ overflow-y: auto;
105
+ }
106
+ }
107
+ }
108
+ }
109
+
110
+ & > #{$hamburger} {
111
+ display: var(--_d-flex);
112
+ }
113
+ }
114
+
115
+ [data-div-type="element"] {
116
+ &[data-element-type="mega-menu"] {
117
+ width: calc(1% * #{prepareMediaVariable(--_ctm-meg-ele-nw-wh-vl)});
118
+ height: min-content;
119
+ margin: prepareMediaVariable(--_ctm-meg-lt-mn);
120
+ @include prepareMediaQueries($defaultValues);
121
+ // var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, auto)))
122
+
123
+ & > div {
124
+ &.wrapper {
125
+ width: 100%;
126
+ height: auto;
127
+ min-height: prepareMediaVariable(--_ctm-meg-lt-mn-ht);
128
+ // padding: #{prepareMediaVariable(--_ctm-lt-pg)};
129
+ // background: prepareMediaVariable(--_ctm-meg-dn-mu-cr-bd-cr);
130
+ // border-radius: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-rs);
131
+
132
+ // &[data-show-border="true"] {
133
+ // border-color: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-cr);
134
+ // border-width: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-wh);
135
+ // border-style: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-se);
136
+ // }
137
+ // &[data-show-boxshadow="true"] {
138
+ // box-shadow: prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-ae)
139
+ // prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-br) prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-sd)
140
+ // prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-cr);
141
+ // }
142
+
143
+ &.hrz {
144
+ & > div {
145
+ &#{$wrapper} {
146
+ display: var(--_d-flex);
147
+ flex-direction: row;
148
+ gap: prepareMediaVariable(--_ctm-meg-lt-im-gp);
149
+ justify-content: prepareMediaVariable(--_ctm-meg-lt-jy-ct);
150
+ align-items: center;
151
+ }
152
+ }
153
+ }
154
+
155
+ &.vtl {
156
+ & > div {
157
+ &#{$wrapper} {
158
+ display: var(--_d-flex);
159
+ flex-direction: column;
160
+ gap: prepareMediaVariable(--_ctm-meg-lt-im-gp);
161
+ }
162
+ }
163
+ }
164
+
165
+ & > div {
166
+ &#{$wrapper} {
167
+ padding: #{prepareMediaVariable(--_ctm-meg-lt-pg)};
168
+ background: prepareMediaVariable(--_ctm-meg-dn-mu-cr-bd-cr);
169
+ border-radius: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-rs);
170
+
171
+ &:is([data-show-border="true"] > *) {
172
+ border-color: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-cr);
173
+ border-width: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-wh);
174
+ border-style: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-se);
175
+ }
176
+ &:is([data-show-boxshadow="true"] > *) {
177
+ box-shadow: prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-ae)
178
+ prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-br)
179
+ prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-sd)
180
+ prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-cr);
181
+ }
182
+ & > div {
183
+ &#{$menuItem} {
184
+ position: relative;
185
+ padding: var(
186
+ --_sf-it-at-pd,
187
+ var(--_sf-it-hr-pd, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-pg)})
188
+ );
189
+ background: var(
190
+ --_sf-it-at-bd,
191
+ var(--_sf-it-hr-bd, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-bd-cr)})
192
+ );
193
+ border-radius: var(
194
+ --_sf-it-at-br,
195
+ var(--_sf-it-hr-br, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-rs)})
196
+ );
197
+ display: var(--_d-flex);
198
+ align-items: center;
199
+ &:is(#{$vtl} *) {
200
+ align-items: flex-start;
201
+ flex-direction: column;
202
+ gap: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-y)};
203
+ }
204
+ &:hover {
205
+ --_sf-it-hr-pd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-pg)};
206
+ --_sf-it-hr-bd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-bd-cr)};
207
+ --_sf-it-hr-br: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-br-rs)};
208
+ --_sf-it-hr-brc: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-br-cr)};
209
+ --_sf-it-hr-bw: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-br-wh)};
210
+ --_sf-it-hr-bs: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-br-se)};
211
+
212
+ --_sf-it-hr-bsa: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-sw-ae)};
213
+ --_sf-it-hr-blr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-sw-br)};
214
+ --_sf-it-hr-spr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-sw-sd)};
215
+ --_sf-it-hr-bscl: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-sw-cr)};
216
+
217
+ --_sf-it-hr-ff: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-ft-fy)};
218
+ --_sf-it-hr-fs: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-ft-se)};
219
+ --_sf-it-hr-fclr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-cr)};
220
+ --_sf-it-hr-fw: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-ft-wt)};
221
+
222
+ --_sf-it-hr-fsi: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-ft-se-ic)};
223
+ --_sf-it-hr-td: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-ue)};
224
+ --_sf-it-hr-tae: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-tt-an)};
225
+ --_sf-it-hr-ls: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-lr-sg)};
226
+ --_sf-it-hr-lh: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-le-ht)};
227
+ }
228
+ &.active {
229
+ --_sf-it-at-pd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-pg)};
230
+ --_sf-it-at-bd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-bd-cr)};
231
+ --_sf-it-at-br: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-rs)};
232
+ --_sf-it-at-brc: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-cr)};
233
+ --_sf-it-at-bw: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-wh)};
234
+ --_sf-it-at-bs: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-se)};
235
+
236
+ --_sf-it-at-bsa: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-ae)};
237
+ --_sf-it-at-blr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-br)};
238
+ --_sf-it-at-spr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-sd)};
239
+ --_sf-it-at-bscl: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-cr)};
240
+
241
+ --_sf-it-at-ff: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-fy)};
242
+ --_sf-it-at-fs: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-se)};
243
+ --_sf-it-at-fclr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-cr)};
244
+ --_sf-it-at-fw: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-wt)};
245
+ --_sf-it-at-fsi: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-se-ic)};
246
+ --_sf-it-at-td: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ue)};
247
+ --_sf-it-at-tae: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-tt-an)};
248
+ --_sf-it-at-ls: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-lr-sg)};
249
+ --_sf-it-at-lh: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-le-ht)};
250
+ }
251
+
252
+ &[data-show-border="true"] {
253
+ border-color: var(
254
+ --_sf-it-at-brc,
255
+ var(
256
+ --_sf-it-hr-brc,
257
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-cr)}
258
+ )
259
+ );
260
+ border-width: var(
261
+ --_sf-it-at-bw,
262
+ var(--_sf-it-hr-bw, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-wh)})
263
+ );
264
+ border-style: var(
265
+ --_sf-it-at-bs,
266
+ var(--_sf-it-hr-bs, prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-se))
267
+ );
268
+ }
269
+ &[data-show-boxshadow="true"] {
270
+ box-shadow: var(
271
+ --_sf-it-at-bsa,
272
+ var(
273
+ --_sf-it-hr-bsa,
274
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-ae)}
275
+ )
276
+ )
277
+ var(
278
+ --_sf-it-at-blr,
279
+ var(
280
+ --_sf-it-hr-blr,
281
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-br)}
282
+ )
283
+ )
284
+ var(
285
+ --_sf-it-at-spr,
286
+ var(
287
+ --_sf-it-hr-spr,
288
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-sd)}
289
+ )
290
+ )
291
+ var(
292
+ --_sf-it-at-bscl,
293
+ var(
294
+ --_sf-it-hr-bscl,
295
+ prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-cr)
296
+ )
297
+ );
298
+ }
299
+
300
+ & > a {
301
+ display: var(--_d-flex);
302
+ justify-content: space-between;
303
+ align-items: center;
304
+ gap: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-gp);
305
+ & > span {
306
+ display: var(--_d-flex);
307
+ font-family:
308
+ var(
309
+ --_sf-it-at-ff,
310
+ var(
311
+ --_sf-it-hr-ff,
312
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-fy)}
313
+ )
314
+ ),
315
+ sans-serif;
316
+ font-size: var(
317
+ --_sf-it-at-fs,
318
+ var(
319
+ --_sf-it-hr-fs,
320
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-se)}
321
+ )
322
+ );
323
+ color: var(
324
+ --_sf-it-at-fclr,
325
+ var(
326
+ --_sf-it-hr-fclr,
327
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-cr)}
328
+ )
329
+ );
330
+ font-weight: var(
331
+ --_sf-it-at-fw,
332
+ var(
333
+ --_sf-it-hr-fw,
334
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-wt)}
335
+ )
336
+ );
337
+ font-style: var(
338
+ --_sf-it-at-fsi,
339
+ var(
340
+ --_sf-it-hr-fsi,
341
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-se-ic)}
342
+ )
343
+ );
344
+ text-decoration: var(
345
+ --_sf-it-at-td,
346
+ var(--_sf-it-hr-td, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ue)})
347
+ );
348
+ text-align: var(
349
+ --_sf-it-at-tae,
350
+ var(
351
+ --_sf-it-hr-tae,
352
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-tt-an)}
353
+ )
354
+ );
355
+ letter-spacing: var(
356
+ --_sf-it-at-ls,
357
+ var(
358
+ --_sf-it-hr-ls,
359
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-lr-sg)}
360
+ )
361
+ );
362
+ line-height: var(
363
+ --_sf-it-at-lh,
364
+ var(
365
+ --_sf-it-hr-lh,
366
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-le-ht)}
367
+ )
368
+ );
369
+
370
+ &.flex__menu__item__icon {
371
+ &[data-rotate="true"] {
372
+ --_sf-svg-tr: 180deg;
373
+ }
374
+ svg {
375
+ width: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se);
376
+ height: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se);
377
+ transform: rotate(#{var(--_sf-svg-tr, 0deg)});
378
+ transition: transform var(--_transition-duration)
379
+ var(--_transition-timing-function);
380
+
381
+ path {
382
+ stroke: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-c1);
383
+ }
384
+ }
385
+ }
386
+ }
387
+ }
388
+
389
+ & > #{$es} {
390
+ position: var(--_p-absolute);
391
+
392
+ &:is(.hrz > div > div > *) {
393
+ top: 100%; // Need to Integrate top value
394
+ &:is(#{$mgc}) {
395
+ left: var(--_sf-mg-dm-ps-vl, 0px);
396
+ }
397
+
398
+ &:is(#{$smp}) {
399
+ left: prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-x, 0px);
400
+ }
401
+ // left: 0px;
402
+ }
403
+ &:is(.vtl > div > div > *) {
404
+ left: 100%; // Need to Integrate top value
405
+
406
+ &:is(#{$mgc}) {
407
+ top: var(--_sf-mg-dm-ps-vl, 0px);
408
+ }
409
+ }
410
+ }
411
+
412
+ // Sub Item Container
413
+
414
+ // & > ul {
415
+ // &#{$subMenuContainer} {
416
+ // background: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-bd-cr);
417
+ // border-radius: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-rs);
418
+ // padding: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-pg);
419
+
420
+ // &:is(#{$hrz} *) {
421
+ // position: absolute;
422
+ // left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-x)});
423
+ // width: calc(100% + #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-wh)});
424
+ // top: calc(100% + #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-y)});
425
+ // transform: translateX(-50%);
426
+ // z-index: 2;
427
+ // }
428
+ // &:is(#{$vtl} *) {
429
+ // width: 100%;
430
+ // }
431
+
432
+ // // max-height: 0px;
433
+ // // overflow: clip;
434
+ // max-height: 500px;
435
+ // overflow-y: auto;
436
+ // // animation: animTwo var(--_transition-duration)
437
+ // // var(--_transition-timing-function) 1 forwards alternate;
438
+
439
+ // @keyframes animTwo {
440
+ // 100% {
441
+ // max-height: 500px;
442
+ // overflow-y: auto;
443
+ // }
444
+ // }
445
+
446
+ // &[data-show-border="true"] {
447
+ // border-width: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-wh);
448
+ // border-color: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-cr);
449
+ // border-style: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-se);
450
+ // }
451
+ // &[data-show-boxshadow="true"] {
452
+ // box-shadow: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-ae)
453
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-br)
454
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-sd)
455
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-cr);
456
+ // }
457
+
458
+ // & > li {
459
+ // &#{$subMenuItem} {
460
+ // display: var(--_d-flex);
461
+ // flex-direction: column;
462
+
463
+ // padding: var(
464
+ // --_sf-sb-it-at-pd,
465
+ // var(
466
+ // --_sf-sb-it-hr-pd,
467
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-pg)}
468
+ // )
469
+ // );
470
+ // background: var(
471
+ // --_sf-sb-it-at-bd,
472
+ // var(
473
+ // --_sf-sb-it-hr-bd,
474
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-bd-cr)}
475
+ // )
476
+ // );
477
+ // border-radius: var(
478
+ // --_sf-sb-it-at-br,
479
+ // var(
480
+ // --_sf-sb-it-hr-br,
481
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-rs)}
482
+ // )
483
+ // );
484
+
485
+ // &[data-show-border="true"] {
486
+ // border-color: var(
487
+ // --_sf-sb-it-at-brc,
488
+ // var(
489
+ // --_sf-sb-it-hr-brc,
490
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-cr)}
491
+ // )
492
+ // );
493
+ // border-width: var(
494
+ // --_sf-sb-it-at-bw,
495
+ // var(
496
+ // --_sf-sb-it-hr-bw,
497
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-wh)}
498
+ // )
499
+ // );
500
+ // border-style: var(
501
+ // --_sf-sb-it-at-bs,
502
+ // var(
503
+ // --_sf-sb-it-hr-bs,
504
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-se)
505
+ // )
506
+ // );
507
+ // }
508
+ // &[data-show-boxshadow="true"] {
509
+ // box-shadow: var(
510
+ // --_sf-sb-it-at-bsa,
511
+ // var(
512
+ // --_sf-sb-it-hr-bsa,
513
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-ae)}
514
+ // )
515
+ // )
516
+ // var(
517
+ // --_sf-sb-it-at-blr,
518
+ // var(
519
+ // --_sf-sb-it-hr-blr,
520
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-br)}
521
+ // )
522
+ // )
523
+ // var(
524
+ // --_sf-sb-it-at-spr,
525
+ // var(
526
+ // --_sf-sb-it-hr-spr,
527
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-sd)}
528
+ // )
529
+ // )
530
+ // var(
531
+ // --_sf-sb-it-at-bscl,
532
+ // var(
533
+ // --_sf-sb-it-hr-bscl,
534
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-cr)
535
+ // )
536
+ // );
537
+ // }
538
+
539
+ // &:hover {
540
+ // --_sf-sb-it-hr-pd: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-hr-se-pg)};
541
+ // --_sf-sb-it-hr-bd: #{prepareMediaVariable(
542
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-bd-cr
543
+ // )};
544
+ // --_sf-sb-it-hr-br: #{prepareMediaVariable(
545
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-rs
546
+ // )};
547
+ // --_sf-sb-it-hr-brc: #{prepareMediaVariable(
548
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-cr
549
+ // )};
550
+ // --_sf-sb-it-hr-bw: #{prepareMediaVariable(
551
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-wh
552
+ // )};
553
+ // --_sf-sb-it-hr-bs: #{prepareMediaVariable(
554
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-se
555
+ // )};
556
+ // --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
557
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-ae
558
+ // )};
559
+ // --_sf-sb-it-hr-blr: #{prepareMediaVariable(
560
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-br
561
+ // )};
562
+ // --_sf-sb-it-hr-spr: #{prepareMediaVariable(
563
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-sd
564
+ // )};
565
+ // --_sf-sb-it-hr-bscl: #{prepareMediaVariable(
566
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-cr
567
+ // )};
568
+
569
+ // --_sf-sb-it-hr-ff: #{prepareMediaVariable(
570
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-fy
571
+ // )};
572
+ // --_sf-sb-it-hr-fs: #{prepareMediaVariable(
573
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-se
574
+ // )};
575
+ // --_sf-sb-it-hr-fclr: #{prepareMediaVariable(
576
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-cr
577
+ // )};
578
+ // --_sf-sb-it-hr-fw: #{prepareMediaVariable(
579
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-wt
580
+ // )};
581
+
582
+ // --_sf-sb-it-hr-fsi: #{prepareMediaVariable(
583
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-se-ic
584
+ // )};
585
+ // --_sf-sb-it-hr-td: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-hr-se-ue)};
586
+ // --_sf-sb-it-hr-tae: #{prepareMediaVariable(
587
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-tt-an
588
+ // )};
589
+ // --_sf-sb-it-hr-ls: #{prepareMediaVariable(
590
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-lr-sg
591
+ // )};
592
+ // --_sf-sb-it-hr-lh: #{prepareMediaVariable(
593
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-le-ht
594
+ // )};
595
+ // }
596
+ // &.active {
597
+ // --_sf-sb-it-at-pd: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-sd-se-pg)};
598
+ // --_sf-sb-it-at-bd: #{prepareMediaVariable(
599
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-bd-cr
600
+ // )};
601
+ // --_sf-sb-it-at-br: #{prepareMediaVariable(
602
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-rs
603
+ // )};
604
+ // --_sf-sb-it-at-brc: #{prepareMediaVariable(
605
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-cr
606
+ // )};
607
+ // --_sf-sb-it-at-bw: #{prepareMediaVariable(
608
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-wh
609
+ // )};
610
+ // --_sf-sb-it-at-bs: #{prepareMediaVariable(
611
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-se
612
+ // )};
613
+ // --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
614
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-ae
615
+ // )};
616
+ // --_sf-sb-it-at-blr: #{prepareMediaVariable(
617
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-br
618
+ // )};
619
+ // --_sf-sb-it-at-spr: #{prepareMediaVariable(
620
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-sd
621
+ // )};
622
+ // --_sf-sb-it-at-bscl: #{prepareMediaVariable(
623
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-cr
624
+ // )};
625
+
626
+ // --_sf-sb-it-at-ff: #{prepareMediaVariable(
627
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-fy
628
+ // )};
629
+ // --_sf-sb-it-at-fs: #{prepareMediaVariable(
630
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-se
631
+ // )};
632
+ // --_sf-sb-it-at-fclr: #{prepareMediaVariable(
633
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-cr
634
+ // )};
635
+ // --_sf-sb-it-at-fw: #{prepareMediaVariable(
636
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-wt
637
+ // )};
638
+ // --_sf-sb-it-at-fsi: #{prepareMediaVariable(
639
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-se-ic
640
+ // )};
641
+ // --_sf-sb-it-at-td: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-sd-se-ue)};
642
+ // --_sf-sb-it-at-tae: #{prepareMediaVariable(
643
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-tt-an
644
+ // )};
645
+ // --_sf-sb-it-at-ls: #{prepareMediaVariable(
646
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-lr-sg
647
+ // )};
648
+ // --_sf-sb-it-at-lh: #{prepareMediaVariable(
649
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-le-ht
650
+ // )};
651
+ // }
652
+
653
+ // & > a {
654
+ // display: var(--_d-flex);
655
+ // justify-content: space-between;
656
+ // align-items: center;
657
+
658
+ // & > span {
659
+ // display: var(--_d-flex);
660
+
661
+ // &#{$subMenuItemText} {
662
+ // font-family: var(
663
+ // --_sf-it-at-ff,
664
+ // var(
665
+ // --_sf-it-hr-ff,
666
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ft-fy)}
667
+ // )
668
+ // ),
669
+ // sans-serif;
670
+ // font-size: var(
671
+ // --_sf-sb-it-at-fs,
672
+ // var(
673
+ // --_sf-sb-it-hr-fs,
674
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ft-se)}
675
+ // )
676
+ // );
677
+ // color: var(
678
+ // --_sf-sb-it-at-fclr,
679
+ // var(
680
+ // --_sf-sb-it-hr-fclr,
681
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-cr)}
682
+ // )
683
+ // );
684
+ // font-weight: var(
685
+ // --_sf-sb-it-at-fw,
686
+ // var(
687
+ // --_sf-sb-it-hr-fw,
688
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-fw-se-ft-wt)}
689
+ // )
690
+ // );
691
+ // font-style: var(
692
+ // --_sf-sb-it-at-fsi,
693
+ // var(
694
+ // --_sf-sb-it-hr-fsi,
695
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ft-se-ic)}
696
+ // )
697
+ // );
698
+ // text-decoration: var(
699
+ // --_sf-sb-it-at-td,
700
+ // var(
701
+ // --_sf-sb-it-hr-td,
702
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ue)}
703
+ // )
704
+ // );
705
+ // text-align: var(
706
+ // --_sf-sb-it-at-tae,
707
+ // var(
708
+ // --_sf-sb-it-hr-tae,
709
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-tt-an)}
710
+ // )
711
+ // );
712
+ // letter-spacing: var(
713
+ // --_sf-sb-it-at-ls,
714
+ // var(
715
+ // --_sf-sb-it-hr-ls,
716
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-lr-sg)}
717
+ // )
718
+ // );
719
+ // line-height: var(
720
+ // --_sf-sb-it-at-lh,
721
+ // var(
722
+ // --_sf-sb-it-hr-lh,
723
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-le-ht)}
724
+ // )
725
+ // );
726
+ // }
727
+ // }
728
+ // }
729
+ // }
730
+ // }
731
+ // }
732
+ // }
733
+ }
734
+ }
735
+ }
736
+
737
+ & > p {
738
+ &#{$nodatap} {
739
+ font-size: 14px;
740
+ color: var(--_gray-500);
741
+ }
742
+ }
743
+ }
744
+ & > #{$hamburger} {
745
+ display: var(--_d-none);
746
+ padding: var(--_sf-hm-hr-pd, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-pg)});
747
+ border-radius: var(
748
+ --_sf-hm-hr-br,
749
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-rs)}
750
+ );
751
+ background: var(--_sf-hm-hr-bd, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-bd-cr)});
752
+
753
+ &[data-show-border="true"] {
754
+ border-style: var(
755
+ --_sf-hm-hr-bs,
756
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-se)}
757
+ );
758
+ border-width: var(
759
+ --_sf-hm-hr-bw,
760
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-wh)}
761
+ );
762
+ border-color: var(
763
+ --_sf-hm-hr-bc,
764
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-cr)}
765
+ );
766
+ }
767
+
768
+ &[data-show-boxshadow="true"] {
769
+ box-shadow: var(
770
+ --_sf-hm-hr-bsa,
771
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-ae)}
772
+ )
773
+ var(--_sf-hm-hr-blr, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-br)})
774
+ var(--_sf-hm-hr-spr, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-sd)})
775
+ var(--_sf-hm-hr-bscl, prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-cr));
776
+ }
777
+
778
+ &:hover {
779
+ --_sf-hm-hr-ic-sz: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-in-se)};
780
+ --_sf-hm-hr-ic-clr: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-in-c1)};
781
+
782
+ --_sf-hm-hr-pd: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-pg)};
783
+ --_sf-hm-hr-br: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-br-rs)};
784
+ --_sf-hm-hr-bd: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-bd-cr)};
785
+
786
+ --_sf-hm-hr-bs: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-br-se)};
787
+ --_sf-hm-hr-bw: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-wh)};
788
+ --_sf-hm-hr-bc: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-br-cr)};
789
+
790
+ --_sf-hm-hr-bsa: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-ae)};
791
+ --_sf-hm-hr-blr: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-br)};
792
+ --_sf-hm-hr-spr: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-sd)};
793
+ --_sf-hm-hr-bscl: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-cr)};
794
+ }
795
+
796
+ & > svg {
797
+ width: var(--_sf-hm-hr-ic-sz, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-in-se)});
798
+ height: var(
799
+ --_sf-hm-hr-ic-sz,
800
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-in-se)}
801
+ );
802
+
803
+ path {
804
+ stroke: var(
805
+ --_sf-hm-hr-ic-clr,
806
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-in-c1)}
807
+ );
808
+ }
809
+ }
810
+ }
811
+
812
+ @media only screen and (min-width: 10px) {
813
+ &.dk {
814
+ @include hamburgerCSS();
815
+ }
816
+ }
817
+
818
+ @media only screen and (min-width: 10px) and (max-width: 1023px) {
819
+ &.tb {
820
+ @include hamburgerCSS();
821
+ }
822
+ }
823
+
824
+ @media only screen and (min-width: 10px) and (max-width: 767px) {
825
+ &.mb {
826
+ @include hamburgerCSS();
827
+ }
828
+ }
829
+ }
830
+ }
831
+ }
832
+ }