@salesgenterp/ui-components 0.3.52 → 0.3.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/index.js CHANGED
@@ -192,7 +192,7 @@ var CartPageSection = styled.section(_templateObject$2 || (_templateObject$2 = _
192
192
  }, function (props) {
193
193
  return props.bg || '#FAE8E5';
194
194
  });
195
- var CartPageContainer = styled.div(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: ", ";\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n border-radius: 28px 28px 28px 14px;\n\n padding-right: max(5vw, 1em);\n padding-left: max(5vw, 1em);\n padding-top: max(5vw, 1em);\n padding-bottom: max(5vw, 1em);\n border-radius: 28px;\n opacity: ", ";\n .scrollDiv {\n width: 68%;\n height: 630px;\n max-height: 630px;\n /* background-color: white; */\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n margin: 5px 2px;\n border: 3px solid;\n border-color: ", ";\n }\n box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05);\n }\n @media only screen and (max-width: 1340px) {\n flex-direction: column;\n align-items: center;\n padding: 0.5em 0;\n .scrollDiv {\n width: 100%;\n margin: 0;\n margin-bottom: 2em;\n padding: 0 0.4em;\n }\n }\n"])), function (props) {
195
+ var CartPageContainer = styled.div(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: ", ";\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n border-radius: 28px 28px 28px 14px;\n padding: 3em 2em;\n border-radius: 28px;\n opacity: ", ";\n .scrollDiv {\n width: 68%;\n height: 630px;\n max-height: 630px;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n margin: 5px 2px;\n border: 3px solid;\n border-color: ", ";\n }\n /* box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05); */\n }\n @media only screen and (max-width: 1340px) {\n flex-direction: column;\n align-items: center;\n padding: 0.5em;\n .scrollDiv {\n width: 100%;\n margin: 0;\n margin-bottom: 2em;\n padding: 0 0.4em;\n }\n }\n"])), function (props) {
196
196
  return props.maxWidth || '1450px';
