@trafilea/afrodita-components 6.36.7 → 6.36.8
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/build/index.esm.js +18 -5
- package/build/index.esm.js.map +1 -1
- package/build/index.js +18 -5
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -20925,13 +20925,21 @@ var afterChangeSlide = function (_a) {
|
|
|
20925
20925
|
var TopTagContainer$1 = newStyled.div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n position: absolute;\n border-top-left-radius: 8px;\n border-end-end-radius: 16px;\n overflow: hidden;\n left: ", ";\n top: ", ";\n"], ["\n position: absolute;\n border-top-left-radius: 8px;\n border-end-end-radius: 16px;\n overflow: hidden;\n left: ", ";\n top: ", ";\n"])), function (props) { return (props.borderRadiusVariant ? '13px' : '0'); }, function (props) { return (props.borderRadiusVariant ? '11px' : '0'); });
|
|
20926
20926
|
var TopRightTagContainer = newStyled.div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n position: absolute;\n border-top-right-radius: 8px;\n border-end-start-radius: 8px;\n overflow: hidden;\n right: 0;\n top: 0;\n"], ["\n position: absolute;\n border-top-right-radius: 8px;\n border-end-start-radius: 8px;\n overflow: hidden;\n right: 0;\n top: 0;\n"])));
|
|
20927
20927
|
var BottomTagContainer$1 = newStyled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"], ["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"])));
|
|
20928
|
-
var Container$8 = newStyled.div(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n ", "\n position: relative;\n max-height: 524px;\n overflow: hidden;\n\n video {\n width: none;\n }\n
|
|
20928
|
+
var Container$8 = newStyled.div(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n ", "\n\n ", "\n border: 1px solid red;\n position: relative;\n max-height: 524px;\n overflow: hidden;\n\n video {\n width: none;\n }\n\n & .slick-dots li.slick-active button:before {\n background-color: ", ";\n }\n\n .slick-slider {\n height: 100%;\n min-height: calc(414px + 50px);\n }\n\n .slick-active > div {\n position: absolute;\n }\n .slick-slide:nth-last-of-type(2):not(:last-of-type) > div {\n position: absolute;\n }\n\n .slider-mobile-gallery {\n zoom: 0.8;\n border-radius: 8px;\n overflow: hidden;\n }\n\n .slick-slide:not(.slick-current) .banner-concealable {\n display: none;\n }\n\n .slick-slide {\n position: relative;\n }\n\n .slick-arrow {\n cursor: pointer;\n display: none !important;\n position: absolute;\n top: 45%;\n z-index: 1;\n }\n\n .slick-arrow::before {\n content: '' !important;\n }\n\n @media only screen and (max-width: 480px) {\n .slick-arrow {\n display: block !important;\n }\n }\n\n .slick-arrow.slick-disabled {\n display: none !important;\n }\n\n .slick-prev {\n left: 0;\n }\n\n .slick-next {\n right: 0;\n }\n\n .slick-dots {\n list-style: none;\n margin: 0;\n padding: 0;\n position: absolute;\n text-align: center;\n width: 100%;\n\n ", "\n }\n\n .slick-dots li {\n position: relative;\n display: inline-block;\n height: 20px;\n width: 20px;\n margin: 0;\n padding: 0;\n cursor: pointer;\n }\n\n .slick-dots li:before {\n background-color: var(--truekind-default-secondary);\n }\n .slick-dots li.slick-active {\n display: inline-block !important;\n }\n\n .slick-dots li:nth-child(n + 10) {\n display: none;\n }\n\n .slick-dots li button {\n background: transparent;\n border: 0;\n color: transparent;\n cursor: pointer;\n display: block;\n height: 20px;\n line-height: 0;\n outline: none;\n padding: 5px;\n width: 20px;\n }\n\n .slick-dots li button:focus:before,\n .slick-dots li button:hover:before {\n opacity: 0.5;\n }\n\n .slick-dots li button:before {\n background-color: var(--truekind-default-secondary, #292929);\n border-radius: 20px;\n content: ' ';\n display: block;\n height: 12px;\n left: 0;\n margin: 5px;\n position: absolute;\n top: 0;\n width: 12px;\n opacity: 1;\n }\n\n .slick-dots li.slick-active button:before {\n background-color: var(--colors-pallete-primary-color, #cc4125) !important;\n opacity: 1;\n width: 12px;\n height: 12px;\n top: 0;\n }\n\n .slick-dots li:not(.slick-active) button:before {\n border: none;\n }\n\n @media only screen and (max-width: 768px) {\n div[data-testid='product-gallery-mobile-v1'] .slick-list > .slick-track {\n height: auto;\n }\n\n div[data-testid='product-gallery-mobile-v1'] .zoomWrapper.iiz > div {\n height: auto;\n }\n }\n"], ["\n ", "\n\n ", "\n border: 1px solid red;\n position: relative;\n max-height: 524px;\n overflow: hidden;\n\n video {\n width: none;\n }\n\n & .slick-dots li.slick-active button:before {\n background-color: ", ";\n }\n\n .slick-slider {\n height: 100%;\n min-height: calc(414px + 50px);\n }\n\n .slick-active > div {\n position: absolute;\n }\n .slick-slide:nth-last-of-type(2):not(:last-of-type) > div {\n position: absolute;\n }\n\n .slider-mobile-gallery {\n zoom: 0.8;\n border-radius: 8px;\n overflow: hidden;\n }\n\n .slick-slide:not(.slick-current) .banner-concealable {\n display: none;\n }\n\n .slick-slide {\n position: relative;\n }\n\n .slick-arrow {\n cursor: pointer;\n display: none !important;\n position: absolute;\n top: 45%;\n z-index: 1;\n }\n\n .slick-arrow::before {\n content: '' !important;\n }\n\n @media only screen and (max-width: 480px) {\n .slick-arrow {\n display: block !important;\n }\n }\n\n .slick-arrow.slick-disabled {\n display: none !important;\n }\n\n .slick-prev {\n left: 0;\n }\n\n .slick-next {\n right: 0;\n }\n\n .slick-dots {\n list-style: none;\n margin: 0;\n padding: 0;\n position: absolute;\n text-align: center;\n width: 100%;\n\n ", "\n }\n\n .slick-dots li {\n position: relative;\n display: inline-block;\n height: 20px;\n width: 20px;\n margin: 0;\n padding: 0;\n cursor: pointer;\n }\n\n .slick-dots li:before {\n background-color: var(--truekind-default-secondary);\n }\n .slick-dots li.slick-active {\n display: inline-block !important;\n }\n\n .slick-dots li:nth-child(n + 10) {\n display: none;\n }\n\n .slick-dots li button {\n background: transparent;\n border: 0;\n color: transparent;\n cursor: pointer;\n display: block;\n height: 20px;\n line-height: 0;\n outline: none;\n padding: 5px;\n width: 20px;\n }\n\n .slick-dots li button:focus:before,\n .slick-dots li button:hover:before {\n opacity: 0.5;\n }\n\n .slick-dots li button:before {\n background-color: var(--truekind-default-secondary, #292929);\n border-radius: 20px;\n content: ' ';\n display: block;\n height: 12px;\n left: 0;\n margin: 5px;\n position: absolute;\n top: 0;\n width: 12px;\n opacity: 1;\n }\n\n .slick-dots li.slick-active button:before {\n background-color: var(--colors-pallete-primary-color, #cc4125) !important;\n opacity: 1;\n width: 12px;\n height: 12px;\n top: 0;\n }\n\n .slick-dots li:not(.slick-active) button:before {\n border: none;\n }\n\n @media only screen and (max-width: 768px) {\n div[data-testid='product-gallery-mobile-v1'] .slick-list > .slick-track {\n height: auto;\n }\n\n div[data-testid='product-gallery-mobile-v1'] .zoomWrapper.iiz > div {\n height: auto;\n }\n }\n"])), function (_a) {
|
|
20929
20929
|
var borderRadiusVariant = _a.borderRadiusVariant;
|
|
20930
20930
|
return borderRadiusVariant &&
|
|
20931
20931
|
"\n border-radius: 40px;\n ";
|
|
20932
|
+
}, function (_a) {
|
|
20933
|
+
var first = _a.first;
|
|
20934
|
+
return first &&
|
|
20935
|
+
"\n padding-left: 15px;\n ";
|
|
20932
20936
|
}, function (_a) {
|
|
20933
20937
|
var theme = _a.theme;
|
|
20934
20938
|
return theme.component.slideNavigation.slideDots.selectedDotColor;
|
|
20939
|
+
}, function (_a) {
|
|
20940
|
+
var first = _a.first;
|
|
20941
|
+
return first &&
|
|
20942
|
+
"\n margin-left: -7px;\n ";
|
|
20935
20943
|
});
|
|
20936
20944
|
var templateObject_1$8, templateObject_2$7, templateObject_3$5, templateObject_4$4;
|
|
20937
20945
|
|
|
@@ -20966,7 +20974,8 @@ var ContentGallery = function (_a) {
|
|
|
20966
20974
|
return 1.1;
|
|
20967
20975
|
}
|
|
20968
20976
|
var paddingWidth = 0;
|
|
20969
|
-
var
|
|
20977
|
+
var paddingFirstSlide = selectedImageIndex === 0 ? 15 : 0;
|
|
20978
|
+
var width = containerRef.current.offsetWidth - paddingFirstSlide;
|
|
20970
20979
|
var cssZoom = 0.8;
|
|
20971
20980
|
var cssGap = 8;
|
|
20972
20981
|
var photoSize = 375.41 * cssZoom;
|
|
@@ -20975,7 +20984,7 @@ var ContentGallery = function (_a) {
|
|
|
20975
20984
|
return ((width + width * 0.0001 * (width > 380 ? 10 : -10) - paddingWidth - totalGap) / photoSize);
|
|
20976
20985
|
}
|
|
20977
20986
|
var slidesToShow = (_b = calcSlidesToShow()) !== null && _b !== void 0 ? _b : 1;
|
|
20978
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [customClick && (jsxRuntime.jsx("div", __assign$1({ style: { display: 'flex', marginBottom: '20px', gap: '10px' }, "data-testid": "mobile-gallery-content-gallery-custom-click" }, { children: contents.map(function (content, i) { return (jsxRuntime.jsx(ButtonPrimary, { onClick: function () { return onButtonClick(i); }, text: String(i + 1), inline: true }, content.key)); }) }), void 0)), jsxRuntime.jsx(Container$8, __assign$1({ "data-testid": testId, borderRadiusVariant: borderRadiusVariant, ref: sliderWrapper }, { children: jsxRuntime.jsx(Slider$1, __assign$1({ afterChange: function (e) {
|
|
20987
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [customClick && (jsxRuntime.jsx("div", __assign$1({ style: { display: 'flex', marginBottom: '20px', gap: '10px' }, "data-testid": "mobile-gallery-content-gallery-custom-click" }, { children: contents.map(function (content, i) { return (jsxRuntime.jsx(ButtonPrimary, { onClick: function () { return onButtonClick(i); }, text: String(i + 1), inline: true }, content.key)); }) }), void 0)), jsxRuntime.jsx(Container$8, __assign$1({ "data-testid": testId, borderRadiusVariant: borderRadiusVariant, first: selectedImageIndex === 0, ref: sliderWrapper }, { children: jsxRuntime.jsx(Slider$1, __assign$1({ afterChange: function (e) {
|
|
20979
20988
|
return afterChangeSlide({
|
|
20980
20989
|
slide: e,
|
|
20981
20990
|
contents: contents,
|
|
@@ -21148,7 +21157,7 @@ var SubContainer = newStyled.div({
|
|
|
21148
21157
|
'@media screen and (max-height: 640px)': {
|
|
21149
21158
|
position: 'relative',
|
|
21150
21159
|
},
|
|
21151
|
-
'@media screen and (
|
|
21160
|
+
'@media screen and (min-height: 740px)': {
|
|
21152
21161
|
marginTop: '0px',
|
|
21153
21162
|
},
|
|
21154
21163
|
'@media screen and (min-width: 380px) and (max-width: 400px) and (max-height: 860px) ': {
|
|
@@ -21161,10 +21170,14 @@ var Header$1 = newStyled.div({
|
|
|
21161
21170
|
justifyContent: 'end',
|
|
21162
21171
|
alignItems: 'center',
|
|
21163
21172
|
color: 'white',
|
|
21164
|
-
padding: '1.2rem',
|
|
21173
|
+
padding: '50px 1.2rem 1.2rem 1.2rem',
|
|
21174
|
+
position: 'absolute',
|
|
21165
21175
|
zIndex: 4,
|
|
21166
21176
|
top: 0,
|
|
21167
21177
|
right: 0,
|
|
21178
|
+
'@media screen and (max-height: 740px)': {
|
|
21179
|
+
paddingTop: '1.2rem'
|
|
21180
|
+
}
|
|
21168
21181
|
});
|
|
21169
21182
|
var IconContainer = newStyled.div({
|
|
21170
21183
|
backgroundColor: '#E5E5E5',
|