@sc-360-v2/storefront-cms-library 0.5.51 → 0.5.53
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/add-order.scss +62 -13
- package/dist/allocationDetails.scss +438 -224
- package/dist/allocations.scss +172 -13
- package/dist/breadcrumbs.scss +13 -0
- package/dist/builder.js +1 -1
- package/dist/cart-details.scss +214 -0
- package/dist/cart-summary.scss +237 -854
- package/dist/cart.scss +57 -55
- package/dist/category-groups-product-image.scss +72 -21
- package/dist/faq.scss +48 -5
- package/dist/hotspot.scss +141 -74
- package/dist/icon-library.scss +78 -74
- package/dist/icon-list.scss +19 -1
- package/dist/image-temp.scss +17 -3
- package/dist/language-selector.scss +260 -76
- package/dist/light-box-v2.scss +4 -3
- package/dist/menu-v2.scss +51 -3
- package/dist/modal.scss +251 -28
- package/dist/my-templates.scss +11 -2
- package/dist/my-wishlist.scss +27 -17
- package/dist/product-basic-elements.scss +0 -246
- package/dist/product-image-allocation.scss +51 -15
- package/dist/product-image-bundles.scss +72 -15
- package/dist/product-image.scss +178 -19
- package/dist/profile.scss +44 -19
- package/dist/quota-details.scss +111 -11
- package/dist/repeater-embla-controls.scss +9 -1
- package/dist/repeater-grid-toggle.scss +42 -18
- package/dist/repeater-item.scss +34 -22
- package/dist/repeater.scss +69 -102
- package/dist/request-for-quotes.scss +15 -1
- package/dist/scroll.scss +52 -11
- package/dist/search.scss +1 -1
- package/dist/skeleton.scss +24 -35
- package/dist/tab-container.scss +14 -12
- package/dist/tab-v2.scss +178 -68
- package/dist/text-temp-v2.scss +11 -0
- package/dist/types/builder/tools/element-edit/allocationDetails.d.ts +17 -1
- package/dist/types/builder/tools/element-edit/breadcrumbs.d.ts +0 -5
- package/dist/types/builder/tools/element-edit/iconLibrary.d.ts +7 -1
- package/dist/types/builder/tools/element-edit/imageHotspot.d.ts +0 -1
- package/dist/types/builder/tools/element-edit/language-menu.d.ts +0 -14
- package/dist/types/builder/tools/element-edit/product-image.d.ts +1 -0
- package/dist/types/builder/tools/element-edit/repeater.d.ts +1 -1
- package/dist/types/builder/tools/element-edit/tabsV2.d.ts +55 -1
- package/dist/types/builder/tools/element-edit/userElements.d.ts +5 -0
- package/dist/types/builder/tools/element-edit/video.d.ts +32 -0
- package/dist/user-elements.scss +6 -0
- package/dist/video.scss +548 -476
- package/package.json +1 -1
package/dist/my-templates.scss
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
@use "sass:map";
|
|
1
|
+
@use "sass:map";
|
|
2
2
|
@use "sass:list";
|
|
3
3
|
@import "./functions.scss";
|
|
4
4
|
$defaultValues: (
|
|
@@ -9,9 +9,18 @@ $defaultValues: (
|
|
|
9
9
|
|
|
10
10
|
[data-div-type="element"] {
|
|
11
11
|
&[data-element-type="myTemplates"] {
|
|
12
|
-
width: 100% !important
|
|
12
|
+
// Was `width: 100% !important`, which ignored the percentage the right resize
|
|
13
|
+
// handle writes and left the handle with nothing to drive.
|
|
14
|
+
width: var(
|
|
15
|
+
--_sf-el-wh-st-mx,
|
|
16
|
+
calc(
|
|
17
|
+
1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
|
|
18
|
+
)
|
|
19
|
+
);
|
|
13
20
|
|
|
14
21
|
& > .wrapper {
|
|
22
|
+
// Layout > Padding. The element declares it but nothing read it back.
|
|
23
|
+
padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
|
|
15
24
|
}
|
|
16
25
|
&[data-show-shadow="false"] {
|
|
17
26
|
--_show-shadow: none;
|
package/dist/my-wishlist.scss
CHANGED
|
@@ -1,17 +1,27 @@
|
|
|
1
|
-
@use "sass:map";
|
|
2
|
-
@use "sass:list";
|
|
3
|
-
|
|
4
|
-
[data-div-type="element"] {
|
|
5
|
-
&[data-element-type="myWishlist"] {
|
|
6
|
-
width: 100% !important
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
1
|
+
@use "sass:map";
|
|
2
|
+
@use "sass:list";
|
|
3
|
+
|
|
4
|
+
[data-div-type="element"] {
|
|
5
|
+
&[data-element-type="myWishlist"] {
|
|
6
|
+
// Was `width: 100% !important`, which ignored the percentage the right resize
|
|
7
|
+
// handle writes and left the handle with nothing to drive.
|
|
8
|
+
width: var(
|
|
9
|
+
--_sf-el-wh-st-mx,
|
|
10
|
+
calc(
|
|
11
|
+
1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
|
|
12
|
+
)
|
|
13
|
+
);
|
|
14
|
+
|
|
15
|
+
& > .wrapper {
|
|
16
|
+
// Layout > Padding. The element declares it but nothing read it back.
|
|
17
|
+
padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
|
|
18
|
+
|
|
19
|
+
.template_wrapper {
|
|
20
|
+
width: 100%;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
&[data-show-shadow="false"] {
|
|
24
|
+
--_show-shadow: none;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
}
|
|
@@ -589,250 +589,4 @@ $overflowSelector: ".flex__overflow";
|
|
|
589
589
|
}
|
|
590
590
|
}
|
|
591
591
|
}
|
|
592
|
-
&[data-element-type="productReview"] {
|
|
593
|
-
// width: var(--_lt-wh);
|
|
594
|
-
// height: var(--_lt-ht);
|
|
595
|
-
// margin: var(--_lt-mn);
|
|
596
|
-
// padding: var(--_lt-pg);
|
|
597
|
-
// width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
|
|
598
|
-
// width: var(--_sf-nw-wh, var(--_tst-lt-wh));
|
|
599
|
-
width: var(
|
|
600
|
-
--_sf-el-wh-st-mx,
|
|
601
|
-
calc(
|
|
602
|
-
1% *
|
|
603
|
-
var(
|
|
604
|
-
--_ctm-mob-ele-nw-wh-vl,
|
|
605
|
-
var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh)))
|
|
606
|
-
)
|
|
607
|
-
)
|
|
608
|
-
);
|
|
609
|
-
margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn, var(--_tst-lt-mn))));
|
|
610
|
-
min-height: var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht)));
|
|
611
|
-
// height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
|
|
612
|
-
// height: ;
|
|
613
|
-
// aspect-ratio: 1 / var(--_sf-aspect-ratio);
|
|
614
|
-
// --_aspect-ratio: calc(
|
|
615
|
-
// 1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
|
|
616
|
-
// );
|
|
617
|
-
|
|
618
|
-
& > .wrapper {
|
|
619
|
-
width: 100%;
|
|
620
|
-
// Follow the elements own height so the styled box (background, border, shadow)
|
|
621
|
-
// matches the Height set in layout instead of only hugging the text.
|
|
622
|
-
min-height: inherit;
|
|
623
|
-
background-color: var(--_ctm-mob-dn-bd-cr, var(--_ctm-tab-dn-bd-cr, var(--_ctm-dn-bd-cr)));
|
|
624
|
-
padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
|
|
625
|
-
border-color: var(
|
|
626
|
-
--_show-border,
|
|
627
|
-
var(--_ctm-mob-dn-br-cr, var(--_ctm-tab-dn-br-cr, var(--_ctm-dn-br-cr)))
|
|
628
|
-
);
|
|
629
|
-
border-style: var(
|
|
630
|
-
--_show-border,
|
|
631
|
-
var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)))
|
|
632
|
-
);
|
|
633
|
-
border-width: var(
|
|
634
|
-
--_show-border,
|
|
635
|
-
var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)))
|
|
636
|
-
);
|
|
637
|
-
border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
|
|
638
|
-
box-shadow: var(
|
|
639
|
-
--_show-shadow,
|
|
640
|
-
var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
|
|
641
|
-
var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
|
|
642
|
-
var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
|
|
643
|
-
var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
|
|
644
|
-
);
|
|
645
|
-
// height: 100%;
|
|
646
|
-
}
|
|
647
|
-
&[data-show-shadow="false"] {
|
|
648
|
-
--_show-shadow: none;
|
|
649
|
-
}
|
|
650
|
-
&[data-show-border="false"] {
|
|
651
|
-
--_show-border: none;
|
|
652
|
-
}
|
|
653
|
-
// .text-element {
|
|
654
|
-
// background: #6d96e4;
|
|
655
|
-
// // padding: 10px;
|
|
656
|
-
// font-weight: 600;
|
|
657
|
-
// color: rgba(75, 69, 70, 1);
|
|
658
|
-
// }
|
|
659
|
-
.text-element {
|
|
660
|
-
// background-color: var(--_ctm-mob-dn-bd-cr, var(--_ctm-tab-dn-bd-cr, var(--_ctm-dn-bd-cr)));
|
|
661
|
-
// padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
|
|
662
|
-
display: flex;
|
|
663
|
-
flex-direction: column;
|
|
664
|
-
--_sf-gp: 16px;
|
|
665
|
-
--_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
|
|
666
|
-
row-gap: var(--_sf-gp);
|
|
667
|
-
width: 100%;
|
|
668
|
-
// height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
|
|
669
|
-
// border-color: var(
|
|
670
|
-
// --_show-border,
|
|
671
|
-
// var(--_ctm-mob-dn-br-cr, var(--_ctm-tab-dn-br-cr, var(--_ctm-dn-br-cr)))
|
|
672
|
-
// );
|
|
673
|
-
// border-style: var(
|
|
674
|
-
// --_show-border,
|
|
675
|
-
// var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)))
|
|
676
|
-
// );
|
|
677
|
-
// border-width: var(
|
|
678
|
-
// --_show-border,
|
|
679
|
-
// var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)))
|
|
680
|
-
// );
|
|
681
|
-
// border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
|
|
682
|
-
// box-shadow: var(
|
|
683
|
-
// --_show-shadow,
|
|
684
|
-
// var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
|
|
685
|
-
// var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
|
|
686
|
-
// var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
|
|
687
|
-
// var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
|
|
688
|
-
// );
|
|
689
|
-
color: var(--_ctm-mob-dn-cr, var(--_ctm-tab-dn-cr, var(--_ctm-dn-cr)));
|
|
690
|
-
font-family: var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy)));
|
|
691
|
-
font-size: var(--_ctm-mob-dn-ft-se, var(--_ctm-tab-dn-ft-se, var(--_ctm-dn-ft-se)));
|
|
692
|
-
font-weight: var(--_ctm-mob-dn-ft-wt, var(--_ctm-tab-dn-ft-wt, var(--_ctm-dn-ft-wt)));
|
|
693
|
-
font-style: var(--_ctm-mob-dn-ft-se-ic, var(--_ctm-tab-dn-ft-se-ic, var(--_ctm-dn-ft-se-ic)));
|
|
694
|
-
text-align: var(--_ctm-mob-dn-tt-an, var(--_ctm-tab-dn-tt-an, var(--_ctm-dn-tt-an)));
|
|
695
|
-
letter-spacing: var(--_ctm-mob-dn-lr-sg, var(--_ctm-tab-dn-lr-sg, var(--_ctm-dn-lr-sg)));
|
|
696
|
-
line-height: var(--_ctm-mob-dn-le-ht, var(--_ctm-tab-dn-le-ht, var(--_ctm-dn-le-ht)));
|
|
697
|
-
text-decoration: var(
|
|
698
|
-
--_sf-hr-tt-dn,
|
|
699
|
-
var(
|
|
700
|
-
--_ctm-mob-dn-dt-se-ue,
|
|
701
|
-
var(--_ctm-tab-dn-dt-se-ue, var(--_ctm-dn-dt-se-ue, var(--_ctm-dn-ue)))
|
|
702
|
-
)
|
|
703
|
-
);
|
|
704
|
-
scale: var(--_ctm-mob-dn-zm-ie, var(--_ctm-tab-dn-zm-ie, var(--_ctm-dn-zm-ie)));
|
|
705
|
-
&[data-flip-x="true"] {
|
|
706
|
-
transform: scaleX(-1);
|
|
707
|
-
}
|
|
708
|
-
&[data-flip-y="true"] {
|
|
709
|
-
transform: scaleY(-1);
|
|
710
|
-
}
|
|
711
|
-
}
|
|
712
|
-
text-transform: prepareMediaVariable(--_ctm-dn-tt-tm);
|
|
713
|
-
}
|
|
714
|
-
&[data-element-type="productRating"] {
|
|
715
|
-
// width: var(--_lt-wh);
|
|
716
|
-
// height: var(--_lt-ht);
|
|
717
|
-
// margin: var(--_lt-mn);
|
|
718
|
-
// padding: var(--_lt-pg);
|
|
719
|
-
// width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
|
|
720
|
-
// width: var(--_sf-nw-wh, var(--_tst-lt-wh));
|
|
721
|
-
width: var(
|
|
722
|
-
--_sf-el-wh-st-mx,
|
|
723
|
-
calc(
|
|
724
|
-
1% *
|
|
725
|
-
var(
|
|
726
|
-
--_ctm-mob-ele-nw-wh-vl,
|
|
727
|
-
var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh)))
|
|
728
|
-
)
|
|
729
|
-
)
|
|
730
|
-
);
|
|
731
|
-
margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn, var(--_tst-lt-mn))));
|
|
732
|
-
min-height: var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht)));
|
|
733
|
-
// height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
|
|
734
|
-
// height: ;
|
|
735
|
-
// aspect-ratio: 1 / var(--_sf-aspect-ratio);
|
|
736
|
-
// --_aspect-ratio: calc(
|
|
737
|
-
// 1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
|
|
738
|
-
// );
|
|
739
|
-
|
|
740
|
-
& > .wrapper {
|
|
741
|
-
width: 100%;
|
|
742
|
-
// Follow the elements own height so the styled box (background, border, shadow)
|
|
743
|
-
// matches the Height set in layout instead of only hugging the text.
|
|
744
|
-
min-height: inherit;
|
|
745
|
-
// height: 100%;
|
|
746
|
-
|
|
747
|
-
border-color: var(
|
|
748
|
-
--_show-border,
|
|
749
|
-
var(--_ctm-mob-dn-br-cr, var(--_ctm-tab-dn-br-cr, var(--_ctm-dn-br-cr)))
|
|
750
|
-
);
|
|
751
|
-
border-style: var(
|
|
752
|
-
--_show-border,
|
|
753
|
-
var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)))
|
|
754
|
-
);
|
|
755
|
-
border-width: var(
|
|
756
|
-
--_show-border,
|
|
757
|
-
var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)))
|
|
758
|
-
);
|
|
759
|
-
border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
|
|
760
|
-
box-shadow: var(
|
|
761
|
-
--_show-shadow,
|
|
762
|
-
var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
|
|
763
|
-
var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
|
|
764
|
-
var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
|
|
765
|
-
var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
|
|
766
|
-
);
|
|
767
|
-
|
|
768
|
-
background-color: var(--_ctm-mob-dn-bd-cr, var(--_ctm-tab-dn-bd-cr, var(--_ctm-dn-bd-cr)));
|
|
769
|
-
padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
|
|
770
|
-
}
|
|
771
|
-
&[data-show-shadow="false"] {
|
|
772
|
-
--_show-shadow: none;
|
|
773
|
-
}
|
|
774
|
-
&[data-show-border="false"] {
|
|
775
|
-
--_show-border: none;
|
|
776
|
-
}
|
|
777
|
-
// .text-element {
|
|
778
|
-
// background: #6d96e4;
|
|
779
|
-
// // padding: 10px;
|
|
780
|
-
// font-weight: 600;
|
|
781
|
-
// color: rgba(75, 69, 70, 1);
|
|
782
|
-
// }
|
|
783
|
-
.text-element {
|
|
784
|
-
// background-color: var(--_ctm-mob-dn-bd-cr, var(--_ctm-tab-dn-bd-cr, var(--_ctm-dn-bd-cr)));
|
|
785
|
-
// padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
|
|
786
|
-
display: flex;
|
|
787
|
-
flex-direction: column;
|
|
788
|
-
--_sf-gp: 16px;
|
|
789
|
-
--_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
|
|
790
|
-
row-gap: var(--_sf-gp);
|
|
791
|
-
width: 100%;
|
|
792
|
-
// height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
|
|
793
|
-
// border-color: var(
|
|
794
|
-
// --_show-border,
|
|
795
|
-
// var(--_ctm-mob-dn-br-cr, var(--_ctm-tab-dn-br-cr, var(--_ctm-dn-br-cr)))
|
|
796
|
-
// );
|
|
797
|
-
// border-style: var(
|
|
798
|
-
// --_show-border,
|
|
799
|
-
// var(--_ctm-mob-dn-br-se, var(--_ctm-tab-dn-br-se, var(--_ctm-dn-br-se)))
|
|
800
|
-
// );
|
|
801
|
-
// border-width: var(
|
|
802
|
-
// --_show-border,
|
|
803
|
-
// var(--_ctm-mob-dn-br-wh, var(--_ctm-tab-dn-br-wh, var(--_ctm-dn-br-wh)))
|
|
804
|
-
// );
|
|
805
|
-
// border-radius: var(--_ctm-mob-dn-br-rs, var(--_ctm-tab-dn-br-rs, var(--_ctm-dn-br-rs)));
|
|
806
|
-
// box-shadow: var(
|
|
807
|
-
// --_show-shadow,
|
|
808
|
-
// var(--_ctm-mob-dn-sw-ae, var(--_ctm-tab-dn-sw-ae, var(--_ctm-dn-sw-ae)))
|
|
809
|
-
// var(--_ctm-mob-dn-sw-br, var(--_ctm-tab-dn-sw-br, var(--_ctm-dn-sw-br)))
|
|
810
|
-
// var(--_ctm-mob-dn-sw-sd, var(--_ctm-tab-dn-sw-sd, var(--_ctm-dn-sw-sd)))
|
|
811
|
-
// var(--_ctm-mob-dn-sw-cr, var(--_ctm-tab-dn-sw-cr, var(--_ctm-dn-sw-cr)))
|
|
812
|
-
// );
|
|
813
|
-
color: var(--_ctm-mob-dn-cr, var(--_ctm-tab-dn-cr, var(--_ctm-dn-cr)));
|
|
814
|
-
font-family: var(--_ctm-mob-dn-ft-fy, var(--_ctm-tab-dn-ft-fy, var(--_ctm-dn-ft-fy)));
|
|
815
|
-
font-size: var(--_ctm-mob-dn-ft-se, var(--_ctm-tab-dn-ft-se, var(--_ctm-dn-ft-se)));
|
|
816
|
-
font-weight: var(--_ctm-mob-dn-ft-wt, var(--_ctm-tab-dn-ft-wt, var(--_ctm-dn-ft-wt)));
|
|
817
|
-
font-style: var(--_ctm-mob-dn-ft-se-ic, var(--_ctm-tab-dn-ft-se-ic, var(--_ctm-dn-ft-se-ic)));
|
|
818
|
-
text-align: var(--_ctm-mob-dn-tt-an, var(--_ctm-tab-dn-tt-an, var(--_ctm-dn-tt-an)));
|
|
819
|
-
letter-spacing: var(--_ctm-mob-dn-lr-sg, var(--_ctm-tab-dn-lr-sg, var(--_ctm-dn-lr-sg)));
|
|
820
|
-
line-height: var(--_ctm-mob-dn-le-ht, var(--_ctm-tab-dn-le-ht, var(--_ctm-dn-le-ht)));
|
|
821
|
-
text-decoration: var(
|
|
822
|
-
--_sf-hr-tt-dn,
|
|
823
|
-
var(
|
|
824
|
-
--_ctm-mob-dn-dt-se-ue,
|
|
825
|
-
var(--_ctm-tab-dn-dt-se-ue, var(--_ctm-dn-dt-se-ue, var(--_ctm-dn-ue)))
|
|
826
|
-
)
|
|
827
|
-
);
|
|
828
|
-
scale: var(--_ctm-mob-dn-zm-ie, var(--_ctm-tab-dn-zm-ie, var(--_ctm-dn-zm-ie)));
|
|
829
|
-
&[data-flip-x="true"] {
|
|
830
|
-
transform: scaleX(-1);
|
|
831
|
-
}
|
|
832
|
-
&[data-flip-y="true"] {
|
|
833
|
-
transform: scaleY(-1);
|
|
834
|
-
}
|
|
835
|
-
text-transform: prepareMediaVariable(--_ctm-dn-tt-tm);
|
|
836
|
-
}
|
|
837
|
-
}
|
|
838
592
|
}
|
|
@@ -4,9 +4,17 @@
|
|
|
4
4
|
width: var(--_ctm-mob-dn-ie-lt-wh, var(--_ctm-tab-dn-ie-lt-wh, var(--_ctm-dn-ie-lt-wh)));
|
|
5
5
|
// height: var(--_ctm-mob-dn-ie-lt-ht, var(--_ctm-tab-dn-ie-lt-ht, var(--_ctm-dn-ie-lt-ht)));
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
// Content-sized display styles — the element grows with the number of images.
|
|
8
|
+
// See product-image.scss for the full reasoning.
|
|
9
|
+
$contentSizedGallery: '.embla[data-scroll-control="Non"]:is([data-display-style="Grid"][data-scroll-direction="Vertical"], [data-display-style="Rows"], [data-display-style="Masonry"])';
|
|
10
|
+
|
|
11
|
+
&:not(:has(#{$contentSizedGallery})) {
|
|
8
12
|
height: var(--_ctm-mob-dn-ie-lt-ht, var(--_ctm-tab-dn-ie-lt-ht, var(--_ctm-dn-ie-lt-ht)));
|
|
9
13
|
}
|
|
14
|
+
|
|
15
|
+
&:has(#{$contentSizedGallery}) {
|
|
16
|
+
min-height: var(--_ctm-mob-dn-ie-lt-ht, var(--_ctm-tab-dn-ie-lt-ht, var(--_ctm-dn-ie-lt-ht)));
|
|
17
|
+
}
|
|
10
18
|
&[data-has-link="true"] {
|
|
11
19
|
cursor: pointer;
|
|
12
20
|
}
|
|
@@ -169,19 +177,39 @@
|
|
|
169
177
|
|
|
170
178
|
width: 100%;
|
|
171
179
|
height: 100%;
|
|
180
|
+
|
|
181
|
+
// Gallery Widget Style > Border / Shadow toggles. Distinct names from the item
|
|
182
|
+
// ones below, because .gallery__slide is a descendant and would otherwise
|
|
183
|
+
// inherit whatever is set here.
|
|
184
|
+
&[data-show-border="false"] {
|
|
185
|
+
--_show-gy-border: none;
|
|
186
|
+
}
|
|
187
|
+
&[data-show-shadow="false"] {
|
|
188
|
+
--_show-gy-shadow: none;
|
|
189
|
+
}
|
|
190
|
+
|
|
172
191
|
border-color: var(
|
|
173
|
-
--
|
|
174
|
-
var(
|
|
192
|
+
--_show-gy-border,
|
|
193
|
+
var(
|
|
194
|
+
--_ctm-mob-dn-ie-gy-wt-se-br-cr,
|
|
195
|
+
var(--_ctm-tab-dn-ie-gy-wt-se-br-cr, var(--_ctm-dn-ie-gy-wt-se-br-cr))
|
|
196
|
+
)
|
|
175
197
|
);
|
|
176
198
|
|
|
177
199
|
border-style: var(
|
|
178
|
-
--
|
|
179
|
-
var(
|
|
200
|
+
--_show-gy-border,
|
|
201
|
+
var(
|
|
202
|
+
--_ctm-mob-dn-ie-gy-wt-se-br-se,
|
|
203
|
+
var(--_ctm-tab-dn-ie-gy-wt-se-br-se, var(--_ctm-dn-ie-gy-wt-se-br-se))
|
|
204
|
+
)
|
|
180
205
|
);
|
|
181
206
|
|
|
182
207
|
border-width: var(
|
|
183
|
-
--
|
|
184
|
-
var(
|
|
208
|
+
--_show-gy-border,
|
|
209
|
+
var(
|
|
210
|
+
--_ctm-mob-dn-ie-gy-wt-se-br-wh,
|
|
211
|
+
var(--_ctm-tab-dn-ie-gy-wt-se-br-wh, var(--_ctm-dn-ie-gy-wt-se-br-wh))
|
|
212
|
+
)
|
|
185
213
|
);
|
|
186
214
|
|
|
187
215
|
border-radius: var(
|
|
@@ -190,7 +218,7 @@
|
|
|
190
218
|
);
|
|
191
219
|
|
|
192
220
|
box-shadow: var(
|
|
193
|
-
--_show-shadow,
|
|
221
|
+
--_show-gy-shadow,
|
|
194
222
|
var(
|
|
195
223
|
--_ctm-mob-dn-ie-gy-wt-se-sw-ae,
|
|
196
224
|
var(--_ctm-tab-dn-ie-gy-wt-se-sw-ae, var(--_ctm-dn-ie-gy-wt-se-sw-ae))
|
|
@@ -879,17 +907,25 @@
|
|
|
879
907
|
--_ctm-mob-dn-ie-im-se-bd-cr,
|
|
880
908
|
var(--_ctm-tab-dn-ie-im-se-bd-cr, var(--_ctm-dn-ie-im-se-bd-cr))
|
|
881
909
|
);
|
|
910
|
+
// Item Style > Border / Shadow toggles.
|
|
911
|
+
&[data-show-border="false"] {
|
|
912
|
+
--_show-im-border: none;
|
|
913
|
+
}
|
|
914
|
+
&[data-show-shadow="false"] {
|
|
915
|
+
--_show-im-shadow: none;
|
|
916
|
+
}
|
|
917
|
+
|
|
882
918
|
border-color: var(
|
|
883
|
-
--
|
|
884
|
-
var(--_ctm-tab-dn-ie-im-se-br-cr, var(--_ctm-dn-ie-im-se-br-cr))
|
|
919
|
+
--_show-im-border,
|
|
920
|
+
var(--_ctm-mob-dn-ie-im-se-br-cr, var(--_ctm-tab-dn-ie-im-se-br-cr, var(--_ctm-dn-ie-im-se-br-cr)))
|
|
885
921
|
);
|
|
886
922
|
border-style: var(
|
|
887
|
-
--
|
|
888
|
-
var(--_ctm-tab-dn-ie-im-se-br-se, var(--_ctm-dn-ie-im-se-br-se))
|
|
923
|
+
--_show-im-border,
|
|
924
|
+
var(--_ctm-mob-dn-ie-im-se-br-se, var(--_ctm-tab-dn-ie-im-se-br-se, var(--_ctm-dn-ie-im-se-br-se)))
|
|
889
925
|
);
|
|
890
926
|
border-width: var(
|
|
891
|
-
--
|
|
892
|
-
var(--_ctm-tab-dn-ie-im-se-br-wh, var(--_ctm-dn-ie-im-se-br-wh))
|
|
927
|
+
--_show-im-border,
|
|
928
|
+
var(--_ctm-mob-dn-ie-im-se-br-wh, var(--_ctm-tab-dn-ie-im-se-br-wh, var(--_ctm-dn-ie-im-se-br-wh)))
|
|
893
929
|
);
|
|
894
930
|
border-radius: var(
|
|
895
931
|
--_ctm-mob-dn-ie-im-se-br-rs,
|
|
@@ -897,7 +933,7 @@
|
|
|
897
933
|
);
|
|
898
934
|
|
|
899
935
|
box-shadow: var(
|
|
900
|
-
--_show-shadow,
|
|
936
|
+
--_show-im-shadow,
|
|
901
937
|
var(
|
|
902
938
|
--_ctm-mob-dn-ie-im-se-sw-ae,
|
|
903
939
|
var(--_ctm-tab-dn-ie-im-se-sw-ae, var(--_ctm-dn-ie-im-se-sw-ae))
|
|
@@ -9,13 +9,24 @@
|
|
|
9
9
|
);
|
|
10
10
|
// height: var(--_ctm-mob-dn-pt-pl-dn-pt-ie-lt-ht, var(--_ctm-tab-dn-pt-pl-dn-pt-ie-lt-ht, var(--_ctm-dn-pt-pl-dn-pt-ie-lt-ht)));
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
// Content-sized display styles — the element grows with the number of images.
|
|
13
|
+
// See product-image.scss for the full reasoning.
|
|
14
|
+
$contentSizedGallery: '.embla[data-scroll-control="Non"]:is([data-display-style="Grid"][data-scroll-direction="Vertical"], [data-display-style="Rows"], [data-display-style="Masonry"])';
|
|
15
|
+
|
|
16
|
+
&:not(:has(#{$contentSizedGallery})) {
|
|
13
17
|
height: var(
|
|
14
18
|
--_ctm-mob-dn-pt-pl-dn-pt-ie-lt-ht,
|
|
15
19
|
var(--_ctm-tab-dn-pt-pl-dn-pt-ie-lt-ht, var(--_ctm-dn-pt-pl-dn-pt-ie-lt-ht))
|
|
16
20
|
);
|
|
17
21
|
}
|
|
18
22
|
|
|
23
|
+
&:has(#{$contentSizedGallery}) {
|
|
24
|
+
min-height: var(
|
|
25
|
+
--_ctm-mob-dn-pt-pl-dn-pt-ie-lt-ht,
|
|
26
|
+
var(--_ctm-tab-dn-pt-pl-dn-pt-ie-lt-ht, var(--_ctm-dn-pt-pl-dn-pt-ie-lt-ht))
|
|
27
|
+
);
|
|
28
|
+
}
|
|
29
|
+
|
|
19
30
|
// &[data-view-state="full"] {
|
|
20
31
|
// width: auto;
|
|
21
32
|
// // height: 100%;
|
|
@@ -180,19 +191,48 @@
|
|
|
180
191
|
|
|
181
192
|
width: 100%;
|
|
182
193
|
height: 100%;
|
|
194
|
+
|
|
195
|
+
// Gallery Widget Style > Border / Shadow toggles. Distinct names from the item
|
|
196
|
+
// ones below, because .gallery__slide is a descendant and would otherwise
|
|
197
|
+
// inherit whatever is set here.
|
|
198
|
+
&[data-show-border="false"] {
|
|
199
|
+
--_show-gy-border: none;
|
|
200
|
+
}
|
|
201
|
+
&[data-show-shadow="false"] {
|
|
202
|
+
--_show-gy-shadow: none;
|
|
203
|
+
}
|
|
204
|
+
|
|
183
205
|
border-color: var(
|
|
184
|
-
--
|
|
185
|
-
var(
|
|
206
|
+
--_show-gy-border,
|
|
207
|
+
var(
|
|
208
|
+
--_ctm-mob-dn-pt-pl-dn-pt-ie-gy-wt-se-br-cr,
|
|
209
|
+
var(
|
|
210
|
+
--_ctm-tab-dn-pt-pl-dn-pt-ie-gy-wt-se-br-cr,
|
|
211
|
+
var(--_ctm-dn-pt-pl-dn-pt-ie-gy-wt-se-br-cr)
|
|
212
|
+
)
|
|
213
|
+
)
|
|
186
214
|
);
|
|
187
215
|
|
|
188
216
|
border-style: var(
|
|
189
|
-
--
|
|
190
|
-
var(
|
|
217
|
+
--_show-gy-border,
|
|
218
|
+
var(
|
|
219
|
+
--_ctm-mob-dn-pt-pl-dn-pt-ie-gy-wt-se-br-se,
|
|
220
|
+
var(
|
|
221
|
+
--_ctm-tab-dn-pt-pl-dn-pt-ie-gy-wt-se-br-se,
|
|
222
|
+
var(--_ctm-dn-pt-pl-dn-pt-ie-gy-wt-se-br-se)
|
|
223
|
+
)
|
|
224
|
+
)
|
|
191
225
|
);
|
|
192
226
|
|
|
193
227
|
border-width: var(
|
|
194
|
-
--
|
|
195
|
-
var(
|
|
228
|
+
--_show-gy-border,
|
|
229
|
+
var(
|
|
230
|
+
--_ctm-mob-dn-pt-pl-dn-pt-ie-gy-wt-se-br-wh,
|
|
231
|
+
var(
|
|
232
|
+
--_ctm-tab-dn-pt-pl-dn-pt-ie-gy-wt-se-br-wh,
|
|
233
|
+
var(--_ctm-dn-pt-pl-dn-pt-ie-gy-wt-se-br-wh)
|
|
234
|
+
)
|
|
235
|
+
)
|
|
196
236
|
);
|
|
197
237
|
|
|
198
238
|
border-radius: var(
|
|
@@ -201,7 +241,7 @@
|
|
|
201
241
|
);
|
|
202
242
|
|
|
203
243
|
box-shadow: var(
|
|
204
|
-
--_show-shadow,
|
|
244
|
+
--_show-gy-shadow,
|
|
205
245
|
var(
|
|
206
246
|
--_ctm-mob-dn-pt-pl-dn-pt-ie-gy-wt-se-sw-ae,
|
|
207
247
|
var(
|
|
@@ -972,17 +1012,34 @@
|
|
|
972
1012
|
--_ctm-mob-dn-pt-pl-dn-pt-ie-im-se-bd-cr,
|
|
973
1013
|
var(--_ctm-tab-dn-pt-pl-dn-pt-ie-im-se-bd-cr, var(--_ctm-dn-pt-pl-dn-pt-ie-im-se-bd-cr))
|
|
974
1014
|
);
|
|
1015
|
+
// Item Style > Border / Shadow toggles.
|
|
1016
|
+
&[data-show-border="false"] {
|
|
1017
|
+
--_show-im-border: none;
|
|
1018
|
+
}
|
|
1019
|
+
&[data-show-shadow="false"] {
|
|
1020
|
+
--_show-im-shadow: none;
|
|
1021
|
+
}
|
|
1022
|
+
|
|
975
1023
|
border-color: var(
|
|
976
|
-
--
|
|
977
|
-
var(
|
|
1024
|
+
--_show-im-border,
|
|
1025
|
+
var(
|
|
1026
|
+
--_ctm-mob-dn-pt-pl-dn-pt-ie-im-se-br-cr,
|
|
1027
|
+
var(--_ctm-tab-dn-pt-pl-dn-pt-ie-im-se-br-cr, var(--_ctm-dn-pt-pl-dn-pt-ie-im-se-br-cr))
|
|
1028
|
+
)
|
|
978
1029
|
);
|
|
979
1030
|
border-style: var(
|
|
980
|
-
--
|
|
981
|
-
var(
|
|
1031
|
+
--_show-im-border,
|
|
1032
|
+
var(
|
|
1033
|
+
--_ctm-mob-dn-pt-pl-dn-pt-ie-im-se-br-se,
|
|
1034
|
+
var(--_ctm-tab-dn-pt-pl-dn-pt-ie-im-se-br-se, var(--_ctm-dn-pt-pl-dn-pt-ie-im-se-br-se))
|
|
1035
|
+
)
|
|
982
1036
|
);
|
|
983
1037
|
border-width: var(
|
|
984
|
-
--
|
|
985
|
-
var(
|
|
1038
|
+
--_show-im-border,
|
|
1039
|
+
var(
|
|
1040
|
+
--_ctm-mob-dn-pt-pl-dn-pt-ie-im-se-br-wh,
|
|
1041
|
+
var(--_ctm-tab-dn-pt-pl-dn-pt-ie-im-se-br-wh, var(--_ctm-dn-pt-pl-dn-pt-ie-im-se-br-wh))
|
|
1042
|
+
)
|
|
986
1043
|
);
|
|
987
1044
|
border-radius: var(
|
|
988
1045
|
--_ctm-mob-dn-pt-pl-dn-pt-ie-im-se-br-rs,
|
|
@@ -990,7 +1047,7 @@
|
|
|
990
1047
|
);
|
|
991
1048
|
|
|
992
1049
|
box-shadow: var(
|
|
993
|
-
--_show-shadow,
|
|
1050
|
+
--_show-im-shadow,
|
|
994
1051
|
var(
|
|
995
1052
|
--_ctm-mob-dn-pt-pl-dn-pt-ie-im-se-sw-ae,
|
|
996
1053
|
var(--_ctm-tab-dn-pt-pl-dn-pt-ie-im-se-sw-ae, var(--_ctm-dn-pt-pl-dn-pt-ie-im-se-sw-ae))
|