197
197
  }, function (props) {
198
198
  return props.loading ? '0.7' : 1;
@@ -208,11 +208,11 @@ var CartPageContainer = styled.div(_templateObject2$2 || (_templateObject2$2 = _
208
208
  var CardsBox = styled.div(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteralLoose(["\n width: 100%;\n /* min-height: 1000px; */\n position: relative;\n max-width: 860px;\n margin-right: auto;\n padding: 1em 2em;\n display: ", ";\n grid-template-columns: 1fr 1fr;\n flex-direction: column;\n align-items: flex-start;\n grid-gap: 1em;\n justify-content: flex-start;\n align-items: center;\n border-radius: 20px;\n @media only screen and (max-width: 960px) {\n display: flex;\n }\n @media only screen and (max-width: 640px) {\n padding: 1em 0.2em;\n }\n"])), function (props) {
209
209
  return props.retail ? 'grid' : 'flex';
210
210
  });
211
- var Loader = styled.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 40%;\n left: 47%;\n display: grid;\n place-items: center;\n z-index: 1;\n"])));
211
+ var Loader = styled.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 40%;\n left: 47%;\n display: grid;\n place-items: center;\n z-index: 3;\n"])));
212
212
  var CartTableCell = styled(material.TableCell)(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n padding-bottom: 1em !important;\n border: none !important;\n background: ", ";\n"])), function (props) {
213
213
  return props.bg + " !important";
214
214
  });
215
- var CartTableContainer = styled(material.TableContainer)(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n padding-right: 2em;\n\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n background: ", ";\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n border-radius: 16px;\n margin: 5px 2px;\n background: ", ";\n }\n @media screen and (max-width: 750px) {\n padding: 0;\n }\n"])), function (props) {
215
+ var CartTableContainer = styled(material.TableContainer)(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n min-height: 400px;\n padding-right: 2em;\n\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n background: ", ";\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n border-radius: 16px;\n margin: 5px 2px;\n background: ", ";\n }\n @media screen and (max-width: 750px) {\n padding: 0;\n }\n"])), function (props) {
216
216
  return props.retail ? '12px' : '8px';
217
217
  }, function (props) {
218
218
  return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
@@ -1329,8 +1329,8 @@ if (process.env.NODE_ENV !== 'production') {
1329
1329
 
1330
1330
  var _templateObject$3, _templateObject2$3, _templateObject3$3, _templateObject4$2, _templateObject5$2, _templateObject6$2;
1331
1331
  var ProductImage = styled.img(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n min-width: 50px;\n min-height: 58px;\n @media only screen and (max-width: 640px) {\n margin: 0.5em 0;\n padding-right: 0.5em;\n }\n"])));
1332
- var ProductName = styled.h6(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n font-size: 1em;\n line-height: 1.6em;\n max-height: 1.6em;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-bottom: auto;\n @media only screen and (max-width: 740px) {\n max-height: 3.8em;\n line-height: 1.25em;\n /* font-size: 0.75rem; */\n }\n"])));
1333
- var CartTableRow = styled(material.TableRow)(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose(["\n position: relative;\n transition: 0.3s;\n background: white;\n .outOfStock {\n font-size: 0.75em;\n color: red;\n text-transform: uppercase;\n font-weight: 500;\n }\n .price {\n font-size: 1.19em;\n font-weight: bold;\n color: #323232;\n }\n .borderLeft {\n height: 100%;\n width: 0;\n background: #fd0015;\n transition: 0.2s;\n width: 0px;\n position: absolute;\n left: 0;\n top: 0;\n border-top-left-radius: 10px;\n display: none;\n border-bottom-left-radius: 10px;\n }\n &:hover {\n background: white !important;\n opacity: 1;\n box-shadow: 1px 2px 6px 2px rgba(0, 0, 0, 0.2);\n z-index: 2;\n border-radius: 20px;\n .borderLeft {\n width: 13px;\n display: inline-block;\n }\n }\n @media only screen and (max-width: 640px) {\n .CartnoPaddingSm {\n padding: 0 !important;\n }\n .price {\n font-size: 0.8rem;\n }\n margin: 0.5em 0;\n .cartCheckBox {\n .css-i4bv87-MuiSvgIcon-root {\n font-size: 10px !important;\n }\n }\n }\n"])));
1332
+ var ProductName = styled.h6(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n font-size: 1em;\n line-height: 1.6em;\n max-height: 1.6em;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-bottom: auto;\n @media only screen and (max-width: 740px) {\n max-height: 3.8em;\n line-height: 1.25em;\n /* font-size: 0.75em0.8em; */\n }\n"])));
1333
+ var CartTableRow = styled(material.TableRow)(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose(["\n position: relative;\n transition: 0.3s;\n background: white;\n .outOfStock {\n font-size: 0.75em;\n color: red;\n text-transform: uppercase;\n font-weight: 500;\n }\n .price {\n font-size: 1.19em;\n font-weight: bold;\n color: #323232;\n }\n .borderLeft {\n height: 100%;\n width: 0;\n background: #fd0015;\n transition: 0.2s;\n width: 0px;\n position: absolute;\n left: 0;\n top: 0;\n border-top-left-radius: 10px;\n display: none;\n border-bottom-left-radius: 10px;\n }\n &:hover {\n background: white !important;\n opacity: 1;\n box-shadow: 1px 2px 6px 2px rgba(0, 0, 0, 0.2);\n z-index: 2;\n border-radius: 20px;\n .borderLeft {\n width: 13px;\n display: inline-block;\n }\n }\n @media only screen and (max-width: 640px) {\n .CartnoPaddingSm {\n padding: 0 !important;\n }\n .price {\n font-size: 0.8em;\n }\n margin: 0.5em 0;\n .cartCheckBox {\n .css-i4bv87-MuiSvgIcon-root {\n font-size: 10px !important;\n }\n }\n }\n"])));
1334
1334
  var CartTableCell$1 = styled(material.TableCell)(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteralLoose(["\n border: none !important;\n"])));
1335
1335
  var QuantityBox = styled.div(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n height: 1.75em;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n div {\n /* width:30px; */\n height: 100%;\n aspect-ratio: 1.1/1;\n display: grid;\n place-items: center;\n font-size: 0.75em;\n color: white;\n background-color: #323232;\n cursor: pointer;\n }\n .price {\n background: transparent;\n cursor: auto;\n p {\n color: #5e5c5c;\n font-size: 0.685em;\n font-weight: 500;\n }\n }\n .add {\n background-color: #ebebeb;\n color: #323232;\n }\n"])));
1336
1336
  var DeleteBtn = styled.div(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteralLoose(["\n display: grid;\n place-items: center;\n cursor: pointer;\n border-radius: 50%;\n width: 20px;\n height: 20px;\n background: #eef1f4;\n color: #393f48;\n font-size: 0.75em;\n transition: 0.4s;\n &:hover {\n background: red;\n color: white;\n }\n"])));
@@ -1350,15 +1350,13 @@ var CardRow = function CardRow(_ref) {
1350
1350
  var imgnotfoundUrlcommon = '/images/imgnotfound.jpeg';
1351
1351
  if (imgnotfoundUrl && imgnotfoundUrl !== 'null') imgnotfoundUrlcommon = imgnotfoundUrl;
1352
1352
  return /*#__PURE__*/React__default.createElement(CartTableRow, {
1353
- hover: true,
1354
1353
  onClick: function onClick(event) {
1355
- return handleClick(event, row.productId);
1354
+ return handleClick(event, row);
1356
1355
  },
1357
1356
  role: "checkbox",
1358
1357
  "aria-checked": isItemSelected,
1359
1358
  tabIndex: -1,
1360
- key: row.ProductId,
1361
- selected: isItemSelected
1359
+ key: row.ProductId
1362
1360
  }, /*#__PURE__*/React__default.createElement(CartTableCell$1, {
1363
1361
  padding: "checkbox"
1364
1362
  }, /*#__PURE__*/React__default.createElement("span", {
@@ -1486,11 +1484,11 @@ function EnhancedTableHead(props) {
1486
1484
  };
1487
1485
 
1488
1486
  return /*#__PURE__*/React.createElement(TableHead, {
1489
- className: "CartnoBelowSm",
1490
- sx: {
1491
- zIndex: '2'
1492
- }
1487
+ className: "CartnoBelowSm"
1493
1488
  }, /*#__PURE__*/React.createElement(TableRow, null, /*#__PURE__*/React.createElement(CartTableCell, {
1489
+ sx: {
1490
+ zIndex: '3 !important'
1491
+ },
1494
1492
  padding: "checkbox",
1495
1493
  bg: styles.bg
1496
1494
  }, /*#__PURE__*/React.createElement(material.Checkbox, {
@@ -1508,7 +1506,8 @@ function EnhancedTableHead(props) {
1508
1506
  padding: headCell.disablePadding ? 'none' : 'normal',
1509
1507
  sortDirection: orderBy === headCell.id ? order : false,
1510
1508
  sx: {
1511
- textTransform: 'uppercase'
1509
+ textTransform: 'uppercase',
1510
+ zIndex: '3 !important'
1512
1511
  },
1513
1512
  className: (headCell === null || headCell === void 0 ? void 0 : headCell.noBelowSm) && 'CartnoBelowSm',
1514
1513
  bg: styles.bg
@@ -1560,7 +1559,6 @@ function EnhancedTable(_ref) {
1560
1559
  setCartArray = _React$useState4[1];
1561
1560
 
1562
1561
  var Sort = function Sort() {
1563
- console.log(orderBy, order);
1564
1562
  var newArray = cartArray || [];
1565
1563
  var li = orderBy;
1566
1564
 
@@ -1588,15 +1586,10 @@ function EnhancedTable(_ref) {
1588
1586
  };
1589
1587
 
1590
1588
  var handleSelectAllClick = function handleSelectAllClick(event) {
1591
- console.log(event.target.checked, 'checked');
1592
-
1593
1589
  if (selected.length < (cartArray === null || cartArray === void 0 ? void 0 : cartArray.length)) {
1594
1590
  var newSelected = [];
1595
1591
  cartArray === null || cartArray === void 0 ? void 0 : cartArray.map(function (n) {
1596
- return newSelected.push(n.productId);
1597
- });
1598
- console.log({
1599
- newSelected: newSelected
1592
+ return newSelected.push(n);
1600
1593
  });
1601
1594
  setSelected(newSelected);
1602
1595
  return;
@@ -1605,20 +1598,16 @@ function EnhancedTable(_ref) {
1605
1598
  setSelected([]);
1606
1599
  };
1607
1600
 
1608
- var handleClick = function handleClick(event, id) {
1609
- console.log(id, 'id');
1610
- var includes = selected.includes(id);
1601
+ var handleClick = function handleClick(event, product) {
1602
+ var includes = selected.includes(product.productId);
1611
1603
 
1612
1604
  if (includes) {
1613
- var removedId = selected.filter(function (product) {
1614
- return product !== id;
1615
- });
1616
- console.log({
1617
- removedId: removedId
1605
+ var removedId = selected.filter(function (item) {
1606
+ return item.Id !== (product === null || product === void 0 ? void 0 : product.productId);
1618
1607
  });
1619
1608
  setSelected(removedId);
1620
1609
  } else {
1621
- setSelected([].concat(selected, [id]));
1610
+ setSelected([].concat(selected, [product]));
1622
1611
  }
1623
1612
  };
1624
1613
 
@@ -1654,7 +1643,7 @@ function EnhancedTable(_ref) {
1654
1643
  rowCount: cartArray === null || cartArray === void 0 ? void 0 : cartArray.length,
1655
1644
  styles: styles
1656
1645
  }), /*#__PURE__*/React.createElement(TableBody, null, cartArray === null || cartArray === void 0 ? void 0 : cartArray.map(function (row, index) {
1657
- var isItemSelected = isSelected(row.productId);
1646
+ var isItemSelected = isSelected(row);
1658
1647
  return /*#__PURE__*/React.createElement(CardRow, {
1659
1648
  row: row,
1660
1649
  isItemSelected: isItemSelected,
@@ -1670,14 +1659,14 @@ function EnhancedTable(_ref) {
1670
1659
  }
1671
1660
 
1672
1661
  var _templateObject$4, _templateObject2$4, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$3, _templateObject7$2;
1673
- var CartPageCard = styled.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n width: min(97%, 485px);\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding: 1rem;\n background: #ffffff;\n box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05);\n border-radius: 20px;\n position: relative;\n"])));
1662
+ var CartPageCard = styled.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n width: min(97%, 485px);\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding: 1em;\n background: #ffffff;\n box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05);\n border-radius: 20px;\n position: relative;\n"])));
1674
1663
  var CartPageImg = styled.img(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n /* width: 95px; */\n width: ", ";\n height: ", ";\n position: relative;\n margin-right: 1em;\n"])), function (props) {
1675
1664
  return props.width || 'auto';
1676
1665
  }, function (props) {
1677
1666
  return props.height || '81px';
1678
1667
  });
1679
1668
  var NameAndQtBox = styled.div(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n width: 90%;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: space-between;\n position: relative;\n"])));
1680
- var CartPageCardName = styled.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n width: 90%;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-bottom: 0.6em;\n h6 {\n color: #323232;\n font-size: 0.9em;\n margin-bottom: 0.6em;\n line-height: 1.3rem;\n max-height: 1.4rem;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n p {\n font-size: 1.1em;\n color: #c3c6c9;\n }\n"])));
1669
+ var CartPageCardName = styled.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n width: 90%;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-bottom: 0.6em;\n h6 {\n color: #323232;\n font-size: 0.9em;\n margin-bottom: 0.6em;\n line-height: 1.3em;\n max-height: 1.4em;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n p {\n font-size: 1.1em;\n color: #c3c6c9;\n }\n"])));
1681
1670
  var QtAndPriceBox = styled.div(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n .subtotal {\n color: #323232;\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.85em;\n }\n"])));
1682
1671
  var CartPageQtBox = styled.div(_templateObject6$3 || (_templateObject6$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n max-width: 80px;\n min-width: 80px;\n height: 22px;\n .icon {\n width: 20.5px;\n height: 20.5px;\n display: grid;\n place-items: center;\n font-size: 10px;\n background: #eef1f4;\n cursor: pointer;\n }\n .qt {\n font-size: 18px;\n font-weight: 500;\n display: grid;\n place-items: center;\n color: #c3c6c9;\n }\n"])));
1683
1672
  var CloseBtn = styled.div(_templateObject7$2 || (_templateObject7$2 = _taggedTemplateLiteralLoose(["\n width: 25px;\n height: 25px;\n display: grid;\n place-items: center;\n position: absolute;\n top: 1em;\n right: 1em;\n cursor: pointer;\n border-radius: 50%;\n background: #eef1f4;\n font-size: 12px;\n"])));
@@ -1774,10 +1763,10 @@ var CartSummaryRow = styled.div(_templateObject2$5 || (_templateObject2$5 = _tag
1774
1763
  var CartSummaryHr = styled.span(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteralLoose(["\n border: none;\n width: 100%;\n height: 1px;\n background-color: ", ";\n margin: 1em 0;\n"])), function (props) {
1775
1764
  return props.color || 'rgba(255, 255, 255, 0.5)';
1776
1765
  });
1777
- var CartSummaryInputBox = styled.form(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding-bottom: ", ";\n input {\n width: 10.81rem;\n height: 2.44rem;\n padding: 0.2em 0.8em;\n text-transform: capitalize;\n font-size: 0.89em;\n border-radius: ", ";\n margin-right: ", ";\n border: none;\n outline: none;\n background: ", ";\n color: ", ";\n &::placeholder {\n color: ", ";\n }\n }\n button {\n width: 7.75rem;\n height: 2.44rem;\n background: ", ";\n border-radius: ", ";\n display: grid;\n color: ", ";\n place-items: center;\n border: none;\n outline: none;\n text-transform: uppercase;\n cursor: pointer;\n font-size: 0.75em;\n transition: 0.3s;\n &:hover {\n letter-spacing: 1px;\n }\n }\n"])), function (props) {
1766
+ var CartSummaryInputBox = styled.form(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding-bottom: ", ";\n input {\n width: 10.81em;\n height: 2.44em;\n padding: 0.2em 0.8em;\n text-transform: capitalize;\n font-size: 0.89em;\n border-radius: ", ";\n margin-right: ", ";\n border: none;\n outline: none;\n background: ", ";\n color: ", ";\n &::placeholder {\n color: ", ";\n }\n }\n button {\n width: 7.75em;\n height: 2.44em;\n background: ", ";\n border-radius: ", ";\n display: grid;\n color: ", ";\n place-items: center;\n border: none;\n outline: none;\n text-transform: uppercase;\n cursor: pointer;\n font-size: 0.75em;\n transition: 0.3s;\n &:hover {\n letter-spacing: 1px;\n }\n }\n"])), function (props) {
1778
1767
  return props.paddingBottom ? '2em' : '0';
1779
1768
  }, function (props) {
1780
- return props.retail ? '1.19rem' : '0';
1769
+ return props.retail ? '1.19em' : '0';
1781
1770
  }, function (props) {
1782
1771
  return props.retail ? '1em' : '0';
1783
1772
  }, function (props) {
@@ -1789,7 +1778,7 @@ var CartSummaryInputBox = styled.form(_templateObject4$4 || (_templateObject4$4
1789
1778
  }, function (props) {
1790
1779
  return props.btn || '#393f48';
1791
1780
  }, function (props) {
1792
- return props.retail ? '1.19rem' : 0;
1781
+ return props.retail ? '1.19em' : 0;
1793
1782
  }, function (props) {
1794
1783
  return props.Btncolor || 'inherit';
1795
1784
  });