@sc-360-v2/storefront-cms-library 0.4.47 → 0.4.49

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 (16) hide show
  1. package/dist/add-products-tab.scss +847 -0
  2. package/dist/allocations.scss +217 -218
  3. package/dist/builder.js +1 -1
  4. package/dist/bulk-variant-picker.scss +511 -309
  5. package/dist/cart-details.scss +877 -56
  6. package/dist/cart-summary.scss +38 -38
  7. package/dist/cartAttributes.scss +37 -5
  8. package/dist/cartDropdownOverlay.scss +7 -0
  9. package/dist/dropdownTemplate.scss +41 -3
  10. package/dist/language-selector.scss +0 -30
  11. package/dist/profile.scss +2 -2
  12. package/dist/static-global.scss +31 -0
  13. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +215 -0
  14. package/dist/types/builder/tools/element-edit/bulkVariantPicker.d.ts +1 -1
  15. package/dist/types/builder/tools/element-edit/cartAttributes.d.ts +66 -0
  16. package/package.json +1 -1
package/dist/allocations.scss CHANGED
@@ -325,222 +325,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
325
325
  display: flex;
326
326
  }
327
327
 
328
- &:hover .icon--default {
329
- // opacity: 0;
330
- display: none;
331
- }
332
- }
333
- .btn__with__text[data-btn-name="loadMore"] {
334
- &[data-show-shadow="false"] {
335
- --_show-shadow: none;
336
- }
337
- &[data-icon-position="left"] {
338
- --_sf-fd-bn: row;
339
- }
340
- &[data-icon-position="right"] {
341
- --_sf-fd-bn: row-reverse;
342
- }
343
- &[data-icon-position="center"] {
344
- --_sf-fd-bn: row;
345
- }
346
-
347
- &:hover {
348
- --_sf-hr-bd-cr: var(
349
- --_ctm-mob-dn-ld-me-bn-hr-se-bd-cr,
350
- var(--_ctm-tab-dn-ld-me-bn-hr-se-bd-cr, var(--_ctm-dn-ld-me-bn-hr-se-bd-cr))
351
- );
352
- --_sf-hr-br-cr: var(
353
- --_ctm-mob-dn-ld-me-bn-hr-se-br-cr,
354
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-cr, var(--_ctm-dn-ld-me-bn-hr-se-br-cr))
355
- );
356
- --_sf-hr-br-se: var(
357
- --_ctm-mob-dn-ld-me-bn-hr-se-br-se,
358
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-se, var(--_ctm-dn-ld-me-bn-hr-se-br-se))
359
- );
360
- --_sf-hr-br-wh: var(
361
- --_ctm-mob-dn-ld-me-bn-hr-se-br-wh,
362
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-wh, var(--_ctm-dn-ld-me-bn-hr-se-br-wh))
363
- );
364
- --_sf-hr-br-rs: var(
365
- --_ctm-mob-dn-ld-me-bn-hr-se-br-rs,
366
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-rs, var(--_ctm-dn-ld-me-bn-hr-se-br-rs))
367
- );
368
- --_sf-hr-at: var(
369
- --_ctm-mob-dn-ld-me-bn-hr-se-at,
370
- var(--_ctm-tab-dn-ld-me-bn-hr-se-at, var(--_ctm-dn-ld-me-bn-hr-se-at))
371
- );
372
- --_sf-hr-gp: var(
373
- --_ctm-mob-dn-ld-me-bn-hr-se-gp,
374
- var(--_ctm-tab-dn-ld-me-bn-hr-se-gp, var(--_ctm-dn-ld-me-bn-hr-se-gp))
375
- );
376
-
377
- // for shadow
378
- --_sf-hr-sw-ae: var(
379
- --_ctm-mob-dn-ld-me-bn-hr-se-sw-ae,
380
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-ae, var(--_ctm-dn-ld-me-bn-hr-se-sw-ae))
381
- );
382
- --_sf-hr-sw-br: var(
383
- --_ctm-mob-dn-ld-me-bn-hr-se-sw-br,
384
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-br, var(--_ctm-dn-ld-me-bn-hr-se-sw-br))
385
- );
386
- --_sf-hr-sw-hr: var(
387
- --_ctm-mob-dn-ld-me-bn-hr-se-sw-hr,
388
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-hr, var(--_ctm-dn-ld-me-bn-hr-se-sw-hr))
389
- );
390
- --_sf-hr-sw-cr: var(
391
- --_ctm-mob-dn-ld-me-bn-hr-se-sw-cr,
392
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-cr, var(--_ctm-dn-ld-me-bn-hr-se-sw-cr))
393
- );
394
-
395
- // for font
396
-
397
- --_sf-hr-cr: var(
398
- --_ctm-mob-dn-ld-me-bn-hr-se-cr,
399
- var(--_ctm-tab-dn-ld-me-bn-hr-se-cr, var(--_ctm-dn-ld-me-bn-hr-se-cr))
400
- );
401
- --_sf-hr-ft-fy: var(
402
- --_ctm-mob-dn-ld-me-bn-hr-se-ft-fy,
403
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-fy, var(--_ctm-dn-ld-me-bn-hr-se-ft-fy))
404
- );
405
- --_sf-hr-ft-se: var(
406
- --_ctm-mob-dn-ld-me-bn-hr-se-ft-se,
407
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se, var(--_ctm-dn-ld-me-bn-hr-se-ft-se))
408
- );
409
- --_sf-hr-ft-wt: var(
410
- --_ctm-mob-dn-ld-me-bn-hr-se-ft-wt,
411
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-wt, var(--_ctm-dn-ld-me-bn-hr-se-ft-wt))
412
- );
413
- --_sf-hr-ft-se-ic: var(
414
- --_ctm-mob-dn-ld-me-bn-hr-se-ft-se-ic,
415
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se-ic, var(--_ctm-dn-ld-me-bn-hr-se-ft-se-ic))
416
- );
417
- --_sf-hr-tt-an: var(
418
- --_ctm-mob-dn-ld-me-bn-hr-se-tt-an,
419
- var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-an, var(--_ctm-dn-ld-me-bn-hr-se-tt-an))
420
- );
421
- --_sf-hr-lr-sg: var(
422
- --_ctm-mob-dn-ld-me-bn-hr-se-lr-sg,
423
- var(--_ctm-tab-dn-ld-me-bn-hr-se-lr-sg, var(--_ctm-dn-ld-me-bn-hr-se-lr-sg))
424
- );
425
- --_sf-hr-le-ht: var(
426
- --_ctm-mob-dn-ld-me-bn-hr-se-le-ht,
427
- var(--_ctm-tab-dn-ld-me-bn-hr-se-le-ht, var(--_ctm-dn-ld-me-bn-hr-se-le-ht))
428
- );
429
-
430
- --_sf-hr-in-se: var(
431
- --_ctm-mob-dn-ld-me-bn-hr-se-in-se,
432
- var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se))
433
- );
434
- --_sf-hr-in-se: var(
435
- --_ctm-mob-dn-ld-me-bn-hr-se-in-se,
436
- var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se))
437
- );
438
- --_sf-hr-in-c1: var(
439
- --_ctm-mob-dn-ld-me-bn-hr-se-in-c1,
440
- var(--_ctm-tab-dn-ld-me-bn-hr-se-in-c1, var(--_ctm-dn-ld-me-bn-hr-se-in-c1))
441
- );
442
- --_sf-hr-ue: var(
443
- --_ctm-mob-dn-ld-me-bn-hr-se-ue,
444
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ue, var(--_ctm-dn-ld-me-bn-hr-se-ue))
445
- );
446
-
447
- // for pading and width
448
- --_sf-hr-pg: var(
449
- --_ctm-mob-dn-ld-me-bn-hr-pg,
450
- var(--_ctm-tab-dn-ld-me-bn-hr-pg, var(--_ctm-dn-ld-me-bn-hr-pg))
451
- );
452
- --_sf-hr-wh: var(
453
- --_ctm-mob-dn-ld-me-bn-hr-wh,
454
- var(--_ctm-tab-dn-ld-me-bn-hr-wh, var(--_ctm-dn-ld-me-bn-hr-wh))
455
- );
456
-
457
- &[data-hover-show-shadow="false"] {
458
- --_hover-show-shadow: none;
459
- }
460
- &[data-hover-show-icon="false"] {
461
- --_hover-show-icon: none;
462
- }
463
- }
464
- background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-bd-cr));
465
-
466
- padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-pg));
467
- width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-wh));
468
- display: flex;
469
- flex-direction: var(--_sf-fd-bn);
470
- align-items: center;
471
-
472
- justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-at));
473
- gap: var(--_sf-hr-gp, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-gp));
474
-
475
- border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-rs));
476
-
477
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-ae))
478
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-br))
479
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-sd))
480
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-cr));
481
-
482
- &[data-show-border="true"] {
483
- border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-cr));
484
-
485
- border-style: var(--_sf-hr-br-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-se));
486
-
487
- border-width: var(--_sf-hr-br-wh, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-wh));
488
- }
489
-
490
- .txt {
491
- display: flex;
492
-
493
- color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-cr));
494
-
495
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-fy));
496
-
497
- font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-se));
498
-
499
- font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-wt));
500
-
501
- font-style: var(
502
- --_sf-hr-ft-se-ic,
503
- prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-se-ic)
504
- );
505
-
506
- text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-tt-an));
507
-
508
- letter-spacing: var(--_sf-hr-lr-sg, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-lr-sg));
509
-
510
- line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-le-ht));
511
-
512
- text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
513
- }
514
-
515
- .icon {
516
- display: var(--_hover-show-icon, var(--_show-icon, flex));
517
- svg {
518
- width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-se));
519
- height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-se));
520
-
521
- path {
522
- stroke: var(--_sf-hr-in-c1, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-c1));
523
- }
524
- }
525
- }
526
- [data-element-style="Text"] {
527
- display: inline-block;
528
- width: 100%;
529
- }
530
-
531
- .icon--hover {
532
- // position: absolute;
533
- // inset: 0;
534
- // opacity: 0;
535
- display: none;
536
- transition: opacity 0.2s ease;
537
- }
538
-
539
- &:hover .icon--hover {
540
- // opacity: 1;
541
- display: flex;
542
- }
543
-
544
328
  &:hover .icon--default {
545
329
  // opacity: 0;
546
330
  display: none;
@@ -695,10 +479,9 @@ $resizeActive: '[data-cms-element-resizer="true"]';
695
479
 
696
480
  &[data-alternative-row-colors="true"] {
697
481
  tbody .tbody__row__divider:nth-child(odd) {
698
- background-color: #f76b6b;
482
+ background-color: prepareMediaVariable(--_ctm-dn-rw-ae-cr-bd-cr);
699
483
  }
700
484
  }
701
-
702
485
  .table__wrapper {
703
486
  flex: 1 1 auto;
704
487
  min-width: 0;
@@ -1133,6 +916,222 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1133
916
  }
1134
917
  }
