@trafilea/afrodita-components 6.37.2 → 6.37.4
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.d.ts +6 -1
- package/build/index.esm.js +17 -16
- package/build/index.esm.js.map +1 -1
- package/build/index.js +17 -16
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.d.ts
CHANGED
|
@@ -2579,6 +2579,8 @@ interface imageVideoProps {
|
|
|
2579
2579
|
isMobile?: boolean;
|
|
2580
2580
|
}
|
|
2581
2581
|
|
|
2582
|
+
/** @jsxImportSource @emotion/react */
|
|
2583
|
+
|
|
2582
2584
|
interface ColorPickerWithTooltipProps {
|
|
2583
2585
|
options: ColorPickerOption[];
|
|
2584
2586
|
maxVisibleOptions?: number;
|
|
@@ -2588,8 +2590,11 @@ interface ColorPickerWithTooltipProps {
|
|
|
2588
2590
|
inline?: boolean;
|
|
2589
2591
|
showCross?: boolean;
|
|
2590
2592
|
className?: string;
|
|
2593
|
+
tooltipOptions?: {
|
|
2594
|
+
showCloseIcon?: boolean;
|
|
2595
|
+
};
|
|
2591
2596
|
}
|
|
2592
|
-
declare const ColorPickerWithTooltip:
|
|
2597
|
+
declare const ColorPickerWithTooltip: FC<ColorPickerWithTooltipProps>;
|
|
2593
2598
|
|
|
2594
2599
|
interface MultiColorPickerProps {
|
|
2595
2600
|
options?: ColorPickerOption[];
|
package/build/index.esm.js
CHANGED
|
@@ -3203,7 +3203,7 @@ var Container$1p = newStyled.div(templateObject_1$2j || (templateObject_1$2j = _
|
|
|
3203
3203
|
var size = _a.size;
|
|
3204
3204
|
return (_b = getStylesBySize$g(size)) === null || _b === void 0 ? void 0 : _b.height;
|
|
3205
3205
|
});
|
|
3206
|
-
var H3$
|
|
3206
|
+
var H3$2 = newStyled.h3(templateObject_2$1F || (templateObject_2$1F = __makeTemplateObject(["\n color: ", ";\n font-weight: bold;\n margin: 0;\n font-size: ", ";\n line-height: ", ";\n"], ["\n color: ", ";\n font-weight: bold;\n margin: 0;\n font-size: ", ";\n line-height: ", ";\n"])), function (_a) {
|
|
3207
3207
|
var textColor = _a.textColor;
|
|
3208
3208
|
return textColor;
|
|
3209
3209
|
}, function (_a) {
|
|
@@ -3218,7 +3218,7 @@ var H3$3 = newStyled.h3(templateObject_2$1F || (templateObject_2$1F = __makeTemp
|
|
|
3218
3218
|
var ClubOfferTag = function (_a) {
|
|
3219
3219
|
var clubOfferText = _a.clubOfferText, className = _a.className, disabled = _a.disabled, _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#882A2B' : _b, _c = _a.borderColor, borderColor = _c === void 0 ? 'transparent' : _c, _d = _a.textColor, textColor = _d === void 0 ? '#fff' : _d, _e = _a.size, size = _e === void 0 ? ComponentSize.Medium : _e, style = _a.style;
|
|
3220
3220
|
var theme = useTheme();
|
|
3221
|
-
return (jsx$1(Container$1p, __assign$1({ backgroundColor: disabled ? theme.colors.shades['50'].color : backgroundColor, borderColor: disabled ? theme.colors.shades['50'].color : borderColor, size: size, "data-testid": "cluboffer-container", style: style, className: className }, { children: jsx$1(H3$
|
|
3221
|
+
return (jsx$1(Container$1p, __assign$1({ backgroundColor: disabled ? theme.colors.shades['50'].color : backgroundColor, borderColor: disabled ? theme.colors.shades['50'].color : borderColor, size: size, "data-testid": "cluboffer-container", style: style, className: className }, { children: jsx$1(H3$2, __assign$1({ textColor: disabled ? theme.colors.shades['250'].color : textColor, size: size, style: { fontSize: '0.875rem', lineHeight: '18px' } }, { children: clubOfferText }), void 0) }), void 0));
|
|
3222
3222
|
};
|
|
3223
3223
|
var templateObject_1$2j, templateObject_2$1F;
|
|
3224
3224
|
|
|
@@ -3273,7 +3273,7 @@ var Container$1o = newStyled.div(templateObject_1$2i || (templateObject_1$2i = _
|
|
|
3273
3273
|
var size = _a.size;
|
|
3274
3274
|
return (_b = getStylesBySize$f(size)) === null || _b === void 0 ? void 0 : _b.height;
|
|
3275
3275
|
});
|
|
3276
|
-
var H3$
|
|
3276
|
+
var H3$1 = newStyled.h3(templateObject_2$1E || (templateObject_2$1E = __makeTemplateObject(["\n color: ", ";\n font-weight: bold;\n margin: 0;\n font-size: ", ";\n line-height: ", ";\n"], ["\n color: ", ";\n font-weight: bold;\n margin: 0;\n font-size: ", ";\n line-height: ", ";\n"])), function (_a) {
|
|
3277
3277
|
var textColor = _a.textColor;
|
|
3278
3278
|
return textColor;
|
|
3279
3279
|
}, function (_a) {
|
|
@@ -3288,7 +3288,7 @@ var H3$2 = newStyled.h3(templateObject_2$1E || (templateObject_2$1E = __makeTemp
|
|
|
3288
3288
|
var DiscountTag$3 = function (_a) {
|
|
3289
3289
|
var discount = _a.discount, offText = _a.offText, savings = _a.savings, _b = _a.showSavings, showSavings = _b === void 0 ? false : _b, disabled = _a.disabled, _c = _a.backgroundColor, backgroundColor = _c === void 0 ? '#fff' : _c, _d = _a.borderColor, borderColor = _d === void 0 ? 'transparent' : _d, _e = _a.textColor, textColor = _e === void 0 ? '#fff' : _e, _f = _a.size, size = _f === void 0 ? ComponentSize.Medium : _f, style = _a.style, _g = _a.bordersRounded, bordersRounded = _g === void 0 ? false : _g;
|
|
3290
3290
|
var theme = useTheme();
|
|
3291
|
-
return (jsx$1(Container$1o, __assign$1({ backgroundColor: disabled ? theme.colors.shades['50'].color : backgroundColor, borderColor: disabled ? theme.colors.shades['50'].color : borderColor, size: size, "data-testid": "discount-container", style: style, bordersRounded: bordersRounded }, { children: jsxs$1(H3$
|
|
3291
|
+
return (jsx$1(Container$1o, __assign$1({ backgroundColor: disabled ? theme.colors.shades['50'].color : backgroundColor, borderColor: disabled ? theme.colors.shades['50'].color : borderColor, size: size, "data-testid": "discount-container", style: style, bordersRounded: bordersRounded }, { children: jsxs$1(H3$1, __assign$1({ textColor: disabled ? theme.colors.shades['250'].color : textColor, size: size, style: style, theme: theme }, { children: [discount, "% ", offText, " ", showSavings && savings && "- ".concat(savings)] }), void 0) }), void 0));
|
|
3292
3292
|
};
|
|
3293
3293
|
var templateObject_1$2i, templateObject_2$1E;
|
|
3294
3294
|
|
|
@@ -6403,7 +6403,7 @@ var BuyNowPayLater = function (_a) {
|
|
|
6403
6403
|
console.error('Icon', iconName, 'not found');
|
|
6404
6404
|
return null;
|
|
6405
6405
|
}
|
|
6406
|
-
return (jsx$1(Container$18, __assign$1({ displayBNPL: displayBNPL }, { children: jsxs$1(TextContainer$1, __assign$1({ style: { fontSize: fontSize }, "data-testid": "mainText" }, { children: ["Or ".concat(installments, " payments of "), jsx$1(Text$7, __assign$1({ variant: "
|
|
6406
|
+
return (jsx$1(Container$18, __assign$1({ displayBNPL: displayBNPL }, { children: jsxs$1(TextContainer$1, __assign$1({ style: { fontSize: fontSize }, "data-testid": "mainText" }, { children: ["Or ".concat(installments, " payments of "), jsx$1(Text$7, __assign$1({ variant: "body", weight: "bold", style: { display: 'inline', fontSize: fontSize }, testId: "InstallmentPriceId" }, { children: installmentPrice }), void 0), showLogo ? ' with' : '', showLogo && (jsx$1(IconWrapper$1, { children: jsx$1(IconComponent, { width: 3.2, height: 2, fill: iconColor, style: { top: '-3px', position: 'relative' } }, void 0) }, void 0))] }), void 0) }), void 0));
|
|
6407
6407
|
};
|
|
6408
6408
|
var templateObject_1$1L, templateObject_2$1h, templateObject_3$10;
|
|
6409
6409
|
|
|
@@ -6415,11 +6415,11 @@ var Title$8 = function (_a) {
|
|
|
6415
6415
|
};
|
|
6416
6416
|
var templateObject_1$1K;
|
|
6417
6417
|
|
|
6418
|
-
var P$
|
|
6418
|
+
var P$4 = newStyled.p(templateObject_1$1J || (templateObject_1$1J = __makeTemplateObject(["\n font-size: 0.75rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"], ["\n font-size: 0.75rem;\n font-weight: 400;\n line-height: 1.125rem;\n color: ", ";\n margin: 0;\n padding: 0;\n"])), function (props) { return props.color; });
|
|
6419
6419
|
var Promo = function (_a) {
|
|
6420
6420
|
var text = _a.text;
|
|
6421
6421
|
var theme = useTheme();
|
|
6422
|
-
return (jsx$1(P$
|
|
6422
|
+
return (jsx$1(P$4, __assign$1({ color: theme.colors.shades['700'].color, "data-testid": "CartProductItemPromo" }, { children: text }), void 0));
|
|
6423
6423
|
};
|
|
6424
6424
|
var templateObject_1$1J;
|
|
6425
6425
|
|
|
@@ -7086,11 +7086,12 @@ var SingleColorPicker = function (_a) {
|
|
|
7086
7086
|
};
|
|
7087
7087
|
|
|
7088
7088
|
var ColorPickerWithTooltip = function (_a) {
|
|
7089
|
-
var _b = _a.options, options = _b === void 0 ? [] : _b, selectedValue = _a.selectedValue, label = _a.label, onChange = _a.onChange, _c = _a.inline, inline = _c === void 0 ? false : _c, _d = _a.maxVisibleOptions, maxVisibleOptions = _d === void 0 ? 5 : _d, showCross = _a.showCross, className = _a.className;
|
|
7089
|
+
var _b = _a.options, options = _b === void 0 ? [] : _b, selectedValue = _a.selectedValue, label = _a.label, onChange = _a.onChange, _c = _a.inline, inline = _c === void 0 ? false : _c, _d = _a.maxVisibleOptions, maxVisibleOptions = _d === void 0 ? 5 : _d, showCross = _a.showCross, className = _a.className, tooltipOptions = _a.tooltipOptions;
|
|
7090
7090
|
var visibleOptions = options.slice(0, maxVisibleOptions);
|
|
7091
7091
|
var hiddenOptions = options.slice(maxVisibleOptions);
|
|
7092
|
+
var showCloseIcon = (tooltipOptions !== null && tooltipOptions !== void 0 ? tooltipOptions : {}).showCloseIcon;
|
|
7092
7093
|
var ColorPickerWrapper = newStyled(ColorRadioGroup$1)(templateObject_1$1u || (templateObject_1$1u = __makeTemplateObject(["\n position: relative;\n max-width: 300px;\n\n .tooltip-container {\n position: absolute;\n transform: translateX(-30%);\n &::before,\n &::after {\n left: 80%;\n }\n }\n\n .arrow {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-bottom: 10px;\n }\n\n .tooltip-content {\n display: flex;\n max-width: 300px;\n flex-wrap: wrap;\n }\n "], ["\n position: relative;\n max-width: 300px;\n\n .tooltip-container {\n position: absolute;\n transform: translateX(-30%);\n &::before,\n &::after {\n left: 80%;\n }\n }\n\n .arrow {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-bottom: 10px;\n }\n\n .tooltip-content {\n display: flex;\n max-width: 300px;\n flex-wrap: wrap;\n }\n "])));
|
|
7093
|
-
return (jsxs(ColorPickerWrapper, __assign$1({ className: className, value: selectedValue, onChange: onChange, css: { flexDirection: inline ? 'row' : 'column', alignItems: inline ? 'center' : 'start' } }, { children: [jsx(ColorRadioGroup$1.Label, { label: label, values: selectedValue && !inline ? selectedValue.label : undefined }, void 0), jsxs(ColorRadioGroup$1.OptionsContainer, __assign$1({ css: { marginTop: inline ? '0' : '0.63rem', marginLeft: inline ? '1.5rem' : '0' }, "data-testid": "radio-group-options-container" }, { children: [renderOptions$1(visibleOptions, showCross), !!hiddenOptions.length && (jsx("div", __assign$1({ style: { display: 'flex', alignItems: 'center', justifyContent: 'center' } }, { children: jsx(Tooltip, __assign$1({ position: 1, elementContent: jsx("div", __assign$1({ className: "tooltip-content" }, { children: renderOptions$1(hiddenOptions, showCross) }), void 0), withArrow: true }, { children: jsx("div", __assign$1({ className: "arrow", "data-testid": "tooltip-arrow" }, { children: jsx(Icon$1, { name: "arrows/chevron_down", width: 1, height: 1 }, void 0) }), void 0) }), void 0) }), void 0))] }), void 0)] }), void 0));
|
|
7094
|
+
return (jsxs(ColorPickerWrapper, __assign$1({ className: className, value: selectedValue, onChange: onChange, css: { flexDirection: inline ? 'row' : 'column', alignItems: inline ? 'center' : 'start' } }, { children: [jsx(ColorRadioGroup$1.Label, { label: label, values: selectedValue && !inline ? selectedValue.label : undefined }, void 0), jsxs(ColorRadioGroup$1.OptionsContainer, __assign$1({ css: { marginTop: inline ? '0' : '0.63rem', marginLeft: inline ? '1.5rem' : '0' }, "data-testid": "radio-group-options-container" }, { children: [renderOptions$1(visibleOptions, showCross), !!hiddenOptions.length && (jsx("div", __assign$1({ style: { display: 'flex', alignItems: 'center', justifyContent: 'center' } }, { children: jsx(Tooltip, __assign$1({ showCloseIcon: showCloseIcon, position: 1, elementContent: jsx("div", __assign$1({ className: "tooltip-content" }, { children: renderOptions$1(hiddenOptions, showCross) }), void 0), withArrow: true }, { children: jsx("div", __assign$1({ className: "arrow", "data-testid": "tooltip-arrow" }, { children: jsx(Icon$1, { name: "arrows/chevron_down", width: 1, height: 1 }, void 0) }), void 0) }), void 0) }), void 0))] }), void 0)] }), void 0));
|
|
7094
7095
|
};
|
|
7095
7096
|
var templateObject_1$1u;
|
|
7096
7097
|
|
|
@@ -7137,12 +7138,12 @@ var Row$2 = newStyled.div(templateObject_3$V || (templateObject_3$V = __makeTemp
|
|
|
7137
7138
|
"\n flex-direction: row-reverse;\n justify-content: space-between;\n ";
|
|
7138
7139
|
});
|
|
7139
7140
|
var H5 = newStyled.h5(templateObject_4$J || (templateObject_4$J = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 500;\n margin-bottom: 0.125rem;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n font-weight: 500;\n margin-bottom: 0.125rem;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
|
|
7140
|
-
var H3
|
|
7141
|
+
var H3 = newStyled.h3(templateObject_5$y || (templateObject_5$y = __makeTemplateObject(["\n font-size: 1.125rem;\n line-height: 1.75rem;\n font-weight: 700;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 1.125rem;\n line-height: 1.75rem;\n font-weight: 700;\n margin: 0;\n color: ", ";\n"])), function (props) { return props.color; });
|
|
7141
7142
|
var FreeShipping = newStyled.span(templateObject_6$w || (templateObject_6$w = __makeTemplateObject(["\n font-weight: 600;\n color: ", ";\n"], ["\n font-weight: 600;\n color: ", ";\n"])), function (props) { return props.color; });
|
|
7142
7143
|
var CrossSellCheckbox = function (_a) {
|
|
7143
7144
|
var imageURL = _a.imageURL, title = _a.title, description = _a.description, freeShippingText = _a.freeShippingText, rightToLeft = _a.rightToLeft, onChange = _a.onChange;
|
|
7144
7145
|
var theme = useTheme();
|
|
7145
|
-
return (jsxs$1(Wrapper$5, __assign$1({ backgroundColor: theme.colors.shades['10'].color, rightToLeft: Boolean(rightToLeft) }, { children: [jsx$1(Checkbox, { text: "", id: "checkbox", onChange: onChange, size: ComponentSize.Small, variant: "secondary" }, void 0), jsxs$1(Row$2, __assign$1({ rightToLeft: Boolean(rightToLeft) }, { children: [jsx$1(Image$3, { src: imageURL, alt: "Cross sell image", borderRadius: "0.5rem" }, void 0), jsxs$1(Col$1, { children: [jsx$1(H5, __assign$1({ color: theme.colors.shades['700'].color }, { children: title }), void 0), jsxs$1(H3
|
|
7146
|
+
return (jsxs$1(Wrapper$5, __assign$1({ backgroundColor: theme.colors.shades['10'].color, rightToLeft: Boolean(rightToLeft) }, { children: [jsx$1(Checkbox, { text: "", id: "checkbox", onChange: onChange, size: ComponentSize.Small, variant: "secondary" }, void 0), jsxs$1(Row$2, __assign$1({ rightToLeft: Boolean(rightToLeft) }, { children: [jsx$1(Image$3, { src: imageURL, alt: "Cross sell image", borderRadius: "0.5rem" }, void 0), jsxs$1(Col$1, { children: [jsx$1(H5, __assign$1({ color: theme.colors.shades['700'].color }, { children: title }), void 0), jsxs$1(H3, __assign$1({ color: theme.colors.semantic.urgent.color }, { children: [description, jsxs$1(FreeShipping, __assign$1({ color: theme.colors.shades['700'].color }, { children: [' ', "+ ", freeShippingText] }), void 0)] }), void 0)] }, void 0)] }), void 0)] }), void 0));
|
|
7146
7147
|
};
|
|
7147
7148
|
var templateObject_1$1t, templateObject_2$18, templateObject_3$V, templateObject_4$J, templateObject_5$y, templateObject_6$w;
|
|
7148
7149
|
|
|
@@ -7496,14 +7497,14 @@ function FilteringDropdown(_a) {
|
|
|
7496
7497
|
}
|
|
7497
7498
|
|
|
7498
7499
|
var Title$4 = newStyled.div(templateObject_1$1l || (templateObject_1$1l = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-bottom: 0.063rem solid ", ";\n user-select: none;\n cursor: pointer;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-bottom: 0.063rem solid ", ";\n user-select: none;\n cursor: pointer;\n"])), function (props) { return props.borderColor; });
|
|
7499
|
-
var
|
|
7500
|
+
var P$3 = newStyled.p(templateObject_2$10 || (templateObject_2$10 = __makeTemplateObject(["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n margin: 0.75rem 0;\n"], ["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n margin: 0.75rem 0;\n"])), function (props) { return props.color; });
|
|
7500
7501
|
var ArrowContainer = newStyled.div(templateObject_3$P || (templateObject_3$P = __makeTemplateObject(["\n width: 1rem;\n height: 1rem;\n"], ["\n width: 1rem;\n height: 1rem;\n"])));
|
|
7501
7502
|
var Container$Z = newStyled.div(templateObject_4$D || (templateObject_4$D = __makeTemplateObject(["\n @media (max-width: 768px) {\n display: ", ";\n }\n"], ["\n @media (max-width: 768px) {\n display: ", ";\n }\n"])), function (props) { return (props.showInMobile ? 'block' : 'none'); });
|
|
7502
7503
|
var Accordion = function (_a) {
|
|
7503
7504
|
var title = _a.title, children = _a.children, _b = _a.isOpenByDefault, isOpenByDefault = _b === void 0 ? false : _b, _c = _a.showInMobile, showInMobile = _c === void 0 ? true : _c;
|
|
7504
7505
|
var theme = useTheme();
|
|
7505
7506
|
var _d = React__default.useState(isOpenByDefault), isOpen = _d[0], setIsOpen = _d[1];
|
|
7506
|
-
return (jsxs$1(Container$Z, __assign$1({ "data-testid": "FiltersAccordion", showInMobile: showInMobile }, { children: [jsxs$1(Title$4, __assign$1({ onClick: function () { return setIsOpen(function (state) { return !state; }); }, borderColor: theme.colors.shades['100'].color, "data-testid": "accordion-title" }, { children: [jsx$1(
|
|
7507
|
+
return (jsxs$1(Container$Z, __assign$1({ "data-testid": "FiltersAccordion", showInMobile: showInMobile }, { children: [jsxs$1(Title$4, __assign$1({ onClick: function () { return setIsOpen(function (state) { return !state; }); }, borderColor: theme.colors.shades['100'].color, "data-testid": "accordion-title" }, { children: [jsx$1(P$3, __assign$1({ color: theme.colors.shades['550'].color }, { children: title }), void 0), jsx$1(ArrowContainer, { children: isOpen ? (jsx$1(Icon.Arrows.ChevronUp, { fill: theme.colors.shades['700'].color }, void 0)) : (jsx$1(Icon.Arrows.ChevronDown, { fill: theme.colors.shades['700'].color }, void 0)) }, void 0)] }), void 0), jsx$1("div", __assign$1({ style: { display: isOpen ? 'block' : 'none' }, "data-testid": "accordion-children-container" }, { children: children }), void 0)] }), void 0));
|
|
7507
7508
|
};
|
|
7508
7509
|
var templateObject_1$1l, templateObject_2$10, templateObject_3$P, templateObject_4$D;
|
|
7509
7510
|
|
|
@@ -20081,7 +20082,7 @@ var ImageContainer$1 = newStyled.div(function (_a) {
|
|
|
20081
20082
|
var ImageHoverContainer$1 = newStyled.img(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"], ["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"])));
|
|
20082
20083
|
var Container$i = newStyled.a(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"])));
|
|
20083
20084
|
var ProdCardContainer$2 = newStyled.div(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n"])));
|
|
20084
|
-
var Title$2 = newStyled.
|
|
20085
|
+
var Title$2 = newStyled.h2(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"], ["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"])), function (props) { return props.theme.colors.pallete.secondary.color; }, function (props) { return props.align; });
|
|
20085
20086
|
newStyled.div(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n position: absolute;\n left: 0;\n top: 0;\n width: ", ";\n z-index: 1;\n"], ["\n position: absolute;\n left: 0;\n top: 0;\n width: ", ";\n z-index: 1;\n"])), function (_a) {
|
|
20086
20087
|
var style = _a.style;
|
|
20087
20088
|
return style.width;
|
|
@@ -20161,7 +20162,7 @@ var DiscountLabel$1 = newStyled.div(templateObject_1$j || (templateObject_1$j =
|
|
|
20161
20162
|
var ImageHoverContainer = newStyled.img(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"], ["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"])));
|
|
20162
20163
|
var Container$h = newStyled.a(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n width: 100%;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n width: 100%;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"])));
|
|
20163
20164
|
var ProdCardContainer$1 = newStyled.div(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n"])));
|
|
20164
|
-
var Title$1 = newStyled.
|
|
20165
|
+
var Title$1 = newStyled.h2(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"], ["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"])), function (props) { return props.theme.colors.pallete.secondary.color; }, function (props) { return props.align; });
|
|
20165
20166
|
var TopTagContainer$5 = newStyled.div(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n position: absolute;\n left: 0;\n top: 0;\n width: ", ";\n z-index: 1;\n"], ["\n position: absolute;\n left: 0;\n top: 0;\n width: ", ";\n z-index: 1;\n"])), function (_a) {
|
|
20166
20167
|
var style = _a.style;
|
|
20167
20168
|
return style.width;
|
|
@@ -20259,7 +20260,7 @@ var DiscountLabel = newStyled.div(templateObject_1$i || (templateObject_1$i = __
|
|
|
20259
20260
|
newStyled.img(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"], ["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"])));
|
|
20260
20261
|
var Container$g = newStyled.a(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n width: 100%;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n width: 100%;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"])));
|
|
20261
20262
|
var ProdCardContainer = newStyled.div(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n width: fit-content;\n text-decoration: none;\n"], ["\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n width: fit-content;\n text-decoration: none;\n"])));
|
|
20262
|
-
var Title = newStyled.
|
|
20263
|
+
var Title = newStyled.h2(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"], ["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"])), function (props) { return props.theme.colors.pallete.secondary.color; }, function (props) { return props.align; });
|
|
20263
20264
|
newStyled.div(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n position: absolute;\n left: 0;\n top: 0;\n width: ", ";\n z-index: 1;\n"], ["\n position: absolute;\n left: 0;\n top: 0;\n width: ", ";\n z-index: 1;\n"])), function (_a) {
|
|
20264
20265
|
var style = _a.style;
|
|
20265
20266
|
return style.width;
|