ordering-ui-external 4.0.4 → 4.0.5
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.
|
@@ -20,7 +20,7 @@ var TitleWrapper = _styledComponents.default.div(_templateObject3 || (_templateO
|
|
|
20
20
|
exports.TitleWrapper = TitleWrapper;
|
|
21
21
|
var WrapperImage = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n margin-left: -20px;\n margin-top: 20px;\n width: calc(100% + 40px);\n position: relative;\n"])));
|
|
22
22
|
exports.WrapperImage = WrapperImage;
|
|
23
|
-
var SwiperWrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n position: relative;\n width: 100%;\n\n img{\n ", "\n }\n .mySwiper2 {\n height: 250px;\n width: 100%;\n ", "\n .swiper-slide-active {\n border-radius: 0px;\n img {\n border-radius: 0px;\n }\n }\n\n @media (min-width: 480px){\n ", "\n }\n\n @media (min-width: 576px) {\n height: 320px;\n ", "\n }\n ", "\n }\n
|
|
23
|
+
var SwiperWrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n position: relative;\n width: 100%;\n\n img{\n ", "\n }\n .mySwiper2 {\n height: 250px;\n width: 100%;\n ", "\n .swiper-slide-active {\n border-radius: 0px;\n img {\n border-radius: 0px;\n }\n }\n\n @media (min-width: 480px){\n ", "\n }\n\n @media (min-width: 576px) {\n height: 320px;\n ", "\n }\n ", "\n }\n\n\n .swiper {\n width: 100%;\n height: 500px;\n margin-left: auto;\n margin-right: auto;\n }\n\n .swiper-slide {\n background-size: cover;\n background-position: center;\n .active-img {\n ", "\n }\n }\n\n .product-thumb {\n box-sizing: border-box;\n padding: 30px 0px;\n margin: 0px 20px;\n\n .swiper-slide {\n display: flex;\n opacity: 0.8;\n border-radius: 7.6px;\n height: auto;\n cursor: pointer;\n overflow: hidden;\n\n img {\n border-radius: 7.6px;\n max-height: 70px;\n ", "\n }\n }\n\n .swiper-slide-thumb-active {\n opacity: 1;\n }\n }\n\n .swiper-slide img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n ", "\n }\n\n .active-img {\n ", "\n }\n\n .swiper-button-next {\n background-image: url(", ");\n background-color: #d1d0d04d;\n background-repeat: no-repeat;\n background-position: 55% center;\n width: 32px;\n height: 32px;\n box-shadow: rgb(0 0 0 / 7%) 0px 4px 10px;\n border-radius: 50%;\n transition: all 0.2s ease;\n\n &:hover {\n transform: scale(1.05);\n }\n }\n\n .swiper-button-prev {\n background-image: url(", ");\n background-color: #d1d0d04d;\n background-repeat: no-repeat;\n background-position: 45% center;\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-shadow: rgb(0 0 0 / 7%) 0px 4px 10px;\n transition: all 0.2s ease;\n\n &:hover {\n transform: scale(1.05);\n }\n }\n\n .swiper-button-next::after, .swiper-button-prev::after {\n display: none;\n }\n"])), function (props) {
|
|
24
24
|
return props.isSoldOut && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n filter: grayscale(1);\n "])));
|
|
25
25
|
}, function (_ref) {
|
|
26
26
|
var _theme$business_view, _theme$business_view$, _theme$business_view$2, _theme$business_view$3, _theme$business_view$4;
|
|
@@ -72,7 +72,7 @@ var SectionTitle = _styledComponents.default.h3(_templateObject18 || (_templateO
|
|
|
72
72
|
exports.SectionTitle = SectionTitle;
|
|
73
73
|
var ProductComment = _styledComponents.default.div(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n margin-bottom: 130px;\n\n textarea {\n margin-top: 8px;\n }\n\n p {\n font-weight: 300;\n margin-bottom: 5px;\n }\n\n @media (min-width: 577px) {\n margin-bottom: 62px;\n }\n\n @media (min-width: 769px) {\n margin-bottom: 0px;\n padding-bottom: 10px;\n }\n"])));
|
|
74
74
|
exports.ProductComment = ProductComment;
|
|
75
|
-
var ProductActions = _styledComponents.default.div(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 10px 0px;\n width: 100%;\n z-index: 9999997;\n\n position: fixed;\n bottom: 0;\n right: 0;\n width: 100%;\n background-color: #FFF;\n\n div.price {\n padding-top: 10px;\n color: ", ";\n h4 {\n margin: 0;\n font-weight: 600;\n font-size: 20px;\n line-height: 20px;\n }\n span {\n font-size: 13px;\n color: #D83520;\n line-height: 15px;\n }\n }\n\n div.incdec-control {\n width: 195px;\n display: flex;\n justify-content: space-around;\n align-items: center;\n position: relative;\n\n svg {\n width: 25px;\n height: 25px;\n cursor: pointer;\n }\n }\n\n div.price-amount-block {\n display: flex;\n justify-content: space-between;\n width: 70%\n }\n\n svg {\n color: ", ";\n }\n\n svg.disabled {\n pointer-events: none;\n color: #CED4DA;\n }\n\n button:disabled,\n button.disabled {\n background: #E9ECEF;\n border: 1px solid #E9ECEF;\n color: #B1BCCC;\n }\n\n button.add {\n width: 90%;\n padding: 5px 10px;\n margin-top: 10px;\n position: relative;\n\n &.soldout {\n width: 100%;\n pointer-events: none;\n }\n }\n .qty {\n flex: 1;\n text-align: center;\n display: flex;\n align-items: center;\n height: 38px;\n min-width: 60px;\n box-sizing: border-box;\n padding: 0;\n margin: 0 10px;\n }\n\n #address_control {\n button.add {\n width: calc(100% - 20px) !important;\n margin: 10px 10px 0 10px;\n }\n }\n
|
|
75
|
+
var ProductActions = _styledComponents.default.div(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 10px 0px;\n width: 100%;\n z-index: 9999997;\n\n position: fixed;\n bottom: 0;\n right: 0;\n width: 100%;\n background-color: #FFF;\n\n div.price {\n padding-top: 10px;\n color: ", ";\n h4 {\n margin: 0;\n font-weight: 600;\n font-size: 20px;\n line-height: 20px;\n }\n span {\n font-size: 13px;\n color: #D83520;\n line-height: 15px;\n }\n }\n\n div.incdec-control {\n width: 195px;\n display: flex;\n justify-content: space-around;\n align-items: center;\n position: relative;\n\n svg {\n width: 25px;\n height: 25px;\n cursor: pointer;\n }\n }\n\n div.price-amount-block {\n display: flex;\n justify-content: space-between;\n width: 70%\n }\n\n svg {\n color: ", ";\n }\n\n svg.disabled {\n pointer-events: none;\n color: #CED4DA;\n }\n\n button:disabled,\n button.disabled {\n background: #E9ECEF;\n border: 1px solid #E9ECEF;\n color: #B1BCCC;\n }\n\n button.add {\n width: 90%;\n padding: 5px 10px;\n margin-top: 10px;\n position: relative;\n\n &.soldout {\n width: 100%;\n pointer-events: none;\n }\n }\n .qty {\n flex: 1;\n text-align: center;\n display: flex;\n align-items: center;\n height: 38px;\n min-width: 60px;\n box-sizing: border-box;\n padding: 0;\n margin: 0 10px;\n }\n\n #address_control {\n button.add {\n width: calc(100% - 20px) !important;\n margin: 10px 10px 0 10px;\n }\n }\n\n div#address_list {\n padding: 0;\n }\n\n @media (min-width: 577px) {\n position: sticky;\n }\n\n @media (min-width: 1200px) {\n bottom: 0px;\n flex-direction: row;\n justify-content: space-between;\n border-top: 1px solid #E9ECEF;\n width: calc(100% + 40px);\n transform: translateX(-20px);\n padding: 10px 20px;\n box-sizing: border-box;\n\n ", "\n\n div.price {\n width: 25%;\n }\n\n button.add {\n width: 35%;\n margin-top: 0;\n }\n\n div.incdec-control {\n margin-right: 18%;\n &.show-weight-unit{\n width: 40%;\n }\n }\n }\n"])), function (props) {
|
|
76
76
|
var _props$theme;
|
|
77
77
|
return (_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.colors.darkTextColor;
|
|
78
78
|
}, function (props) {
|
|
@@ -96,7 +96,7 @@ var WrapperIngredients = _styledComponents.default.div(_templateObject25 || (_te
|
|
|
96
96
|
return isProductSoldout && (0, _styledComponents.css)(_templateObject26 || (_templateObject26 = _taggedTemplateLiteral(["\n border-radius: 10px;\n pointer-events: none;\n background: hsl(0, 0%, 72%);\n "])));
|
|
97
97
|
});
|
|
98
98
|
exports.WrapperIngredients = WrapperIngredients;
|
|
99
|
-
var ProductTabContainer = _styledComponents.default.div(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral(["\n border-bottom: 1px solid #E9ECEF;\n position: sticky;\n top:
|
|
99
|
+
var ProductTabContainer = _styledComponents.default.div(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral(["\n border-bottom: 1px solid #E9ECEF;\n position: sticky;\n top: 0px;\n background: white;\n z-index: 9999996;\n overflow: scroll hidden;\n width: 100%;\n ::-webkit-scrollbar {\n height: 0px;\n }\n\n #optionList {\n > div {\n white-space: nowrap;\n max-width: 200px;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 10px 0px;\n margin-right: 25px;\n ", "\n }\n }\n"])), function (props) {
|
|
100
100
|
return props.theme.rtl && (0, _styledComponents.css)(_templateObject28 || (_templateObject28 = _taggedTemplateLiteral(["\n margin-right: 0px;\n margin-left: 25px;\n "])));
|
|
101
101
|
});
|
|
102
102
|
exports.ProductTabContainer = ProductTabContainer;
|
|
@@ -126,12 +126,12 @@ var ProductTagWrapper = _styledComponents.default.div(_templateObject39 || (_tem
|
|
|
126
126
|
return (_props$theme3 = props.theme) !== null && _props$theme3 !== void 0 && _props$theme3.rtl ? (0, _styledComponents.css)(_templateObject40 || (_templateObject40 = _taggedTemplateLiteral(["\n margin: 0 10px 0 20px;\n "]))) : (0, _styledComponents.css)(_templateObject41 || (_templateObject41 = _taggedTemplateLiteral(["\n margin: 0 20px 0 10px;\n "])));
|
|
127
127
|
});
|
|
128
128
|
exports.ProductTagWrapper = ProductTagWrapper;
|
|
129
|
-
var WeightUnitSwitch = _styledComponents.default.div(_templateObject42 || (_templateObject42 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n width: auto;\n margin-left: 10px;\n
|
|
129
|
+
var WeightUnitSwitch = _styledComponents.default.div(_templateObject42 || (_templateObject42 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n width: auto;\n margin-left: 10px;\n\n ", "\n"])), function (props) {
|
|
130
130
|
var _props$theme4;
|
|
131
131
|
return ((_props$theme4 = props.theme) === null || _props$theme4 === void 0 ? void 0 : _props$theme4.rtl) && (0, _styledComponents.css)(_templateObject43 || (_templateObject43 = _taggedTemplateLiteral(["\n margin-right: 10px;\n margin-left: 0;\n "])));
|
|
132
132
|
});
|
|
133
133
|
exports.WeightUnitSwitch = WeightUnitSwitch;
|
|
134
|
-
var WeightUnitItem = _styledComponents.default.span(_templateObject44 || (_templateObject44 = _taggedTemplateLiteral(["\n display: inline-flex;\n width: fit-content;\n min-width: unset !important;\n font-size: 12px;\n line-height: 18px;\n padding: 2px 6px;\n cursor: pointer;\n
|
|
134
|
+
var WeightUnitItem = _styledComponents.default.span(_templateObject44 || (_templateObject44 = _taggedTemplateLiteral(["\n display: inline-flex;\n width: fit-content;\n min-width: unset !important;\n font-size: 12px;\n line-height: 18px;\n padding: 2px 6px;\n cursor: pointer;\n\n ", "\n"])), function (_ref12) {
|
|
135
135
|
var active = _ref12.active;
|
|
136
136
|
return active && (0, _styledComponents.css)(_templateObject45 || (_templateObject45 = _taggedTemplateLiteral(["\n background-color: ", "15;\n border-radius: 3px;\n color: ", ";\n "])), function (props) {
|
|
137
137
|
return props.theme.colors.primary;
|
package/package.json
CHANGED
|
@@ -94,7 +94,7 @@ export const SwiperWrapper = styled.div`
|
|
|
94
94
|
}
|
|
95
95
|
`}
|
|
96
96
|
}
|
|
97
|
-
|
|
97
|
+
|
|
98
98
|
|
|
99
99
|
.swiper {
|
|
100
100
|
width: 100%;
|
|
@@ -362,7 +362,7 @@ export const ProductActions = styled.div`
|
|
|
362
362
|
margin: 10px 10px 0 10px;
|
|
363
363
|
}
|
|
364
364
|
}
|
|
365
|
-
|
|
365
|
+
|
|
366
366
|
div#address_list {
|
|
367
367
|
padding: 0;
|
|
368
368
|
}
|
|
@@ -439,7 +439,7 @@ export const WrapperIngredients = styled.div`
|
|
|
439
439
|
export const ProductTabContainer = styled.div`
|
|
440
440
|
border-bottom: 1px solid #E9ECEF;
|
|
441
441
|
position: sticky;
|
|
442
|
-
top:
|
|
442
|
+
top: 0px;
|
|
443
443
|
background: white;
|
|
444
444
|
z-index: 9999996;
|
|
445
445
|
overflow: scroll hidden;
|
|
@@ -587,7 +587,7 @@ export const WeightUnitSwitch = styled.div`
|
|
|
587
587
|
flex-direction: column;
|
|
588
588
|
width: auto;
|
|
589
589
|
margin-left: 10px;
|
|
590
|
-
|
|
590
|
+
|
|
591
591
|
${props => props.theme?.rtl && css`
|
|
592
592
|
margin-right: 10px;
|
|
593
593
|
margin-left: 0;
|
|
@@ -601,7 +601,7 @@ export const WeightUnitItem = styled.span`
|
|
|
601
601
|
line-height: 18px;
|
|
602
602
|
padding: 2px 6px;
|
|
603
603
|
cursor: pointer;
|
|
604
|
-
|
|
604
|
+
|
|
605
605
|
${({ active }) => active && css`
|
|
606
606
|
background-color: ${props => props.theme.colors.primary}15;
|
|
607
607
|
border-radius: 3px;
|