1135
918
  }
919
+ .btn__with__text[data-btn-name="loadMore"] {
920
+ &[data-show-shadow="false"] {
921
+ --_show-shadow: none;
922
+ }
923
+ &[data-icon-position="left"] {
924
+ --_sf-fd-bn: row;
925
+ }
926
+ &[data-icon-position="right"] {
927
+ --_sf-fd-bn: row-reverse;
928
+ }
929
+ &[data-icon-position="center"] {
930
+ --_sf-fd-bn: row;
931
+ }
932
+
933
+ &:hover {
934
+ --_sf-hr-bd-cr: var(
935
+ --_ctm-mob-dn-ld-me-bn-hr-se-bd-cr,
936
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-bd-cr, var(--_ctm-dn-ld-me-bn-hr-se-bd-cr))
937
+ );
938
+ --_sf-hr-br-cr: var(
939
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-cr,
940
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-cr, var(--_ctm-dn-ld-me-bn-hr-se-br-cr))
941
+ );
942
+ --_sf-hr-br-se: var(
943
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-se,
944
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-se, var(--_ctm-dn-ld-me-bn-hr-se-br-se))
945
+ );
946
+ --_sf-hr-br-wh: var(
947
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-wh,
948
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-wh, var(--_ctm-dn-ld-me-bn-hr-se-br-wh))
949
+ );
950
+ --_sf-hr-br-rs: var(
951
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-rs,
952
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-rs, var(--_ctm-dn-ld-me-bn-hr-se-br-rs))
953
+ );
954
+ --_sf-hr-at: var(
955
+ --_ctm-mob-dn-ld-me-bn-hr-se-at,
956
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-at, var(--_ctm-dn-ld-me-bn-hr-se-at))
957
+ );
958
+ --_sf-hr-gp: var(
959
+ --_ctm-mob-dn-ld-me-bn-hr-se-gp,
960
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-gp, var(--_ctm-dn-ld-me-bn-hr-se-gp))
961
+ );
962
+
963
+ // for shadow
964
+ --_sf-hr-sw-ae: var(
965
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-ae,
966
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-ae, var(--_ctm-dn-ld-me-bn-hr-se-sw-ae))
967
+ );
968
+ --_sf-hr-sw-br: var(
969
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-br,
970
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-br, var(--_ctm-dn-ld-me-bn-hr-se-sw-br))
971
+ );
972
+ --_sf-hr-sw-hr: var(
973
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-hr,
974
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-hr, var(--_ctm-dn-ld-me-bn-hr-se-sw-hr))
975
+ );
976
+ --_sf-hr-sw-cr: var(
977
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-cr,
978
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-cr, var(--_ctm-dn-ld-me-bn-hr-se-sw-cr))
979
+ );
980
+
981
+ // for font
982
+
983
+ --_sf-hr-cr: var(
984
+ --_ctm-mob-dn-ld-me-bn-hr-se-cr,
985
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-cr, var(--_ctm-dn-ld-me-bn-hr-se-cr))
986
+ );
987
+ --_sf-hr-ft-fy: var(
988
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-fy,
989
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-fy, var(--_ctm-dn-ld-me-bn-hr-se-ft-fy))
990
+ );
991
+ --_sf-hr-ft-se: var(
992
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-se,
993
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se, var(--_ctm-dn-ld-me-bn-hr-se-ft-se))
994
+ );
995
+ --_sf-hr-ft-wt: var(
996
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-wt,
997
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-wt, var(--_ctm-dn-ld-me-bn-hr-se-ft-wt))
998
+ );
999
+ --_sf-hr-ft-se-ic: var(
1000
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-se-ic,
1001
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se-ic, var(--_ctm-dn-ld-me-bn-hr-se-ft-se-ic))
1002
+ );
1003
+ --_sf-hr-tt-an: var(
1004
+ --_ctm-mob-dn-ld-me-bn-hr-se-tt-an,
1005
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-an, var(--_ctm-dn-ld-me-bn-hr-se-tt-an))
1006
+ );
1007
+ --_sf-hr-lr-sg: var(
1008
+ --_ctm-mob-dn-ld-me-bn-hr-se-lr-sg,
1009
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-lr-sg, var(--_ctm-dn-ld-me-bn-hr-se-lr-sg))
1010
+ );
1011
+ --_sf-hr-le-ht: var(
1012
+ --_ctm-mob-dn-ld-me-bn-hr-se-le-ht,
1013
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-le-ht, var(--_ctm-dn-ld-me-bn-hr-se-le-ht))
1014
+ );
1015
+
1016
+ --_sf-hr-in-se: var(
1017
+ --_ctm-mob-dn-ld-me-bn-hr-se-in-se,
1018
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se))
1019
+ );
1020
+ --_sf-hr-in-se: var(
1021
+ --_ctm-mob-dn-ld-me-bn-hr-se-in-se,
1022
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se))
1023
+ );
1024
+ --_sf-hr-in-c1: var(
1025
+ --_ctm-mob-dn-ld-me-bn-hr-se-in-c1,
1026
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-in-c1, var(--_ctm-dn-ld-me-bn-hr-se-in-c1))
1027
+ );
1028
+ --_sf-hr-ue: var(
1029
+ --_ctm-mob-dn-ld-me-bn-hr-se-ue,
1030
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ue, var(--_ctm-dn-ld-me-bn-hr-se-ue))
1031
+ );
1032
+
1033
+ // for pading and width
1034
+ --_sf-hr-pg: var(
1035
+ --_ctm-mob-dn-ld-me-bn-hr-pg,
1036
+ var(--_ctm-tab-dn-ld-me-bn-hr-pg, var(--_ctm-dn-ld-me-bn-hr-pg))
1037
+ );
1038
+ --_sf-hr-wh: var(
1039
+ --_ctm-mob-dn-ld-me-bn-hr-wh,
1040
+ var(--_ctm-tab-dn-ld-me-bn-hr-wh, var(--_ctm-dn-ld-me-bn-hr-wh))
1041
+ );
1042
+
1043
+ &[data-hover-show-shadow="false"] {
1044
+ --_hover-show-shadow: none;
1045
+ }
1046
+ &[data-hover-show-icon="false"] {
1047
+ --_hover-show-icon: none;
1048
+ }
1049
+ }
1050
+ background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-bd-cr));
1051
+
1052
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-pg));
1053
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-wh));
1054
+ display: flex;
1055
+ flex-direction: var(--_sf-fd-bn);
1056
+ align-items: center;
1057
+
1058
+ justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-at));
1059
+ gap: var(--_sf-hr-gp, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-gp));
1060
+
1061
+ border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-rs));
1062
+
1063
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-ae))
1064
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-br))
1065
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-sd))
1066
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-cr));
1067
+
1068
+ &[data-show-border="true"] {
1069
+ border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-cr));
1070
+
1071
+ border-style: var(--_sf-hr-br-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-se));
1072
+
1073
+ border-width: var(--_sf-hr-br-wh, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-wh));
1074
+ }
1075
+
1076
+ .txt {
1077
+ display: flex;
1078
+
1079
+ color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-cr));
1080
+
1081
+ font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-fy));
1082
+
1083
+ font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-se));
1084
+
1085
+ font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-wt));
1086
+
1087
+ font-style: var(
1088
+ --_sf-hr-ft-se-ic,
1089
+ prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-se-ic)
1090
+ );
1091
+
1092
+ text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-tt-an));
1093
+
1094
+ letter-spacing: var(--_sf-hr-lr-sg, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-lr-sg));
1095
+
1096
+ line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-le-ht));
1097
+
1098
+ text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
1099
+ }
1100
+
1101
+ .icon {
1102
+ display: var(--_hover-show-icon, var(--_show-icon, flex));
1103
+ svg {
1104
+ width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-se));
1105
+ height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-se));
1106
+
1107
+ path {
1108
+ stroke: var(--_sf-hr-in-c1, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-c1));
1109
+ }
1110
+ }
1111
+ }
1112
+ [data-element-style="Text"] {
1113
+ display: inline-block;
1114
+ width: 100%;
1115
+ }
1116
+
1117
+ .icon--hover {
1118
+ // position: absolute;
1119
+ // inset: 0;
1120
+ // opacity: 0;
1121
+ display: none;
1122
+ transition: opacity 0.2s ease;
1123
+ }
1124
+
1125
+ &:hover .icon--hover {
1126
+ // opacity: 1;
1127
+ display: flex;
1128
+ }
1129
+
1130
+ &:hover .icon--default {
1131
+ // opacity: 0;
1132
+ display: none;
1133
+ }
1134
+ }
1136
1135
  }
1137
1136
 
1138
1137
  .slider_wrapper {