ordering-ui-external 1.1.5 → 1.1.6
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.
|
@@ -5,13 +5,13 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports.WrapperRightContainer = exports.WrapperLeftContainer = exports.WrapperDriver = exports.WrapperContainer = exports.TitleContainer = exports.StatusBar = exports.SkeletonWrapper = exports.SkeletonBlockWrapp = exports.SkeletonBlock = exports.ShareOrder = exports.SectionTitleContainer = exports.SectionTitle = exports.ReviewWrapper = exports.ReviewOrderLink = exports.ReOrder = exports.PlaceSpotSection = exports.PhotoBlock = exports.OrderProducts = exports.OrderPreferences = exports.OrderInfo = exports.OrderHistoryContainer = exports.OrderDriver = exports.OrderCustomer = exports.OrderBusiness = exports.OrderBill = exports.OrderActions = exports.NewOrder = exports.MyOrderActions = exports.MessagesIcon = exports.MapWrapper = exports.Map = exports.LinkWrapper = exports.HistoryItemWrapper = exports.HeaderTitle = exports.HeaderInfo = exports.ExclamationWrapper = exports.Exclamation = exports.Divider = exports.DetailWrapper = exports.Content = exports.Container = exports.CommentContainer = exports.ButtonWrapper = exports.BusinessWrapper = exports.BusinessTitle = exports.BusinessInfo = exports.BusinessExternalWrapper = exports.BtsOrderStatus = exports.ActionsBlock = void 0;
|
|
8
|
+
exports.WrapperRightContainer = exports.WrapperLeftContainer = exports.WrapperDriver = exports.WrapperContainer = exports.TitleContainer = exports.StatusBar = exports.SkeletonWrapper = exports.SkeletonBlockWrapp = exports.SkeletonBlock = exports.ShareOrder = exports.SectionTitleContainer = exports.SectionTitle = exports.ReviewWrapper = exports.ReviewOrderLink = exports.ReOrder = exports.PlaceSpotSection = exports.PhotoBlock = exports.OrderStatusAndLinkContainer = exports.OrderProducts = exports.OrderPreferences = exports.OrderInfo = exports.OrderIdSec = exports.OrderHistoryContainer = exports.OrderDriver = exports.OrderCustomer = exports.OrderBusiness = exports.OrderBill = exports.OrderActions = exports.NewOrder = exports.MyOrderActions = exports.MessagesIcon = exports.MapWrapper = exports.Map = exports.LinkWrapper = exports.HistoryItemWrapper = exports.HeaderTitle = exports.HeaderInfo = exports.ExclamationWrapper = exports.Exclamation = exports.Divider = exports.DetailWrapper = exports.Content = exports.Container = exports.CommentContainer = exports.ButtonWrapper = exports.BusinessWrapper = exports.BusinessTitle = exports.BusinessInfo = exports.BusinessExternalWrapper = exports.BtsOrderStatus = exports.ActionsBlock = void 0;
|
|
9
9
|
|
|
10
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
11
|
|
|
12
12
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
13
13
|
|
|
14
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46, _templateObject47, _templateObject48, _templateObject49, _templateObject50, _templateObject51, _templateObject52, _templateObject53, _templateObject54, _templateObject55, _templateObject56, _templateObject57, _templateObject58, _templateObject59, _templateObject60;
|
|
14
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46, _templateObject47, _templateObject48, _templateObject49, _templateObject50, _templateObject51, _templateObject52, _templateObject53, _templateObject54, _templateObject55, _templateObject56, _templateObject57, _templateObject58, _templateObject59, _templateObject60, _templateObject61, _templateObject62;
|
|
15
15
|
|
|
16
16
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
17
|
|
|
@@ -21,7 +21,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
21
21
|
|
|
22
22
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
23
23
|
|
|
24
|
-
var Container = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 20px 0;\n"])));
|
|
24
|
+
var Container = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 45px 0 20px;\n\n @media (min-width: 740px) {\n margin: 20px 0;\n }\n"])));
|
|
25
25
|
|
|
26
26
|
exports.Container = Container;
|
|
27
27
|
|
|
@@ -47,11 +47,7 @@ var OrderBusiness = _styledComponents.default.div(_templateObject6 || (_template
|
|
|
47
47
|
|
|
48
48
|
exports.OrderBusiness = OrderBusiness;
|
|
49
49
|
|
|
50
|
-
var BusinessWrapper = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: flex;\n width:
|
|
51
|
-
var _props$w;
|
|
52
|
-
|
|
53
|
-
return (_props$w = props.w) !== null && _props$w !== void 0 ? _props$w : '100%';
|
|
54
|
-
}, function (props) {
|
|
50
|
+
var BusinessWrapper = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: flex;\n width: 100%;\n display: flex;\n align-items: center;\n flex-direction: column;\n\n ", "\n ", "\n img {\n width: 100px;\n height: 100px;\n border-radius: 7.6px;\n margin-right: 0;\n\n @media (min-width: 400px) {\n margin-right: 40px;\n }\n }\n\n @media (min-width: 400px) {\n flex-direction: row;\n width: ", ";\n }\n"])), function (props) {
|
|
55
51
|
return props.borderBottom && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n padding-bottom: 15px;\n border-bottom: 1px solid ", ";\n "])), function (props) {
|
|
56
52
|
return props.theme.colors.lightGray;
|
|
57
53
|
});
|
|
@@ -59,21 +55,25 @@ var BusinessWrapper = _styledComponents.default.div(_templateObject7 || (_templa
|
|
|
59
55
|
return props.borderTop && (0, _styledComponents.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n margin-top: 15px;\n border-top: 1px solid ", ";\n "])), function (props) {
|
|
60
56
|
return props.theme.colors.lightGray;
|
|
61
57
|
});
|
|
58
|
+
}, function (props) {
|
|
59
|
+
var _props$w;
|
|
60
|
+
|
|
61
|
+
return (_props$w = props.w) !== null && _props$w !== void 0 ? _props$w : '100%';
|
|
62
62
|
});
|
|
63
63
|
|
|
64
64
|
exports.BusinessWrapper = BusinessWrapper;
|
|
65
65
|
|
|
66
|
-
var BtsOrderStatus = _styledComponents.default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n
|
|
66
|
+
var BtsOrderStatus = _styledComponents.default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: center;\n margin-top: 20px;\n\n div + div {\n margin-left: 0;\n margin-top: 10px;\n }\n @media (min-width: 400px) {\n flex-direction: row;\n div + div {\n margin-left: 30px;\n margin-top: 0px;\n }\n }\n"])));
|
|
67
67
|
|
|
68
68
|
exports.BtsOrderStatus = BtsOrderStatus;
|
|
69
69
|
|
|
70
|
-
var BusinessInfo = _styledComponents.default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n width: 100%;\n box-sizing: border-box;\n margin-right:
|
|
70
|
+
var BusinessInfo = _styledComponents.default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n width: 100%;\n box-sizing: border-box;\n margin-right: 0;\n margin-top: 10px;\n\n h1,\n p {\n margin: 0;\n color: ", ";\n overflow-wrap: anywhere;\n }\n\n h2 {\n font-weight: 500;\n font-size: 18px;\n margin: 0px 0px 5px 0px;\n }\n p {\n font-size: 14px;\n margin-bottom: 5px;\n }\n\n @media (min-width: 400px) {\n margin-right: 15px;\n margin-top: 0;\n }\n"])), function (props) {
|
|
71
71
|
return props.theme.colors.darkTextColor;
|
|
72
72
|
});
|
|
73
73
|
|
|
74
74
|
exports.BusinessInfo = BusinessInfo;
|
|
75
75
|
|
|
76
|
-
var ActionsBlock = _styledComponents.default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: flex-start;\n
|
|
76
|
+
var ActionsBlock = _styledComponents.default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: flex-start;\n > * {\n margin-right: 5px;\n ", "\n }\n svg {\n font-size: 20px;\n cursor: pointer;\n color: #B1BCCC;\n }\n\n @media (min-width: 380px) {\n svg {\n font-size: 20px;\n }\n }\n"])), function (props) {
|
|
77
77
|
var _props$theme;
|
|
78
78
|
|
|
79
79
|
return ((_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.rtl) && (0, _styledComponents.css)(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n margin-left: 5px;\n margin-right: 0px;\n "])));
|
|
@@ -87,26 +87,30 @@ var OrderInfo = _styledComponents.default.div(_templateObject14 || (_templateObj
|
|
|
87
87
|
|
|
88
88
|
exports.OrderInfo = OrderInfo;
|
|
89
89
|
|
|
90
|
-
var
|
|
90
|
+
var OrderIdSec = _styledComponents.default.h1(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n font-size: 25px !important;\n @media (min-width: 350px) {\n font-size: 32px !important;\n }\n"])));
|
|
91
|
+
|
|
92
|
+
exports.OrderIdSec = OrderIdSec;
|
|
93
|
+
|
|
94
|
+
var ReviewOrderLink = _styledComponents.default.span(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n margin: 0;\n cursor: pointer;\n text-decoration-line: underline;\n user-select: none;\n ", "\n ", "\n"])), function (_ref) {
|
|
91
95
|
var active = _ref.active;
|
|
92
|
-
return active ? (0, _styledComponents.css)(
|
|
96
|
+
return active ? (0, _styledComponents.css)(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n color: ", ";\n "])), function (props) {
|
|
93
97
|
var _props$theme2;
|
|
94
98
|
|
|
95
99
|
return (_props$theme2 = props.theme) === null || _props$theme2 === void 0 ? void 0 : _props$theme2.colors.primary;
|
|
96
|
-
}) : (0, _styledComponents.css)(
|
|
100
|
+
}) : (0, _styledComponents.css)(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n color: #B1BCCC;\n cursor: not-allowed;\n span {\n pointer-events: none;\n }\n "])));
|
|
97
101
|
}, function (_ref2) {
|
|
98
102
|
var isMargin = _ref2.isMargin;
|
|
99
|
-
return isMargin && (0, _styledComponents.css)(
|
|
103
|
+
return isMargin && (0, _styledComponents.css)(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n margin: 0 10px 0 0;\n "])));
|
|
100
104
|
});
|
|
101
105
|
|
|
102
106
|
exports.ReviewOrderLink = ReviewOrderLink;
|
|
103
107
|
|
|
104
|
-
var StatusBarStyled = _styledComponents.default.div(
|
|
108
|
+
var StatusBarStyled = _styledComponents.default.div(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n height: 12px;\n margin: 18px 0px 8px;\n background: ", ";\n ", "\n"])), function (props) {
|
|
105
109
|
return "linear-gradient(to right, ".concat(props.theme.colors.primary, " ").concat(props.percentage, "%, ").concat(props.theme.colors.disabled, " ").concat(props.percentage, "%)");
|
|
106
110
|
}, function (props) {
|
|
107
111
|
var _props$theme3;
|
|
108
112
|
|
|
109
|
-
return ((_props$theme3 = props.theme) === null || _props$theme3 === void 0 ? void 0 : _props$theme3.rtl) && (0, _styledComponents.css)(
|
|
113
|
+
return ((_props$theme3 = props.theme) === null || _props$theme3 === void 0 ? void 0 : _props$theme3.rtl) && (0, _styledComponents.css)(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n background: linear-gradient(to left, ", " ", "%, ", " ", "%);\n "])), props.theme.colors.primary, props.percentage, props.theme.colors.disabled, props.percentage);
|
|
110
114
|
});
|
|
111
115
|
|
|
112
116
|
var StatusBar = function StatusBar(props) {
|
|
@@ -115,56 +119,56 @@ var StatusBar = function StatusBar(props) {
|
|
|
115
119
|
|
|
116
120
|
exports.StatusBar = StatusBar;
|
|
117
121
|
|
|
118
|
-
var SectionTitle = _styledComponents.default.h1(
|
|
122
|
+
var SectionTitle = _styledComponents.default.h1(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n margin: 20px 0 0 0;\n font-size: 20px;\n font-weight: 500;\n"])));
|
|
119
123
|
|
|
120
124
|
exports.SectionTitle = SectionTitle;
|
|
121
125
|
|
|
122
|
-
var SectionTitleContainer = _styledComponents.default.div(
|
|
126
|
+
var SectionTitleContainer = _styledComponents.default.div(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n h2 {\n font-size: 20px;\n font-weight: 500;\n margin: 0px 0px 5px 0px;\n }\n"])));
|
|
123
127
|
|
|
124
128
|
exports.SectionTitleContainer = SectionTitleContainer;
|
|
125
|
-
var OrderCustomer = (0, _styledComponents.default)(BusinessInfo)(
|
|
129
|
+
var OrderCustomer = (0, _styledComponents.default)(BusinessInfo)(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n border-radius: 7.6px;\n padding: 20px;\n box-shadow: 0px 4px 10px 0px #0000001F;\n margin-bottom: 30px;\n"])));
|
|
126
130
|
exports.OrderCustomer = OrderCustomer;
|
|
127
131
|
|
|
128
|
-
var PhotoBlock = _styledComponents.default.img(
|
|
132
|
+
var PhotoBlock = _styledComponents.default.img(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n border-radius: 7.6px;\n width: 100px;\n height: 100px;\n margin-right: 40px;\n"])));
|
|
129
133
|
|
|
130
134
|
exports.PhotoBlock = PhotoBlock;
|
|
131
135
|
|
|
132
|
-
var Map = _styledComponents.default.div(
|
|
136
|
+
var Map = _styledComponents.default.div(_templateObject26 || (_templateObject26 = _taggedTemplateLiteral(["\n margin-bottom: 10px;\n width: 100%;\n height: 350px;\n > div {\n position: relative !important;\n width: 100% !important;\n height: 100% !important;\n }\n\n img {\n object-fit: cover;\n }\n"])));
|
|
133
137
|
|
|
134
138
|
exports.Map = Map;
|
|
135
|
-
var OrderDriver = (0, _styledComponents.default)(OrderCustomer)(
|
|
139
|
+
var OrderDriver = (0, _styledComponents.default)(OrderCustomer)(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral([""])));
|
|
136
140
|
exports.OrderDriver = OrderDriver;
|
|
137
141
|
|
|
138
|
-
var WrapperDriver = _styledComponents.default.div(
|
|
142
|
+
var WrapperDriver = _styledComponents.default.div(_templateObject28 || (_templateObject28 = _taggedTemplateLiteral(["\n display: flex;\n width: 100%;\n align-items: center;\n\n div.photo {\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n width: 48px;\n height: 48px;\n margin-right: 10px;\n ", "\n }\n }\n"])), function (props) {
|
|
139
143
|
var _props$theme4;
|
|
140
144
|
|
|
141
|
-
return ((_props$theme4 = props.theme) === null || _props$theme4 === void 0 ? void 0 : _props$theme4.rtl) && (0, _styledComponents.css)(
|
|
145
|
+
return ((_props$theme4 = props.theme) === null || _props$theme4 === void 0 ? void 0 : _props$theme4.rtl) && (0, _styledComponents.css)(_templateObject29 || (_templateObject29 = _taggedTemplateLiteral(["\n margin-left: 10px;\n margin-right: 0;\n "])));
|
|
142
146
|
});
|
|
143
147
|
|
|
144
148
|
exports.WrapperDriver = WrapperDriver;
|
|
145
|
-
var OrderProducts = (0, _styledComponents.default)(OrderCustomer)(
|
|
149
|
+
var OrderProducts = (0, _styledComponents.default)(OrderCustomer)(_templateObject30 || (_templateObject30 = _taggedTemplateLiteral(["\n flex-direction: column;\n"])));
|
|
146
150
|
exports.OrderProducts = OrderProducts;
|
|
147
151
|
|
|
148
|
-
var OrderBill = _styledComponents.default.div(
|
|
152
|
+
var OrderBill = _styledComponents.default.div(_templateObject31 || (_templateObject31 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n margin-bottom: 25px;\n margin-top: 10px;\n table {\n width: 100%;\n font-size: 14px;\n td span {\n unicode-bidi: bidi-override;\n }\n tr td:nth-child(2) {\n text-align: right;\n ", "\n }\n }\n\n table.total {\n border-top: 1px solid #BFBFBF;\n margin-top: 15px;\n tr {\n font-size: 14px;\n td:nth-child(1) {\n font-weight: 600;\n font-size: 20px;\n padding-top: 10px;\n }\n td:nth-child(2) {\n font-weight: 600;\n font-size: 20px;\n padding-top: 10px;\n }\n }\n }\n\n table.comments {\n margin-top: 20px;\n align-items: center;\n tr {\n td:nth-child(1) {\n font-weight: bold;\n }\n }\n }\n\n @media (min-width: 678px) {\n table {\n font-size: 16px;\n }\n }\n"])), function (props) {
|
|
149
153
|
var _props$theme5;
|
|
150
154
|
|
|
151
|
-
return ((_props$theme5 = props.theme) === null || _props$theme5 === void 0 ? void 0 : _props$theme5.rtl) && (0, _styledComponents.css)(
|
|
155
|
+
return ((_props$theme5 = props.theme) === null || _props$theme5 === void 0 ? void 0 : _props$theme5.rtl) && (0, _styledComponents.css)(_templateObject32 || (_templateObject32 = _taggedTemplateLiteral(["\n text-align: left;\n "])));
|
|
152
156
|
});
|
|
153
157
|
|
|
154
158
|
exports.OrderBill = OrderBill;
|
|
155
159
|
|
|
156
|
-
var SkeletonBlock = _styledComponents.default.div(
|
|
160
|
+
var SkeletonBlock = _styledComponents.default.div(_templateObject33 || (_templateObject33 = _taggedTemplateLiteral(["\n width: ", ";\n border-radius: 16px;\n margin-bottom: 30px;\n display: flex;\n flex-direction: column;\n align-items: center;\n"])), function (_ref3) {
|
|
157
161
|
var width = _ref3.width;
|
|
158
162
|
return width && "".concat(width, "%");
|
|
159
163
|
});
|
|
160
164
|
|
|
161
165
|
exports.SkeletonBlock = SkeletonBlock;
|
|
162
166
|
|
|
163
|
-
var SkeletonBlockWrapp = _styledComponents.default.div(
|
|
167
|
+
var SkeletonBlockWrapp = _styledComponents.default.div(_templateObject34 || (_templateObject34 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-top: 20px;\n line-height: 40px;\n"])));
|
|
164
168
|
|
|
165
169
|
exports.SkeletonBlockWrapp = SkeletonBlockWrapp;
|
|
166
170
|
|
|
167
|
-
var ShareOrder = _styledComponents.default.div(
|
|
171
|
+
var ShareOrder = _styledComponents.default.div(_templateObject35 || (_templateObject35 = _taggedTemplateLiteral(["\n display: flex;\n margin: 0 0 20px;\n justify-content: space-between;\n z-index: 1;\n\n div.wrap {\n & > div:first-child {\n left: 0;\n }\n button {\n border-radius: 7.6px;\n }\n }\n \n h1 {\n font-size: 15px;\n margin: 0px;\n }\n\n p {\n font-size: 13px;\n margin: 0px;\n }\n\n button {\n display: flex;\n justify-content: center;\n position: relative;\n font-size: 14px;\n align-items: center;\n background: ", ";\n\n svg {\n left: 0;\n margin-right: 6px;\n color: ", ";\n }\n\n &:hover {\n svg {\n color: #FFFFFF;\n }\n }\n }\n\n div.text {\n width: 60%;\n }\n\n div.wrap {\n display: flex;\n align-items: center;\n\n & > div:first-child {\n width: 100%;\n position: relative;\n div {\n right: 0px;\n left: initial;\n top: 35px;\n }\n }\n }\n\n @media (min-width: 1201px) {\n div.wrap {\n & > div:first-child {\n left: 0;\n }\n }\n }\n\n @media (min-width: 768px) {\n div.wrap {\n width: 30%;\n & > div:first-child {\n left: 0;\n }\n }\n\n h1 {\n font-size: 20px;\n }\n\n p {\n font-size: 18px;\n }\n\n button {\n font-size: 18px;\n width: 100%;\n svg {\n position: absolute;\n margin-left: 10px;\n }\n }\n }\n\n @media (min-width: 425px) {\n div.text {\n width: 70%;\n }\n\n h1 {\n font-size: 18px;\n }\n\n p {\n font-size: 15px;\n }\n }\n"])), function (props) {
|
|
168
172
|
return props.theme.colors.backgroundPage;
|
|
169
173
|
}, function (props) {
|
|
170
174
|
return props.theme.colors.primary;
|
|
@@ -172,11 +176,11 @@ var ShareOrder = _styledComponents.default.div(_templateObject34 || (_templateOb
|
|
|
172
176
|
|
|
173
177
|
exports.ShareOrder = ShareOrder;
|
|
174
178
|
|
|
175
|
-
var MessagesIcon = _styledComponents.default.span(
|
|
179
|
+
var MessagesIcon = _styledComponents.default.span(_templateObject36 || (_templateObject36 = _taggedTemplateLiteral(["\n position: relative;\n cursor: pointer;\n"])));
|
|
176
180
|
|
|
177
181
|
exports.MessagesIcon = MessagesIcon;
|
|
178
182
|
|
|
179
|
-
var ExclamationWrapper = _styledComponents.default.div(
|
|
183
|
+
var ExclamationWrapper = _styledComponents.default.div(_templateObject37 || (_templateObject37 = _taggedTemplateLiteral(["\n position: absolute;\n transform: translate(75%, -25%);\n svg{\n font-size: 16px;\n color: ", "\n }\n"])), function (props) {
|
|
180
184
|
var _props$theme6, _props$theme6$colors;
|
|
181
185
|
|
|
182
186
|
return (_props$theme6 = props.theme) === null || _props$theme6 === void 0 ? void 0 : (_props$theme6$colors = _props$theme6.colors) === null || _props$theme6$colors === void 0 ? void 0 : _props$theme6$colors.primary;
|
|
@@ -184,71 +188,75 @@ var ExclamationWrapper = _styledComponents.default.div(_templateObject36 || (_te
|
|
|
184
188
|
|
|
185
189
|
exports.ExclamationWrapper = ExclamationWrapper;
|
|
186
190
|
|
|
187
|
-
var WrapperLeftContainer = _styledComponents.default.div(
|
|
191
|
+
var WrapperLeftContainer = _styledComponents.default.div(_templateObject38 || (_templateObject38 = _taggedTemplateLiteral(["\n width: 100%;\n box-sizing: border-box;\n"])));
|
|
188
192
|
|
|
189
193
|
exports.WrapperLeftContainer = WrapperLeftContainer;
|
|
190
|
-
var WrapperRightContainer = (0, _styledComponents.default)(WrapperLeftContainer)(
|
|
194
|
+
var WrapperRightContainer = (0, _styledComponents.default)(WrapperLeftContainer)(_templateObject39 || (_templateObject39 = _taggedTemplateLiteral([""])));
|
|
191
195
|
exports.WrapperRightContainer = WrapperRightContainer;
|
|
192
196
|
|
|
193
|
-
var Divider = _styledComponents.default.div(
|
|
197
|
+
var Divider = _styledComponents.default.div(_templateObject40 || (_templateObject40 = _taggedTemplateLiteral(["\n height: 8px;\n background: #F8F9FA;\n width: calc(100% + 40px);\n margin-left: -20px;\n\n @media(min-width: 769px) {\n width: calc(100% + 80px);\n margin-left: -40px;\n }\n"])));
|
|
194
198
|
|
|
195
199
|
exports.Divider = Divider;
|
|
196
200
|
|
|
197
|
-
var MyOrderActions = _styledComponents.default.div(
|
|
201
|
+
var MyOrderActions = _styledComponents.default.div(_templateObject41 || (_templateObject41 = _taggedTemplateLiteral([""])));
|
|
198
202
|
|
|
199
203
|
exports.MyOrderActions = MyOrderActions;
|
|
200
204
|
|
|
201
|
-
var ReviewWrapper = _styledComponents.default.div(
|
|
205
|
+
var ReviewWrapper = _styledComponents.default.div(_templateObject42 || (_templateObject42 = _taggedTemplateLiteral(["\n .review-sent {\n border-radius: 7.6px;\n }\n"])));
|
|
202
206
|
|
|
203
207
|
exports.ReviewWrapper = ReviewWrapper;
|
|
204
208
|
|
|
205
|
-
var Exclamation = _styledComponents.default.div(
|
|
209
|
+
var Exclamation = _styledComponents.default.div(_templateObject43 || (_templateObject43 = _taggedTemplateLiteral(["\n position: relative;\n display: inline-flex;\n cursor: pointer;\n margin-left: 5px;\n top: 3px;\n"])));
|
|
206
210
|
|
|
207
211
|
exports.Exclamation = Exclamation;
|
|
208
212
|
|
|
209
|
-
var CommentContainer = _styledComponents.default.div(
|
|
213
|
+
var CommentContainer = _styledComponents.default.div(_templateObject44 || (_templateObject44 = _taggedTemplateLiteral(["\n margin: 0;\n h3 {\n margin: 0;\n }\n"])));
|
|
210
214
|
|
|
211
215
|
exports.CommentContainer = CommentContainer;
|
|
212
216
|
|
|
213
|
-
var NewOrder = _styledComponents.default.div(
|
|
217
|
+
var NewOrder = _styledComponents.default.div(_templateObject45 || (_templateObject45 = _taggedTemplateLiteral(["\n button {\n width: 160px;\n }\n"])));
|
|
214
218
|
|
|
215
219
|
exports.NewOrder = NewOrder;
|
|
216
220
|
|
|
217
|
-
var OrderActions = _styledComponents.default.div(
|
|
221
|
+
var OrderActions = _styledComponents.default.div(_templateObject46 || (_templateObject46 = _taggedTemplateLiteral(["\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n"])));
|
|
218
222
|
|
|
219
223
|
exports.OrderActions = OrderActions;
|
|
220
224
|
|
|
221
|
-
var TitleContainer = _styledComponents.default.div(
|
|
225
|
+
var TitleContainer = _styledComponents.default.div(_templateObject47 || (_templateObject47 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 90%;\n margin: auto;\n button {\n display: flex;\n align-items: center;\n font-size: 14px;\n justify-content: space-around;\n min-width: 200px;\n max-height: 53px;\n }\n > h1 {\n text-align: center;\n }\n @media (min-width: 650px) {\n width: 50%;\n }\n"])));
|
|
222
226
|
|
|
223
227
|
exports.TitleContainer = TitleContainer;
|
|
224
228
|
|
|
225
|
-
var ReOrder = _styledComponents.default.div(
|
|
229
|
+
var ReOrder = _styledComponents.default.div(_templateObject48 || (_templateObject48 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n margin-top: 20px;\n margin-bottom: 20px;\n flex-direction: column;\n\n button {\n padding: 5px 16px;\n min-width: unset;\n margin: 5px 5px;\n\n @media (min-width: 650px) {\n margin: 0px 5px;\n }\n }\n\n @media (min-width: 650px) {\n flex-direction: row;\n }\n"])));
|
|
226
230
|
|
|
227
231
|
exports.ReOrder = ReOrder;
|
|
228
232
|
|
|
229
|
-
var BusinessTitle = _styledComponents.default.div(
|
|
233
|
+
var BusinessTitle = _styledComponents.default.div(_templateObject49 || (_templateObject49 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: space-between;\n"])));
|
|
230
234
|
|
|
231
235
|
exports.BusinessTitle = BusinessTitle;
|
|
232
|
-
var OrderPreferences = (0, _styledComponents.default)(OrderCustomer)(
|
|
236
|
+
var OrderPreferences = (0, _styledComponents.default)(OrderCustomer)(_templateObject50 || (_templateObject50 = _taggedTemplateLiteral([""])));
|
|
233
237
|
exports.OrderPreferences = OrderPreferences;
|
|
234
238
|
|
|
235
|
-
var HeaderTitle = _styledComponents.default.div(
|
|
239
|
+
var HeaderTitle = _styledComponents.default.div(_templateObject51 || (_templateObject51 = _taggedTemplateLiteral(["\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n h1{\n font-size: 20px;\n font-weight: 600;\n margin-bottom: 5px;\n }\n"])));
|
|
236
240
|
|
|
237
241
|
exports.HeaderTitle = HeaderTitle;
|
|
238
242
|
|
|
239
|
-
var PlaceSpotSection = _styledComponents.default.div(
|
|
243
|
+
var PlaceSpotSection = _styledComponents.default.div(_templateObject52 || (_templateObject52 = _taggedTemplateLiteral(["\n\n"])));
|
|
240
244
|
|
|
241
245
|
exports.PlaceSpotSection = PlaceSpotSection;
|
|
242
246
|
|
|
243
|
-
var
|
|
247
|
+
var OrderStatusAndLinkContainer = _styledComponents.default.div(_templateObject53 || (_templateObject53 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n\n @media (min-width: 450px) {\n flex-direction: row;\n }\n"])));
|
|
248
|
+
|
|
249
|
+
exports.OrderStatusAndLinkContainer = OrderStatusAndLinkContainer;
|
|
250
|
+
|
|
251
|
+
var LinkWrapper = _styledComponents.default.div(_templateObject54 || (_templateObject54 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
244
252
|
|
|
245
253
|
exports.LinkWrapper = LinkWrapper;
|
|
246
254
|
|
|
247
|
-
var OrderHistoryContainer = _styledComponents.default.div(
|
|
255
|
+
var OrderHistoryContainer = _styledComponents.default.div(_templateObject55 || (_templateObject55 = _taggedTemplateLiteral([""])));
|
|
248
256
|
|
|
249
257
|
exports.OrderHistoryContainer = OrderHistoryContainer;
|
|
250
258
|
|
|
251
|
-
var HistoryItemWrapper = _styledComponents.default.div(
|
|
259
|
+
var HistoryItemWrapper = _styledComponents.default.div(_templateObject56 || (_templateObject56 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n padding: 28px 23px;\n border-bottom: 1px solid ", ";\n\n > svg {\n width: 24px;\n height: 24px;\n color: ", ";\n }\n"])), function (props) {
|
|
252
260
|
return props.theme.colors.gray200;
|
|
253
261
|
}, function (props) {
|
|
254
262
|
return props.theme.colors.primary;
|
|
@@ -256,22 +264,22 @@ var HistoryItemWrapper = _styledComponents.default.div(_templateObject54 || (_te
|
|
|
256
264
|
|
|
257
265
|
exports.HistoryItemWrapper = HistoryItemWrapper;
|
|
258
266
|
|
|
259
|
-
var DetailWrapper = _styledComponents.default.div(
|
|
260
|
-
return props.theme.rtl && (0, _styledComponents.css)(
|
|
267
|
+
var DetailWrapper = _styledComponents.default.div(_templateObject57 || (_templateObject57 = _taggedTemplateLiteral(["\n margin-left: 50px;\n ", "\n\n h3 {\n font-weight: 600;\n font-size: 16px;\n line-height: 24px;\n margin: 0px;\n }\n p {\n font-weight: 400;\n font-size: 14px;\n line-height: 24px;\n margin: 0px;\n }\n"])), function (props) {
|
|
268
|
+
return props.theme.rtl && (0, _styledComponents.css)(_templateObject58 || (_templateObject58 = _taggedTemplateLiteral(["\n margin-left: 0px;\n margin-right: 50px;\n "])));
|
|
261
269
|
});
|
|
262
270
|
|
|
263
271
|
exports.DetailWrapper = DetailWrapper;
|
|
264
272
|
|
|
265
|
-
var ButtonWrapper = _styledComponents.default.div(
|
|
266
|
-
return props.theme.rtl && (0, _styledComponents.css)(
|
|
273
|
+
var ButtonWrapper = _styledComponents.default.div(_templateObject59 || (_templateObject59 = _taggedTemplateLiteral(["\n margin-top: 40px;\n button {\n width: 100%;\n height: 44px;\n position: relative;\n\n svg {\n position: absolute;\n top: 10px;\n font-size: 22px;\n right: 16px;\n ", "\n }\n }\n"])), function (props) {
|
|
274
|
+
return props.theme.rtl && (0, _styledComponents.css)(_templateObject60 || (_templateObject60 = _taggedTemplateLiteral(["\n left: 16px;\n right: initial;\n transform: rotate(180deg);\n "])));
|
|
267
275
|
});
|
|
268
276
|
|
|
269
277
|
exports.ButtonWrapper = ButtonWrapper;
|
|
270
278
|
|
|
271
|
-
var MapWrapper = _styledComponents.default.div(
|
|
279
|
+
var MapWrapper = _styledComponents.default.div(_templateObject61 || (_templateObject61 = _taggedTemplateLiteral(["\n width: 100%;\n margin-top: 20px;\n\n @media (min-width: 769px) {\n width: 50%;\n margin-top: 0px;\n }\n"])));
|
|
272
280
|
|
|
273
281
|
exports.MapWrapper = MapWrapper;
|
|
274
282
|
|
|
275
|
-
var BusinessExternalWrapper = _styledComponents.default.div(
|
|
283
|
+
var BusinessExternalWrapper = _styledComponents.default.div(_templateObject62 || (_templateObject62 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n width: 100%;\n\n @media (min-width: 769px) {\n width: 50%;\n }\n"])));
|
|
276
284
|
|
|
277
285
|
exports.BusinessExternalWrapper = BusinessExternalWrapper;
|
package/package.json
CHANGED
|
@@ -6,7 +6,11 @@ export const Container = styled.div`
|
|
|
6
6
|
display: flex;
|
|
7
7
|
flex-direction: column;
|
|
8
8
|
align-items: center;
|
|
9
|
-
margin:
|
|
9
|
+
margin: 45px 0 20px;
|
|
10
|
+
|
|
11
|
+
@media (min-width: 740px) {
|
|
12
|
+
margin: 20px 0;
|
|
13
|
+
}
|
|
10
14
|
`
|
|
11
15
|
|
|
12
16
|
export const WrapperContainer = styled.div`
|
|
@@ -70,9 +74,11 @@ export const OrderBusiness = styled.div`
|
|
|
70
74
|
|
|
71
75
|
export const BusinessWrapper = styled.div`
|
|
72
76
|
display: flex;
|
|
73
|
-
width:
|
|
77
|
+
width: 100%;
|
|
74
78
|
display: flex;
|
|
75
79
|
align-items: center;
|
|
80
|
+
flex-direction: column;
|
|
81
|
+
|
|
76
82
|
${props => props.borderBottom && css`
|
|
77
83
|
padding-bottom: 15px;
|
|
78
84
|
border-bottom: 1px solid ${props => props.theme.colors.lightGray};
|
|
@@ -85,32 +91,50 @@ export const BusinessWrapper = styled.div`
|
|
|
85
91
|
width: 100px;
|
|
86
92
|
height: 100px;
|
|
87
93
|
border-radius: 7.6px;
|
|
88
|
-
margin-right:
|
|
94
|
+
margin-right: 0;
|
|
95
|
+
|
|
96
|
+
@media (min-width: 400px) {
|
|
97
|
+
margin-right: 40px;
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
@media (min-width: 400px) {
|
|
102
|
+
flex-direction: row;
|
|
103
|
+
width: ${props => props.w ?? '100%'};
|
|
89
104
|
}
|
|
90
105
|
`
|
|
91
106
|
|
|
92
107
|
export const BtsOrderStatus = styled.div`
|
|
93
|
-
width: calc(100% - 20px);
|
|
94
108
|
display: flex;
|
|
95
|
-
flex-direction:
|
|
109
|
+
flex-direction: column;
|
|
96
110
|
justify-content: space-between;
|
|
97
111
|
align-items: center;
|
|
98
112
|
margin-top: 20px;
|
|
99
113
|
|
|
100
114
|
div + div {
|
|
101
|
-
margin-left:
|
|
115
|
+
margin-left: 0;
|
|
116
|
+
margin-top: 10px;
|
|
117
|
+
}
|
|
118
|
+
@media (min-width: 400px) {
|
|
119
|
+
flex-direction: row;
|
|
120
|
+
div + div {
|
|
121
|
+
margin-left: 30px;
|
|
122
|
+
margin-top: 0px;
|
|
123
|
+
}
|
|
102
124
|
}
|
|
103
125
|
`
|
|
104
126
|
|
|
105
127
|
export const BusinessInfo = styled.div`
|
|
106
128
|
width: 100%;
|
|
107
129
|
box-sizing: border-box;
|
|
108
|
-
margin-right:
|
|
130
|
+
margin-right: 0;
|
|
131
|
+
margin-top: 10px;
|
|
132
|
+
|
|
109
133
|
h1,
|
|
110
134
|
p {
|
|
111
135
|
margin: 0;
|
|
112
136
|
color: ${props => props.theme.colors.darkTextColor};
|
|
113
|
-
overflow-wrap:
|
|
137
|
+
overflow-wrap: anywhere;
|
|
114
138
|
}
|
|
115
139
|
|
|
116
140
|
h2 {
|
|
@@ -122,13 +146,17 @@ export const BusinessInfo = styled.div`
|
|
|
122
146
|
font-size: 14px;
|
|
123
147
|
margin-bottom: 5px;
|
|
124
148
|
}
|
|
149
|
+
|
|
150
|
+
@media (min-width: 400px) {
|
|
151
|
+
margin-right: 15px;
|
|
152
|
+
margin-top: 0;
|
|
153
|
+
}
|
|
125
154
|
`
|
|
126
155
|
|
|
127
156
|
export const ActionsBlock = styled.div`
|
|
128
157
|
display: flex;
|
|
129
158
|
align-items: center;
|
|
130
159
|
justify-content: flex-start;
|
|
131
|
-
flex-direction: column;
|
|
132
160
|
> * {
|
|
133
161
|
margin-right: 5px;
|
|
134
162
|
${props => props.theme?.rtl && css`
|
|
@@ -143,8 +171,6 @@ export const ActionsBlock = styled.div`
|
|
|
143
171
|
}
|
|
144
172
|
|
|
145
173
|
@media (min-width: 380px) {
|
|
146
|
-
flex-direction: row;
|
|
147
|
-
|
|
148
174
|
svg {
|
|
149
175
|
font-size: 20px;
|
|
150
176
|
}
|
|
@@ -185,7 +211,12 @@ export const OrderInfo = styled.div`
|
|
|
185
211
|
font-size: 16px;
|
|
186
212
|
}
|
|
187
213
|
`
|
|
188
|
-
|
|
214
|
+
export const OrderIdSec = styled.h1`
|
|
215
|
+
font-size: 25px !important;
|
|
216
|
+
@media (min-width: 350px) {
|
|
217
|
+
font-size: 32px !important;
|
|
218
|
+
}
|
|
219
|
+
`
|
|
189
220
|
export const ReviewOrderLink = styled.span`
|
|
190
221
|
margin: 0;
|
|
191
222
|
cursor: pointer;
|
|
@@ -201,7 +232,7 @@ export const ReviewOrderLink = styled.span`
|
|
|
201
232
|
}
|
|
202
233
|
`}
|
|
203
234
|
${({ isMargin }) => isMargin && css`
|
|
204
|
-
margin:
|
|
235
|
+
margin: 0 10px 0 0;
|
|
205
236
|
`}
|
|
206
237
|
`
|
|
207
238
|
|
|
@@ -553,7 +584,7 @@ export const TitleContainer = styled.div`
|
|
|
553
584
|
display: flex;
|
|
554
585
|
flex-direction: column;
|
|
555
586
|
align-items: center;
|
|
556
|
-
width:
|
|
587
|
+
width: 90%;
|
|
557
588
|
margin: auto;
|
|
558
589
|
button {
|
|
559
590
|
display: flex;
|
|
@@ -563,6 +594,12 @@ export const TitleContainer = styled.div`
|
|
|
563
594
|
min-width: 200px;
|
|
564
595
|
max-height: 53px;
|
|
565
596
|
}
|
|
597
|
+
> h1 {
|
|
598
|
+
text-align: center;
|
|
599
|
+
}
|
|
600
|
+
@media (min-width: 650px) {
|
|
601
|
+
width: 50%;
|
|
602
|
+
}
|
|
566
603
|
`
|
|
567
604
|
|
|
568
605
|
export const ReOrder = styled.div`
|
|
@@ -570,11 +607,20 @@ export const ReOrder = styled.div`
|
|
|
570
607
|
align-items: center;
|
|
571
608
|
margin-top: 20px;
|
|
572
609
|
margin-bottom: 20px;
|
|
610
|
+
flex-direction: column;
|
|
573
611
|
|
|
574
612
|
button {
|
|
575
613
|
padding: 5px 16px;
|
|
576
614
|
min-width: unset;
|
|
577
|
-
margin:
|
|
615
|
+
margin: 5px 5px;
|
|
616
|
+
|
|
617
|
+
@media (min-width: 650px) {
|
|
618
|
+
margin: 0px 5px;
|
|
619
|
+
}
|
|
620
|
+
}
|
|
621
|
+
|
|
622
|
+
@media (min-width: 650px) {
|
|
623
|
+
flex-direction: row;
|
|
578
624
|
}
|
|
579
625
|
`
|
|
580
626
|
|
|
@@ -600,10 +646,19 @@ export const HeaderTitle = styled.div`
|
|
|
600
646
|
export const PlaceSpotSection = styled.div`
|
|
601
647
|
|
|
602
648
|
`
|
|
649
|
+
export const OrderStatusAndLinkContainer = styled.div`
|
|
650
|
+
display: flex;
|
|
651
|
+
flex-direction: column;
|
|
652
|
+
justify-content: space-between;
|
|
603
653
|
|
|
654
|
+
@media (min-width: 450px) {
|
|
655
|
+
flex-direction: row;
|
|
656
|
+
}
|
|
657
|
+
`
|
|
604
658
|
export const LinkWrapper = styled.div`
|
|
605
659
|
display: flex;
|
|
606
660
|
align-items: center;
|
|
661
|
+
justify-content: space-between;
|
|
607
662
|
`
|
|
608
663
|
|
|
609
664
|
export const OrderHistoryContainer = styled.div``
|