@bonlineza/luxity-lib 2.9.2 → 2.10.0
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/AddInterest.js +125 -72
- package/BrandSelector.js +78 -25
- package/GraphQLMultiSelector.js +69 -16
- package/Interests.js +153 -97
- package/LuxityGraphQLMultiselector.js +74 -21
- package/LuxityLoader.js +75 -0
- package/LuxityPageReady.js +72 -6
- package/NotificationDropDown.js +65 -9
- package/README.md +3 -0
- package/StyleSelector.js +78 -25
- package/build/bundle.js +153 -97
- package/package.json +1 -1
- package/svg/LuxityArrowLeft.js +28 -0
- package/svg/LuxityArrowRight.js +28 -0
package/Interests.js
CHANGED
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('react-notify-toast'), require('@bonlineza/b-lib/
|
|
3
|
-
typeof define === 'function' && define.amd ? define(['react', 'styled-components', 'react-notify-toast', '@bonlineza/b-lib/
|
|
4
|
-
(global = global || self, global.Interests = factory(global.React, global.styled, global['react-notify-toast'], global.
|
|
5
|
-
}(this, (function (React, styled, Notifications,
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('react-notify-toast'), require('@bonlineza/b-lib/PageReady'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('numeral')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define(['react', 'styled-components', 'react-notify-toast', '@bonlineza/b-lib/PageReady', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'numeral'], factory) :
|
|
4
|
+
(global = global || self, global.Interests = factory(global.React, global.styled, global['react-notify-toast'], global.PageReady, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global.numeral));
|
|
5
|
+
}(this, (function (React, styled, Notifications, PageReady, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, numeral) { 'use strict';
|
|
6
6
|
|
|
7
7
|
var React__default = 'default' in React ? React['default'] : React;
|
|
8
8
|
var styled__default = 'default' in styled ? styled['default'] : styled;
|
|
9
9
|
var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
|
|
10
|
-
EllipsisLoader = EllipsisLoader && Object.prototype.hasOwnProperty.call(EllipsisLoader, 'default') ? EllipsisLoader['default'] : EllipsisLoader;
|
|
11
10
|
PageReady = PageReady && Object.prototype.hasOwnProperty.call(PageReady, 'default') ? PageReady['default'] : PageReady;
|
|
12
11
|
stylisRuleSheet = stylisRuleSheet && Object.prototype.hasOwnProperty.call(stylisRuleSheet, 'default') ? stylisRuleSheet['default'] : stylisRuleSheet;
|
|
13
12
|
PropTypes = PropTypes && Object.prototype.hasOwnProperty.call(PropTypes, 'default') ? PropTypes['default'] : PropTypes;
|
|
@@ -446,6 +445,57 @@
|
|
|
446
445
|
return message.replace(':error_code', error.status || 'Network Down');
|
|
447
446
|
};
|
|
448
447
|
|
|
448
|
+
var LuxityArrowLeft = (function (props) {
|
|
449
|
+
return /*#__PURE__*/React__default.createElement("svg", {
|
|
450
|
+
version: "1.0",
|
|
451
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
452
|
+
width: props.width || '100%',
|
|
453
|
+
height: props.height || '100%',
|
|
454
|
+
viewBox: "0 0 177.000000 300.000000",
|
|
455
|
+
preserveAspectRatio: "xMidYMid meet"
|
|
456
|
+
}, /*#__PURE__*/React__default.createElement("g", {
|
|
457
|
+
transform: "translate(0.000000,300.000000) scale(0.100000,-0.100000)",
|
|
458
|
+
fill: "#000000",
|
|
459
|
+
stroke: "none"
|
|
460
|
+
}, /*#__PURE__*/React__default.createElement("path", {
|
|
461
|
+
d: "M808 2628 c-139 -205 -377 -557 -530 -781 l-277 -409 48 -71 c363\n-539 905 -1335 915 -1345 9 -9 90 -12 362 -10 l351 3 -350 515 c-192 283 -409\n603 -482 711 l-134 197 386 568 c212 313 450 665 529 782 l145 212 -355 0\n-355 0 -253 -372z"
|
|
462
|
+
})));
|
|
463
|
+
});
|
|
464
|
+
|
|
465
|
+
var LuxityArrowRight = (function (props) {
|
|
466
|
+
return /*#__PURE__*/React__default.createElement("svg", {
|
|
467
|
+
version: "1.0",
|
|
468
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
469
|
+
width: props.width || '100%',
|
|
470
|
+
height: props.height || '100%',
|
|
471
|
+
viewBox: "0 0 177.000000 300.000000",
|
|
472
|
+
preserveAspectRatio: "xMidYMid meet"
|
|
473
|
+
}, /*#__PURE__*/React__default.createElement("g", {
|
|
474
|
+
transform: "translate(0.000000,300.000000) scale(0.100000,-0.100000)",
|
|
475
|
+
fill: "#000000",
|
|
476
|
+
stroke: "none"
|
|
477
|
+
}, /*#__PURE__*/React__default.createElement("path", {
|
|
478
|
+
d: "M106 2973 c9 -16 226 -336 481 -711 255 -376 465 -687 466 -691 1 -4\n-233 -355 -520 -779 -288 -424 -523 -773 -523 -776 0 -3 159 -6 353 -5 l352 0\n525 776 c289 427 524 780 522 785 -1 5 -219 328 -484 719 l-481 709 -355 0\n-354 0 18 -27z"
|
|
479
|
+
})));
|
|
480
|
+
});
|
|
481
|
+
|
|
482
|
+
var _templateObject$1, _templateObject2, _templateObject3;
|
|
483
|
+
var LoaderContainer = styled__default.div(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: space-between;\n margin: 20px auto;\n"])));
|
|
484
|
+
var LeftImageContainer = styled__default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: flex-start;\n width: 100%;\n height: 100%;\n object-fit: contain;\n animation: slide-left infinite 3s;\n background-color: white;\n\n @keyframes slide-left {\n 0% {\n transform: translateX(0);\n }\n 40% {\n transform: translateX(50%);\n }\n 100% {\n transform: translateX(150%);\n }\n }\n"])));
|
|
485
|
+
var RightImageContainer = styled__default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: flex-end;\n width: 100%;\n height: 100%;\n object-fit: contain;\n animation: slide-right infinite 3s;\n\n @keyframes slide-right {\n 0% {\n transform: translateX(0);\n }\n 40% {\n transform: translateX(-50%);\n opacity: 1;\n }\n 100% {\n transform: translateX(-150%);\n opacity: 0;\n }\n }\n"])));
|
|
486
|
+
|
|
487
|
+
function LuxityLoader(_ref) {
|
|
488
|
+
var width = _ref.width,
|
|
489
|
+
height = _ref.height;
|
|
490
|
+
return /*#__PURE__*/React__default.createElement(LoaderContainer, null, /*#__PURE__*/React__default.createElement(LeftImageContainer, null, /*#__PURE__*/React__default.createElement(LuxityArrowRight, {
|
|
491
|
+
width: width,
|
|
492
|
+
height: height
|
|
493
|
+
})), /*#__PURE__*/React__default.createElement(RightImageContainer, null, /*#__PURE__*/React__default.createElement(LuxityArrowLeft, {
|
|
494
|
+
width: width,
|
|
495
|
+
height: height
|
|
496
|
+
})));
|
|
497
|
+
}
|
|
498
|
+
|
|
449
499
|
var LuxityPageReadyContext = /*#__PURE__*/React__default.createContext({
|
|
450
500
|
data: null
|
|
451
501
|
});
|
|
@@ -521,7 +571,10 @@
|
|
|
521
571
|
customErrorMessage: customErrorMessage,
|
|
522
572
|
customErrorHandler: customErrorHandler,
|
|
523
573
|
renderCustomLoader: function renderCustomLoader() {
|
|
524
|
-
return /*#__PURE__*/React__default.createElement(
|
|
574
|
+
return /*#__PURE__*/React__default.createElement(LuxityLoader, {
|
|
575
|
+
height: "40px",
|
|
576
|
+
width: "95%"
|
|
577
|
+
});
|
|
525
578
|
},
|
|
526
579
|
errorMessageInterpreter: interpretErrorMessage
|
|
527
580
|
}, /*#__PURE__*/React__default.createElement(LuxityPageReadyContext.Provider, {
|
|
@@ -7108,8 +7161,8 @@
|
|
|
7108
7161
|
|
|
7109
7162
|
var index$1 = manageState(Select);
|
|
7110
7163
|
|
|
7111
|
-
var _templateObject$
|
|
7112
|
-
var NotifyContainer = styled__default.div(_templateObject$
|
|
7164
|
+
var _templateObject$2;
|
|
7165
|
+
var NotifyContainer = styled__default.div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n .page-ready {\n display: flex;\n align-items: center;\n }\n\n .loader {\n min-width: 150px;\n }\n\n .notification-dropdown-select-container {\n min-width: 150px;\n\n .notification-dropdown-select__control {\n min-height: auto;\n background-color: ", ";\n border: none;\n border-radius: 0;\n\n &--is-focused {\n border: none;\n border-radius: 0;\n box-shadow: none;\n }\n\n .notification-dropdown-select__value-container {\n & > div {\n padding: 0;\n margin: 0;\n color: ", ";\n }\n & .notification-dropdown-select__single-value,\n & .notification-dropdown-select__placeholder {\n overflow: visible;\n font-weight: lighter;\n }\n }\n }\n }\n\n .notification-dropdown-select__indicators {\n padding: 0 !important;\n .notification-dropdown-select__dropdown-indicator {\n color: ", ";\n }\n }\n\n .notification-dropdown-select__menu {\n border-radius: 0;\n\n & > .notification-dropdown-select__menu-list {\n border-radius: 0;\n\n & > .notification-dropdown-select__option {\n font-weight: bold;\n &:last-child {\n border-bottom: none;\n }\n\n &.notification-dropdown-select__option--is-focused {\n background-color: ", ";\n border-style: hidden;\n }\n &.notification-dropdown-select__option--is-selected {\n color: ", ";\n background-color: ", ";\n border-style: hidden;\n }\n &.notification-dropdown-select__option--is-selected.notification-dropdown-select__option--is-focused {\n border-style: hidden;\n }\n }\n }\n }\n"])), function (props) {
|
|
7113
7166
|
return props.theme.colors.ntrlMin;
|
|
7114
7167
|
}, function (props) {
|
|
7115
7168
|
return props.theme.colors.base;
|
|
@@ -7231,7 +7284,10 @@
|
|
|
7231
7284
|
}
|
|
7232
7285
|
}, /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
|
|
7233
7286
|
className: "notification-dropdown-label"
|
|
7234
|
-
}, "Notification:\xA0"), updating ? /*#__PURE__*/React__default.createElement(
|
|
7287
|
+
}, "Notification:\xA0"), updating ? /*#__PURE__*/React__default.createElement(LuxityLoader, {
|
|
7288
|
+
height: "20px",
|
|
7289
|
+
width: "95%"
|
|
7290
|
+
}) : /*#__PURE__*/React__default.createElement(index$1, {
|
|
7235
7291
|
isMulti: false,
|
|
7236
7292
|
isSearchable: false,
|
|
7237
7293
|
components: {
|
|
@@ -7310,8 +7366,8 @@
|
|
|
7310
7366
|
APPAREL: 100000
|
|
7311
7367
|
};
|
|
7312
7368
|
|
|
7313
|
-
var _templateObject$
|
|
7314
|
-
var SvgWrapper = styled__default.div(_templateObject$
|
|
7369
|
+
var _templateObject$3;
|
|
7370
|
+
var SvgWrapper = styled__default.div(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n padding: ", ";\n border: 1px solid\n ", ";\n text-align: center;\n display: flex;\n flex-flow: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;\n background-color: ", ";\n color: ", ";\n\n h1 {\n color: ", ";\n }\n\n svg {\n margin-left: auto;\n margin-right: auto;\n max-height: 80px;\n width: auto;\n /*condition*/\n\n .fillColor {\n fill: ", ";\n }\n\n .outlineColor {\n fill: ", ";\n }\n }\n @media (max-width: ", ") {\n margin-bottom: ", ";\n }\n"])), function (props) {
|
|
7315
7371
|
return props.theme.marginPaddings[4];
|
|
7316
7372
|
}, function (props) {
|
|
7317
7373
|
return props.hasBorder ? props.theme.colors.borderColor : props.theme.colors.ntrlMin;
|
|
@@ -7342,8 +7398,8 @@
|
|
|
7342
7398
|
isChecked: false
|
|
7343
7399
|
};
|
|
7344
7400
|
|
|
7345
|
-
var _templateObject$
|
|
7346
|
-
var Body = styled__default.div(_templateObject$
|
|
7401
|
+
var _templateObject$4;
|
|
7402
|
+
var Body = styled__default.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral(["\n .outlineColor {\n fill: #ffffff;\n }\n display: flex;\n flex-flow: row wrap;\n\n button {\n margin-top: 20px;\n width: 150px;\n cursor: pointer;\n padding: 0;\n &:not(:last-child) {\n margin-right: ", ";\n }\n }\n .outlineColor {\n fill: white;\n }\n\n @media (max-width: ", ") {\n display: block;\n button {\n width: 100%;\n &:not(:last-child) {\n margin-right: 0;\n }\n }\n }\n"])), function (props) {
|
|
7347
7403
|
return props.theme.marginPaddings[2];
|
|
7348
7404
|
}, media.sm);
|
|
7349
7405
|
|
|
@@ -7475,21 +7531,21 @@
|
|
|
7475
7531
|
}));
|
|
7476
7532
|
});
|
|
7477
7533
|
|
|
7478
|
-
var _templateObject$
|
|
7479
|
-
var ErrorMessage = styled__default.div(_templateObject$
|
|
7534
|
+
var _templateObject$5;
|
|
7535
|
+
var ErrorMessage = styled__default.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteral(["\n color: ", ";\n margin-top: ", ";\n"])), function (props) {
|
|
7480
7536
|
return props.theme.colors.primary;
|
|
7481
7537
|
}, function (props) {
|
|
7482
7538
|
return props.theme.marginPaddings[0];
|
|
7483
7539
|
});
|
|
7484
7540
|
|
|
7485
|
-
var _templateObject$
|
|
7486
|
-
var disabledButtonStyle = styled.css(_templateObject$
|
|
7487
|
-
var baseButtonStyle = styled.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding: 1rem 3.5rem;\n cursor: pointer;\n letter-spacing: 1.3px;\n border-style: none;\n text-transform: uppercase;\n font-size: 12px;\n color: #fff;\n transition: 0.2s ease-in-out;\n outline: none;\n min-width: 150px;\n"])));
|
|
7541
|
+
var _templateObject$6, _templateObject2$1;
|
|
7542
|
+
var disabledButtonStyle = styled.css(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteral(["\n cursor: not-allowed;\n opacity: 0.4;\n"])));
|
|
7543
|
+
var baseButtonStyle = styled.css(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n padding: 1rem 3.5rem;\n cursor: pointer;\n letter-spacing: 1.3px;\n border-style: none;\n text-transform: uppercase;\n font-size: 12px;\n color: #fff;\n transition: 0.2s ease-in-out;\n outline: none;\n min-width: 150px;\n"])));
|
|
7488
7544
|
|
|
7489
7545
|
var _excluded = ["children"];
|
|
7490
7546
|
|
|
7491
|
-
var _templateObject$
|
|
7492
|
-
var Button = styled__default.button(_templateObject$
|
|
7547
|
+
var _templateObject$7;
|
|
7548
|
+
var Button = styled__default.button(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteral(["\n outline: none;\n cursor: pointer;\n background-color: transparent;\n border: none;\n &:disabled {\n ", ";\n }\n"])), disabledButtonStyle);
|
|
7493
7549
|
|
|
7494
7550
|
var WrapperButton = function WrapperButton(_ref) {
|
|
7495
7551
|
var children = _ref.children,
|
|
@@ -7498,7 +7554,7 @@
|
|
|
7498
7554
|
return /*#__PURE__*/React__default.createElement(Button, restProps, children);
|
|
7499
7555
|
};
|
|
7500
7556
|
|
|
7501
|
-
var _templateObject$
|
|
7557
|
+
var _templateObject$8, _templateObject2$2;
|
|
7502
7558
|
var categories = catArray;
|
|
7503
7559
|
|
|
7504
7560
|
var getSvg = function getSvg() {
|
|
@@ -7525,10 +7581,10 @@
|
|
|
7525
7581
|
}
|
|
7526
7582
|
};
|
|
7527
7583
|
|
|
7528
|
-
var Container = styled__default.div(_templateObject$
|
|
7584
|
+
var Container = styled__default.div(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteral(["\n margin-bottom: ", ";\n"])), function (props) {
|
|
7529
7585
|
return props.theme.marginPaddings[5];
|
|
7530
7586
|
});
|
|
7531
|
-
var CategoryTitle = styled__default.h1(_templateObject2$
|
|
7587
|
+
var CategoryTitle = styled__default.h1(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral(["\n margin-top: 10px;\n font-size: 14px;\n text-transform: uppercase;\n"])));
|
|
7532
7588
|
/**
|
|
7533
7589
|
* InterestCatSelector is a specialized selector for select luxity specific interest categories
|
|
7534
7590
|
*/
|
|
@@ -7563,8 +7619,8 @@
|
|
|
7563
7619
|
|
|
7564
7620
|
var _excluded$1 = ["children"];
|
|
7565
7621
|
|
|
7566
|
-
var _templateObject$
|
|
7567
|
-
var Button$1 = styled__default.button(_templateObject$
|
|
7622
|
+
var _templateObject$9;
|
|
7623
|
+
var Button$1 = styled__default.button(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteral(["\n ", ";\n background-color: transparent;\n color: ", ";\n &:hover {\n color: ", ";\n }\n &:disabled {\n ", ";\n color: ", ";\n }\n"])), baseButtonStyle, function (props) {
|
|
7568
7624
|
return props.theme.colors.base;
|
|
7569
7625
|
}, function (props) {
|
|
7570
7626
|
return props.theme.colors.primary;
|
|
@@ -7586,8 +7642,8 @@
|
|
|
7586
7642
|
|
|
7587
7643
|
var _excluded$2 = ["children"];
|
|
7588
7644
|
|
|
7589
|
-
var _templateObject$
|
|
7590
|
-
var Button$2 = styled__default(TextButton$1)(_templateObject$
|
|
7645
|
+
var _templateObject$a;
|
|
7646
|
+
var Button$2 = styled__default(TextButton$1)(_templateObject$a || (_templateObject$a = _taggedTemplateLiteral(["\n color: ", ";\n background-color: ", ";\n &:hover {\n color: ", ";\n background-color: ", ";\n }\n &:disabled {\n background-color: ", ";\n color: ", ";\n }\n"])), function (props) {
|
|
7591
7647
|
return props.theme.colors.ntrlMin;
|
|
7592
7648
|
}, function (props) {
|
|
7593
7649
|
return props.theme.colors.primary;
|
|
@@ -7610,15 +7666,15 @@
|
|
|
7610
7666
|
|
|
7611
7667
|
var InvertedTextButton$1 = themed(InvertedTextButton);
|
|
7612
7668
|
|
|
7613
|
-
var _templateObject$
|
|
7669
|
+
var _templateObject$b, _templateObject2$3;
|
|
7614
7670
|
var ALL_ITEM = {
|
|
7615
7671
|
id: 'ALL',
|
|
7616
7672
|
name: 'ALL'
|
|
7617
7673
|
};
|
|
7618
7674
|
var multiSelectorItemMaxHeight = '3rem';
|
|
7619
7675
|
var multiSelectorItemAnimationDuration = '300ms';
|
|
7620
|
-
var multiselectorItemFadeIn = styled.keyframes(_templateObject$
|
|
7621
|
-
var StyledMultiselector = styled__default.div(_templateObject2$
|
|
7676
|
+
var multiselectorItemFadeIn = styled.keyframes(_templateObject$b || (_templateObject$b = _taggedTemplateLiteral(["\n from {\n margin: 0;\n max-height: 0px;\n opacity: 0;\n }\n to {\n max-height: ", ";\n opacity: 1;\n }\n"])), multiSelectorItemMaxHeight);
|
|
7677
|
+
var StyledMultiselector = styled__default.div(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteral(["\n .multiselector__selected-items,\n .multiselector__selectable-items {\n display: flex;\n flex-flow: wrap;\n margin-left: calc(-1 * ", ");\n button {\n &:hover {\n color: ", ";\n background-color: ", ";\n }\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n padding: ", ";\n text-transform: none;\n box-sizing: border-box;\n animation: ", " ease-in-out\n ", " forwards;\n flex-basis: calc(25% - ", ");\n margin-bottom: ", ";\n margin-left: ", ";\n text-overflow: ellipsis;\n overflow-x: hidden;\n min-height: 40px;\n\n @media (max-width: ", ") {\n flex-basis: calc(50% - ", ");\n }\n }\n }\n\n .multiselector__footer {\n display: flex;\n justify-content: center;\n button {\n &:hover {\n color: ", ";\n background-color: ", ";\n }\n background-color: ", ";\n color: ", ";\n }\n }\n"])), function (props) {
|
|
7622
7678
|
return props.theme.marginPaddings[2];
|
|
7623
7679
|
}, function (props) {
|
|
7624
7680
|
return props.theme.colors.ntrlMin;
|
|
@@ -7855,11 +7911,11 @@
|
|
|
7855
7911
|
}));
|
|
7856
7912
|
});
|
|
7857
7913
|
|
|
7858
|
-
var _templateObject$
|
|
7859
|
-
var Title = styled__default.h1(_templateObject$
|
|
7914
|
+
var _templateObject$c, _templateObject2$4;
|
|
7915
|
+
var Title = styled__default.h1(_templateObject$c || (_templateObject$c = _taggedTemplateLiteral(["\n font-size: ", ";\n font-weight: bold;\n margin-bottom: 0;\n text-transform: uppercase;\n"])), function (props) {
|
|
7860
7916
|
return props.theme.fontSizes[2];
|
|
7861
7917
|
});
|
|
7862
|
-
var InterestsSubheadingContainer = styled__default.div(_templateObject2$
|
|
7918
|
+
var InterestsSubheadingContainer = styled__default.div(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: space-between;\n padding-bottom: ", ";\n border-bottom: 1px solid ", ";\n margin-bottom: ", ";\n margin-top: ", ";\n width: 100%;\n align-items: center;\n"])), function (props) {
|
|
7863
7919
|
return props.theme.marginPaddings[1];
|
|
7864
7920
|
}, function (props) {
|
|
7865
7921
|
return props.theme.colors.primary;
|
|
@@ -7878,7 +7934,7 @@
|
|
|
7878
7934
|
}, /*#__PURE__*/React__default.createElement(Title, null, title), /*#__PURE__*/React__default.createElement("div", null, children));
|
|
7879
7935
|
};
|
|
7880
7936
|
|
|
7881
|
-
var _templateObject$
|
|
7937
|
+
var _templateObject$d;
|
|
7882
7938
|
|
|
7883
7939
|
var Title$1 = function Title(_ref) {
|
|
7884
7940
|
var baseClass = _ref.baseClass,
|
|
@@ -7899,7 +7955,7 @@
|
|
|
7899
7955
|
})));
|
|
7900
7956
|
};
|
|
7901
7957
|
|
|
7902
|
-
var StyledTitle = styled__default(Title$1)(_templateObject$
|
|
7958
|
+
var StyledTitle = styled__default(Title$1)(_templateObject$d || (_templateObject$d = _taggedTemplateLiteral(["\n margin-bottom: ", ";\n font-weight: bold;\n display: flex;\n align-items: center;\n font-size: ", ";\n\n .title__search,\n .title__search {\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 30px;\n margin-bottom: ", ";\n\n svg {\n margin-left: ", ";\n fill: ", ";\n stroke: ", ";\n }\n\n input {\n width: 140px;\n border: none;\n font-size: ", ";\n transition: 0.2s border-color ease-in-out;\n margin-left: ", ";\n padding: 0;\n\n :focus {\n border-color: ", ";\n border-bottom: none;\n }\n }\n }\n"])), function (props) {
|
|
7903
7959
|
return props.theme.marginPaddings[2];
|
|
7904
7960
|
}, function (props) {
|
|
7905
7961
|
return props.theme.fontSizes[2];
|
|
@@ -8041,8 +8097,8 @@
|
|
|
8041
8097
|
|
|
8042
8098
|
var _excluded$3 = ["children"];
|
|
8043
8099
|
|
|
8044
|
-
var _templateObject$
|
|
8045
|
-
var Button$3 = styled__default.button(_templateObject$
|
|
8100
|
+
var _templateObject$e;
|
|
8101
|
+
var Button$3 = styled__default.button(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n ", ";\n background-color: ", ";\n color: ", ";\n &:active,\n &:hover {\n background-color: #fff;\n color: ", ";\n }\n\n &:disabled {\n ", "\n\n &:hover {\n background-color: ", ";\n color: #ffff;\n }\n }\n"])), baseButtonStyle, function (props) {
|
|
8046
8102
|
return props.theme.colors.primary;
|
|
8047
8103
|
}, function (props) {
|
|
8048
8104
|
return props.theme.colors.ntrlMin;
|
|
@@ -8061,8 +8117,8 @@
|
|
|
8061
8117
|
|
|
8062
8118
|
var PrimaryButton$1 = themed(PrimaryButton);
|
|
8063
8119
|
|
|
8064
|
-
var _templateObject$
|
|
8065
|
-
var BaseButton = styled__default.button(_templateObject$
|
|
8120
|
+
var _templateObject$f;
|
|
8121
|
+
var BaseButton = styled__default.button(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n color: ", ";\n border: 1px solid ", ";\n background-color: ", ";\n &:hover {\n color: ", ";\n background-color: ", ";\n }\n"])), function (props) {
|
|
8066
8122
|
return props.theme.colors.base;
|
|
8067
8123
|
}, function (props) {
|
|
8068
8124
|
return props.theme.colors.borderColor;
|
|
@@ -8918,12 +8974,12 @@
|
|
|
8918
8974
|
/* ::<number | string, string, string> */
|
|
8919
8975
|
(transparentize);
|
|
8920
8976
|
|
|
8921
|
-
var _templateObject$
|
|
8922
|
-
var baseSliderStyles = styled.css(_templateObject$
|
|
8977
|
+
var _templateObject$g;
|
|
8978
|
+
var baseSliderStyles = styled.css(_templateObject$g || (_templateObject$g = _taggedTemplateLiteral(["\n .rc-slider {\n position: relative;\n height: 14px;\n padding: 5px 0;\n width: 100%;\n border-radius: 6px;\n touch-action: none;\n box-sizing: border-box;\n }\n .rc-slider * {\n box-sizing: border-box;\n }\n .rc-slider-rail {\n position: absolute;\n width: 100%;\n background-color: #e9e9e9;\n height: 4px;\n border-radius: 6px;\n }\n .rc-slider-track {\n position: absolute;\n left: 0;\n height: 4px;\n border-radius: 6px;\n background-color: #abe2fb;\n }\n .rc-slider-handle {\n position: absolute;\n width: 14px;\n height: 14px;\n cursor: pointer;\n margin-top: -5px;\n border-radius: 50%;\n border: solid 2px #96dbfa;\n background-color: #fff;\n -ms-touch-action: pan-x;\n touch-action: pan-x;\n }\n .rc-slider-handle:focus {\n border-color: #57c5f7;\n box-shadow: 0 0 0 5px #96dbfa;\n outline: none;\n }\n .rc-slider-handle-click-focused:focus {\n border-color: #96dbfa;\n box-shadow: unset;\n }\n .rc-slider-handle:hover {\n border-color: #57c5f7;\n }\n .rc-slider-handle:active {\n border-color: #57c5f7;\n box-shadow: 0 0 5px #57c5f7;\n cursor: grabbing;\n }\n .rc-slider-mark {\n position: absolute;\n top: 18px;\n left: 0;\n width: 100%;\n font-size: 12px;\n }\n .rc-slider-mark-text {\n position: absolute;\n display: inline-block;\n vertical-align: middle;\n text-align: center;\n cursor: pointer;\n color: #999;\n }\n .rc-slider-mark-text-active {\n color: #666;\n }\n .rc-slider-step {\n position: absolute;\n width: 100%;\n height: 4px;\n background: transparent;\n }\n .rc-slider-dot {\n position: absolute;\n bottom: -2px;\n margin-left: -4px;\n width: 8px;\n height: 8px;\n border: 2px solid #e9e9e9;\n background-color: #fff;\n cursor: pointer;\n border-radius: 50%;\n vertical-align: middle;\n }\n .rc-slider-dot-active {\n border-color: #96dbfa;\n }\n .rc-slider-dot-reverse {\n margin-left: 0;\n margin-right: -4px;\n }\n .rc-slider-disabled {\n background-color: #e9e9e9;\n }\n .rc-slider-disabled .rc-slider-track {\n background-color: #ccc;\n }\n .rc-slider-disabled .rc-slider-handle,\n .rc-slider-disabled .rc-slider-dot {\n border-color: #ccc;\n box-shadow: none;\n background-color: #fff;\n cursor: not-allowed;\n }\n .rc-slider-disabled .rc-slider-mark-text,\n .rc-slider-disabled .rc-slider-dot {\n cursor: not-allowed !important;\n }\n .rc-slider-vertical {\n width: 14px;\n height: 100%;\n padding: 0 5px;\n }\n .rc-slider-vertical .rc-slider-rail {\n height: 100%;\n width: 4px;\n }\n .rc-slider-vertical .rc-slider-track {\n left: 5px;\n bottom: 0;\n width: 4px;\n }\n .rc-slider-vertical .rc-slider-handle {\n margin-left: -5px;\n -ms-touch-action: pan-y;\n touch-action: pan-y;\n }\n .rc-slider-vertical .rc-slider-mark {\n top: 0;\n left: 18px;\n height: 100%;\n }\n .rc-slider-vertical .rc-slider-step {\n height: 100%;\n width: 4px;\n }\n .rc-slider-vertical .rc-slider-dot {\n left: 2px;\n margin-bottom: -4px;\n }\n .rc-slider-vertical .rc-slider-dot:first-child {\n margin-bottom: -4px;\n }\n .rc-slider-vertical .rc-slider-dot:last-child {\n margin-bottom: -4px;\n }\n .rc-slider-tooltip-zoom-down-enter,\n .rc-slider-tooltip-zoom-down-appear {\n animation-duration: 0.3s;\n animation-fill-mode: both;\n display: block !important;\n animation-play-state: paused;\n }\n .rc-slider-tooltip-zoom-down-leave {\n animation-duration: 0.3s;\n animation-fill-mode: both;\n display: block !important;\n animation-play-state: paused;\n }\n .rc-slider-tooltip-zoom-down-enter.rc-slider-tooltip-zoom-down-enter-active,\n .rc-slider-tooltip-zoom-down-appear.rc-slider-tooltip-zoom-down-appear-active {\n animation-name: rcSliderTooltipZoomDownIn;\n animation-play-state: running;\n }\n .rc-slider-tooltip-zoom-down-leave.rc-slider-tooltip-zoom-down-leave-active {\n animation-name: rcSliderTooltipZoomDownOut;\n animation-play-state: running;\n }\n .rc-slider-tooltip-zoom-down-enter,\n .rc-slider-tooltip-zoom-down-appear {\n transform: scale(0, 0);\n animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);\n }\n .rc-slider-tooltip-zoom-down-leave {\n animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);\n }\n @keyframes rcSliderTooltipZoomDownIn {\n 0% {\n opacity: 0;\n transform-origin: 50% 100%;\n transform: scale(0, 0);\n }\n 100% {\n transform-origin: 50% 100%;\n transform: scale(1, 1);\n }\n }\n @keyframes rcSliderTooltipZoomDownOut {\n 0% {\n transform-origin: 50% 100%;\n transform: scale(1, 1);\n }\n 100% {\n opacity: 0;\n transform-origin: 50% 100%;\n transform: scale(0, 0);\n }\n }\n .rc-slider-tooltip {\n position: absolute;\n left: -9999px;\n top: -9999px;\n visibility: visible;\n box-sizing: border-box;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n }\n .rc-slider-tooltip * {\n box-sizing: border-box;\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n }\n .rc-slider-tooltip-hidden {\n display: none;\n }\n .rc-slider-tooltip-placement-top {\n padding: 4px 0 8px 0;\n }\n .rc-slider-tooltip-inner {\n padding: 6px 2px;\n min-width: 24px;\n height: 24px;\n font-size: 12px;\n line-height: 1;\n color: #fff;\n text-align: center;\n text-decoration: none;\n background-color: #6c6c6c;\n border-radius: 6px;\n box-shadow: 0 0 4px #d9d9d9;\n }\n .rc-slider-tooltip-arrow {\n position: absolute;\n width: 0;\n height: 0;\n border-color: transparent;\n border-style: solid;\n }\n .rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow {\n bottom: 4px;\n left: 50%;\n margin-left: -4px;\n border-width: 4px 4px 0;\n border-top-color: #6c6c6c;\n }\n"])));
|
|
8923
8979
|
|
|
8924
|
-
var _templateObject$
|
|
8980
|
+
var _templateObject$h, _templateObject2$5, _templateObject3$1, _templateObject4;
|
|
8925
8981
|
var handleDimension = '14px';
|
|
8926
|
-
var SliderContainer = styled__default.div(_templateObject$
|
|
8982
|
+
var SliderContainer = styled__default.div(_templateObject$h || (_templateObject$h = _taggedTemplateLiteral(["\n ", ";\n position: relative;\n .rc-slider-handle {\n background-color: ", ";\n border-color: ", ";\n }\n\n .rc-slider {\n margin-bottom: ", ";\n max-width: calc(100% - ", ");\n margin-left: auto;\n margin-right: auto;\n }\n .rc-slider-track {\n background-color: ", ";\n }\n\n .rc-slider-handle {\n height: ", ";\n width: ", ";\n transition: border-color 0.5s ease-in-out, box-shadow 0.5s ease-in-out;\n &:hover,\n &:focus {\n border: ", ";\n box-shadow: 0 0 0 5px\n ", ";\n }\n }\n ", "\n"])), baseSliderStyles, function (props) {
|
|
8927
8983
|
return props.theme.colors.primary;
|
|
8928
8984
|
}, function (props) {
|
|
8929
8985
|
return props.theme.colors.primary;
|
|
@@ -8942,22 +8998,22 @@
|
|
|
8942
8998
|
var getSliderMarkStyle = function getSliderMarkStyle(_ref) {
|
|
8943
8999
|
var showMarks = _ref.showMarks,
|
|
8944
9000
|
primary = _ref.theme.colors.primary;
|
|
8945
|
-
var visiblityStyle = showMarks ? styled.css(_templateObject2$
|
|
9001
|
+
var visiblityStyle = showMarks ? styled.css(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteral([""]))) : styled.css(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral(["\n .rc-slider-mark-text,\n .rc-slider-dot {\n visibility: hidden;\n }\n "])));
|
|
8946
9002
|
return styled.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n .rc-slider-mark-text {\n color: ", ";\n }\n\n .rc-slider-dot {\n border-color: ", ";\n background-color: white;\n }\n ", "\n "])), primary, primary, visiblityStyle);
|
|
8947
9003
|
};
|
|
8948
9004
|
|
|
8949
|
-
var _templateObject$h;
|
|
8950
|
-
var ToolTipWrapper = styled__default.div(_templateObject$h || (_templateObject$h = _taggedTemplateLiteral(["\n position: absolute;\n right: auto;\n top: 20px;\n transform: translateX(-50%);\n width: 100px;\n text-align: center;\n"])));
|
|
8951
|
-
|
|
8952
9005
|
var _templateObject$i;
|
|
8953
|
-
var
|
|
9006
|
+
var ToolTipWrapper = styled__default.div(_templateObject$i || (_templateObject$i = _taggedTemplateLiteral(["\n position: absolute;\n right: auto;\n top: 20px;\n transform: translateX(-50%);\n width: 100px;\n text-align: center;\n"])));
|
|
9007
|
+
|
|
9008
|
+
var _templateObject$j;
|
|
9009
|
+
var Footer = styled__default.div(_templateObject$j || (_templateObject$j = _taggedTemplateLiteral(["\n display: flex;\n flex-flow: row nowrap;\n justify-content: flex-end;\n"])));
|
|
8954
9010
|
|
|
8955
9011
|
var _excluded$4 = ["dragging", "value", "offset", "index"],
|
|
8956
9012
|
_excluded2 = ["renderTitleSection", "marks", "defaultMinValue", "defaultMaxValue", "min", "max", "toolTipComponent", "renderFooterSection", "onChange", "children", "identifier", "showMarks"];
|
|
8957
9013
|
|
|
8958
|
-
var _templateObject$
|
|
9014
|
+
var _templateObject$k;
|
|
8959
9015
|
var debounceBuilder$1 = functions.debounced(100);
|
|
8960
|
-
var ChildrenWrapper = styled__default.div(_templateObject$
|
|
9016
|
+
var ChildrenWrapper = styled__default.div(_templateObject$k || (_templateObject$k = _taggedTemplateLiteral(["\n margin-bottom: ", ";\n"])), function (props) {
|
|
8961
9017
|
return props.theme.marginPaddings[3];
|
|
8962
9018
|
});
|
|
8963
9019
|
|
|
@@ -9181,46 +9237,46 @@
|
|
|
9181
9237
|
shoeSizes: []
|
|
9182
9238
|
};
|
|
9183
9239
|
|
|
9184
|
-
var _templateObject$k;
|
|
9185
|
-
var RadioButtonsContainer = styled__default.div(_templateObject$k || (_templateObject$k = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n"])));
|
|
9186
|
-
|
|
9187
9240
|
var _templateObject$l;
|
|
9188
|
-
var
|
|
9241
|
+
var RadioButtonsContainer = styled__default.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n"])));
|
|
9242
|
+
|
|
9243
|
+
var _templateObject$m;
|
|
9244
|
+
var ButtonListWrapper = styled__default.div(_templateObject$m || (_templateObject$m = _taggedTemplateLiteral(["\n display: flex;\n flex-grow: 1;\n flex-wrap: ", ";\n"])), function (_ref) {
|
|
9189
9245
|
var noWrap = _ref.noWrap;
|
|
9190
9246
|
return noWrap ? 'nowrap' : 'wrap';
|
|
9191
9247
|
});
|
|
9192
9248
|
|
|
9193
|
-
var _templateObject$
|
|
9194
|
-
var Title$3 = styled__default.div(_templateObject$
|
|
9249
|
+
var _templateObject$n;
|
|
9250
|
+
var Title$3 = styled__default.div(_templateObject$n || (_templateObject$n = _taggedTemplateLiteral(["\n font-weight: bold;\n color: ", ";\n flex-basis: 40%;\n"])), function (props) {
|
|
9195
9251
|
return props.theme.colors.base;
|
|
9196
9252
|
});
|
|
9197
9253
|
|
|
9198
|
-
var _templateObject$
|
|
9199
|
-
var RadioButtonLabel = styled__default.label(_templateObject$
|
|
9254
|
+
var _templateObject$o;
|
|
9255
|
+
var RadioButtonLabel = styled__default.label(_templateObject$o || (_templateObject$o = _taggedTemplateLiteral(["\n display: flex;\n margin-bottom: ", ";\n margin-right: ", ";\n"])), function (props) {
|
|
9200
9256
|
return props.theme.marginPaddings[0];
|
|
9201
9257
|
}, function (props) {
|
|
9202
9258
|
return props.theme.marginPaddings[0];
|
|
9203
9259
|
});
|
|
9204
9260
|
|
|
9205
|
-
var _templateObject$
|
|
9206
|
-
var RadioButtonCircle = styled__default.div(_templateObject$
|
|
9261
|
+
var _templateObject$p;
|
|
9262
|
+
var RadioButtonCircle = styled__default.div(_templateObject$p || (_templateObject$p = _taggedTemplateLiteral(["\n height: 20px;\n width: 20px;\n border-radius: 50%;\n margin-right: 5px;\n border: 1px solid ", ";\n display: flex;\n"])), function (props) {
|
|
9207
9263
|
return props.theme.colors.base;
|
|
9208
9264
|
});
|
|
9209
9265
|
|
|
9210
|
-
var _templateObject$p;
|
|
9211
|
-
var RadioButtonCircleInner = styled__default.div(_templateObject$p || (_templateObject$p = _taggedTemplateLiteral(["\n height: 8px;\n width: 8px;\n border-radius: 50%;\n margin: auto;\n"])));
|
|
9212
|
-
|
|
9213
9266
|
var _templateObject$q;
|
|
9214
|
-
var
|
|
9215
|
-
return props.theme.colors.base;
|
|
9216
|
-
});
|
|
9267
|
+
var RadioButtonCircleInner = styled__default.div(_templateObject$q || (_templateObject$q = _taggedTemplateLiteral(["\n height: 8px;\n width: 8px;\n border-radius: 50%;\n margin: auto;\n"])));
|
|
9217
9268
|
|
|
9218
9269
|
var _templateObject$r;
|
|
9219
|
-
var
|
|
9270
|
+
var RadioButtonInput = styled__default.input(_templateObject$r || (_templateObject$r = _taggedTemplateLiteral(["\n display: none;\n :checked ~ ", " {\n ", " {\n background-color: ", ";\n }\n }\n"])), RadioButtonCircle, RadioButtonCircleInner, function (props) {
|
|
9271
|
+
return props.theme.colors.base;
|
|
9272
|
+
});
|
|
9220
9273
|
|
|
9221
9274
|
var _templateObject$s;
|
|
9275
|
+
var RadioButtonText = styled__default.div(_templateObject$s || (_templateObject$s = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n"])));
|
|
9276
|
+
|
|
9277
|
+
var _templateObject$t;
|
|
9222
9278
|
var inputMarginRight = '0.2em';
|
|
9223
|
-
var CheckboxLabel = styled__default.label(_templateObject$
|
|
9279
|
+
var CheckboxLabel = styled__default.label(_templateObject$t || (_templateObject$t = _taggedTemplateLiteral(["\n cursor: pointer;\n position: relative;\n display: flex;\n align-items: center;\n\n span {\n :before {\n content: '\\2713';\n position: absolute;\n display: none;\n color: white;\n left: 0.4em;\n top: 0.1em;\n font-size: ", ";\n text-align: center;\n }\n }\n\n input {\n font-size: ", ";\n background-color: ", ";\n appearance: none;\n outline: none;\n height: 1em;\n width: 1em;\n margin-right: ", ";\n border: 1px solid ", ";\n border-radius: ", ";\n transition-duration: 0.3s;\n cursor: pointer;\n\n &:checked {\n background-color: ", ";\n }\n\n &:checked + span:before {\n display: block;\n }\n }\n"], ["\n cursor: pointer;\n position: relative;\n display: flex;\n align-items: center;\n\n span {\n :before {\n content: '\\\\2713';\n position: absolute;\n display: none;\n color: white;\n left: 0.4em;\n top: 0.1em;\n font-size: ", ";\n text-align: center;\n }\n }\n\n input {\n font-size: ", ";\n background-color: ", ";\n appearance: none;\n outline: none;\n height: 1em;\n width: 1em;\n margin-right: ", ";\n border: 1px solid ", ";\n border-radius: ", ";\n transition-duration: 0.3s;\n cursor: pointer;\n\n &:checked {\n background-color: ", ";\n }\n\n &:checked + span:before {\n display: block;\n }\n }\n"])), function (props) {
|
|
9224
9280
|
var _props$theme;
|
|
9225
9281
|
|
|
9226
9282
|
return (_props$theme = props.theme) !== null && _props$theme !== void 0 && _props$theme.fontSizes.length ? props.theme.fontSizes[4] : '1em';
|
|
@@ -9307,12 +9363,12 @@
|
|
|
9307
9363
|
}
|
|
9308
9364
|
};
|
|
9309
9365
|
|
|
9310
|
-
var _templateObject$
|
|
9311
|
-
var TitleWrapper = styled__default.div(_templateObject$
|
|
9366
|
+
var _templateObject$u, _templateObject2$6;
|
|
9367
|
+
var TitleWrapper = styled__default.div(_templateObject$u || (_templateObject$u = _taggedTemplateLiteral(["\n display: flex;\n flex-flow: nowrap row;\n justify-content: space-between;\n margin-bottom: ", ";\n label {\n margin-bottom: 0;\n }\n"])), function (props) {
|
|
9312
9368
|
return props.theme.marginPaddings[4];
|
|
9313
9369
|
});
|
|
9314
9370
|
var onShoeSizeTypeChangeTimeout = 300;
|
|
9315
|
-
var ShoeSizeFadeContainer = styled__default.div(_templateObject2$
|
|
9371
|
+
var ShoeSizeFadeContainer = styled__default.div(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteral(["\n transition: opacity ease-in-out ", "ms;\n opacity: ", ";\n .rc-slider-handle,\n .rc-slider-handle-2,\n .shoe-size-tooltip {\n transition: opacity ease-in-out ", "ms;\n opacity: ", ";\n }\n"])), onShoeSizeTypeChangeTimeout, function (props) {
|
|
9316
9372
|
return props.childVisible ? 1 : 0;
|
|
9317
9373
|
}, onShoeSizeTypeChangeTimeout, function (props) {
|
|
9318
9374
|
return props.childVisible ? 1 : 0;
|
|
@@ -10052,8 +10108,8 @@
|
|
|
10052
10108
|
|
|
10053
10109
|
var _excluded$6 = ["children"];
|
|
10054
10110
|
|
|
10055
|
-
var _templateObject$
|
|
10056
|
-
var Button$4 = styled__default.button(_templateObject$
|
|
10111
|
+
var _templateObject$v;
|
|
10112
|
+
var Button$4 = styled__default.button(_templateObject$v || (_templateObject$v = _taggedTemplateLiteral(["\n ", ";\n background-color: ", ";\n color: ", ";\n border: 1px solid ", ";\n &:hover {\n background-color: ", ";\n color: ", ";\n }\n &:disabled {\n ", "\n &:hover {\n background-color: ", ";\n }\n }\n"])), baseButtonStyle, function (props) {
|
|
10057
10113
|
return props.theme.colors.ntrlMin;
|
|
10058
10114
|
}, function (props) {
|
|
10059
10115
|
return props.theme.colors.primary;
|
|
@@ -10076,8 +10132,8 @@
|
|
|
10076
10132
|
|
|
10077
10133
|
var SecondaryButton$1 = themed(SecondaryButton);
|
|
10078
10134
|
|
|
10079
|
-
var _templateObject$
|
|
10080
|
-
var CurrencyInputWrapper = styled__default.div(_templateObject$
|
|
10135
|
+
var _templateObject$w;
|
|
10136
|
+
var CurrencyInputWrapper = styled__default.div(_templateObject$w || (_templateObject$w = _taggedTemplateLiteral(["\n display: flex;\n flex-flow: row nowrap;\n justify-content: space-between;\n\n input[data-qe-id='masked-input-min'],\n input[data-qe-id='masked-input-max'] {\n flex-basis: 30%;\n border-left: none;\n border-right: none;\n border-top: none;\n border-bottom: 1px solid ", ";\n }\n"])), function (props) {
|
|
10081
10137
|
return props.theme.colors.primary;
|
|
10082
10138
|
});
|
|
10083
10139
|
|
|
@@ -10202,8 +10258,8 @@
|
|
|
10202
10258
|
category: ''
|
|
10203
10259
|
};
|
|
10204
10260
|
|
|
10205
|
-
var _templateObject$
|
|
10206
|
-
var SelectionWrapper = styled__default.div(_templateObject$
|
|
10261
|
+
var _templateObject$x;
|
|
10262
|
+
var SelectionWrapper = styled__default.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteral(["\n display: flex;\n margin-left: calc(-1 * ", ");\n label {\n margin-bottom: ", ";\n flex-basis: calc(33.33% - ", ");\n margin-bottom: ", ";\n margin-left: ", ";\n }\n @media (max-width: ", ") {\n label {\n flex-basis: calc(50% - ", ");\n }\n }\n"])), function (props) {
|
|
10207
10263
|
return props.theme.marginPaddings[2];
|
|
10208
10264
|
}, function (props) {
|
|
10209
10265
|
return props.theme.marginPaddings[2];
|
|
@@ -10219,14 +10275,14 @@
|
|
|
10219
10275
|
|
|
10220
10276
|
var _excluded$7 = ["title", "checked", "renderIcon", "onChange", "checkedValue", "unCheckedValue"];
|
|
10221
10277
|
|
|
10222
|
-
var _templateObject$
|
|
10223
|
-
var Content = styled__default.div(_templateObject$
|
|
10278
|
+
var _templateObject$y, _templateObject2$7, _templateObject3$2;
|
|
10279
|
+
var Content = styled__default.div(_templateObject$y || (_templateObject$y = _taggedTemplateLiteral(["\n background-color: transparent;\n border: 1px solid ", ";\n transition: 200ms ease-in-out;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: ", ";\n cursor: pointer;\n"])), function (props) {
|
|
10224
10280
|
return props.theme.colors.primary;
|
|
10225
10281
|
}, function (props) {
|
|
10226
10282
|
return props.theme.marginPaddings[0];
|
|
10227
10283
|
});
|
|
10228
|
-
var InputText = styled__default.div(_templateObject2$
|
|
10229
|
-
var StyledLabel = styled__default.label(_templateObject3$
|
|
10284
|
+
var InputText = styled__default.div(_templateObject2$7 || (_templateObject2$7 = _taggedTemplateLiteral(["\n transition: 200ms ease-in;\n margin-left: auto;\n margin-right: auto;\n"])));
|
|
10285
|
+
var StyledLabel = styled__default.label(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral(["\n line-height: initial;\n display: block;\n box-sizing: border-box;\n transition: 200ms ease-in-out;\n text-align: center;\n\n &:hover ", " {\n color: ", ";\n }\n\n input {\n display: none;\n &:checked ~ ", " {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n }\n\n &:checked ~ ", " ", " {\n color: ", ";\n }\n\n &:disabled ~ ", " {\n opacity: 0.5;\n cursor: not-allowed;\n }\n }\n"])), InputText, function (props) {
|
|
10230
10286
|
return props.theme.colors.primary;
|
|
10231
10287
|
}, Content, function (props) {
|
|
10232
10288
|
return props.theme.colors.primary;
|
|
@@ -10385,33 +10441,33 @@
|
|
|
10385
10441
|
}));
|
|
10386
10442
|
});
|
|
10387
10443
|
|
|
10388
|
-
var _templateObject$y;
|
|
10389
|
-
var SvgWrapper$1 = styled__default.span(_templateObject$y || (_templateObject$y = _taggedTemplateLiteral(["\n padding: 1rem;\n display: flex;\n svg {\n width: 23px;\n height: auto;\n }\n"])));
|
|
10390
|
-
|
|
10391
10444
|
var _templateObject$z;
|
|
10392
|
-
var
|
|
10445
|
+
var SvgWrapper$1 = styled__default.span(_templateObject$z || (_templateObject$z = _taggedTemplateLiteral(["\n padding: 1rem;\n display: flex;\n svg {\n width: 23px;\n height: auto;\n }\n"])));
|
|
10446
|
+
|
|
10447
|
+
var _templateObject$A;
|
|
10448
|
+
var IconWrapper = styled__default.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteral(["\n border: 1px solid ", ";\n height: auto;\n margin-bottom: 1rem;\n margin-left: 1rem;\n display: flex;\n align-items: center;\n height: auto;\n\n :hover {\n background-color: ", ";\n cursor: pointer;\n }\n\n #svg-trash {\n width: 15px;\n height: 100%;\n }\n"])), function (props) {
|
|
10393
10449
|
return props.theme.colors.borderColor;
|
|
10394
10450
|
}, function (props) {
|
|
10395
10451
|
return props.theme.colors.borderColor;
|
|
10396
10452
|
});
|
|
10397
10453
|
|
|
10398
|
-
var _templateObject$
|
|
10454
|
+
var _templateObject$B, _templateObject2$8, _templateObject3$3, _templateObject4$1, _templateObject5;
|
|
10399
10455
|
var UNISEX = genders.UNISEX;
|
|
10400
|
-
var AddInterestContainer = styled__default.div(_templateObject$
|
|
10456
|
+
var AddInterestContainer = styled__default.div(_templateObject$B || (_templateObject$B = _taggedTemplateLiteral(["\n margin-bottom: ", ";\n border: 1px solid ", ";\n padding: ", ";\n"])), function (props) {
|
|
10401
10457
|
return props.theme.marginPaddings[6];
|
|
10402
10458
|
}, function (props) {
|
|
10403
10459
|
return props.theme.colors.borderColor;
|
|
10404
10460
|
}, function (props) {
|
|
10405
10461
|
return props.theme.marginPaddings[6];
|
|
10406
10462
|
});
|
|
10407
|
-
var SaveAndCancelButtonContainer = styled__default.div(_templateObject2$
|
|
10463
|
+
var SaveAndCancelButtonContainer = styled__default.div(_templateObject2$8 || (_templateObject2$8 = _taggedTemplateLiteral(["\n margin-top: ", ";\n\n @media (max-width: ", ") {\n .fl-right__item {\n flex-direction: column;\n margin-right: 0;\n margin-left: ", ";\n }\n\n button {\n margin-bottom: ", ";\n }\n }\n"])), function (props) {
|
|
10408
10464
|
return props.theme.marginPaddings[6];
|
|
10409
10465
|
}, media.xs, function (props) {
|
|
10410
10466
|
return props.theme.marginPaddings[0];
|
|
10411
10467
|
}, function (props) {
|
|
10412
10468
|
return props.theme.marginPaddings[1];
|
|
10413
10469
|
});
|
|
10414
|
-
var CatSelectorParagraph = styled__default.div(_templateObject3$
|
|
10470
|
+
var CatSelectorParagraph = styled__default.div(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteral(["\n font-weight: bold;\n color: ", ";\n margin-bottom: ", ";\n"])), function (props) {
|
|
10415
10471
|
return props.theme.colors.darkerGray;
|
|
10416
10472
|
}, function (props) {
|
|
10417
10473
|
return props.theme.marginPaddings[2];
|
|
@@ -10738,7 +10794,7 @@
|
|
|
10738
10794
|
})));
|
|
10739
10795
|
});
|
|
10740
10796
|
|
|
10741
|
-
var _templateObject$
|
|
10797
|
+
var _templateObject$C, _templateObject2$9, _templateObject3$4, _templateObject4$2;
|
|
10742
10798
|
var MALE$2 = genders.MALE,
|
|
10743
10799
|
FEMALE$2 = genders.FEMALE,
|
|
10744
10800
|
UNISEX$1 = genders.UNISEX;
|
|
@@ -10874,9 +10930,9 @@
|
|
|
10874
10930
|
return _createClass(InterestItem);
|
|
10875
10931
|
}(React__default.Component);
|
|
10876
10932
|
|
|
10877
|
-
var SheoSizeContentDiv = styled__default.div(_templateObject$
|
|
10878
|
-
var InterestItemTitle = styled__default.div(_templateObject2$
|
|
10879
|
-
var InterestItemContainer = styled__default.div(_templateObject3$
|
|
10933
|
+
var SheoSizeContentDiv = styled__default.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteral(["\n @media (max-width: ", ") {\n display: none;\n }\n"])), media.xs);
|
|
10934
|
+
var InterestItemTitle = styled__default.div(_templateObject2$9 || (_templateObject2$9 = _taggedTemplateLiteral(["\n font-weight: bold;\n display: none;\n\n @media (max-width: ", ") {\n display: inline;\n }\n"])), media.xs);
|
|
10935
|
+
var InterestItemContainer = styled__default.div(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteral(["\n display: flex;\n\n .no-shoe-size-section {\n @media (max-width: ", ") {\n display: none;\n }\n }\n"])), media.xs);
|
|
10880
10936
|
var InterestItemContent = styled__default.div(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: space-between;\n width: 95%;\n height: 100%;\n border: 1px solid ", ";\n padding: 0.5em;\n margin-bottom: ", ";\n\n .interest-item__container_heading {\n color: ", ";\n flex-basis: calc(100% / 6);\n margin-left: ", ";\n margin-top: 0.3rem;\n\n @media (max-width: ", ") {\n display: inline;\n }\n }\n\n .list-items {\n display: inline-flex;\n flex-direction: column;\n\n @media (max-width: ", ") {\n margin-left: ", ";\n }\n }\n\n @media (max-width: ", ") {\n flex-direction: column;\n }\n"])), function (props) {
|
|
10881
10937
|
return props.theme.colors.borderColor;
|
|
10882
10938
|
}, function (props) {
|
|
@@ -10898,8 +10954,8 @@
|
|
|
10898
10954
|
return /*#__PURE__*/React__default.createElement(ThemedInterestItem, props);
|
|
10899
10955
|
});
|
|
10900
10956
|
|
|
10901
|
-
var _templateObject$
|
|
10902
|
-
var MyInterestTitleHeadingContainer = styled__default.div(_templateObject$
|
|
10957
|
+
var _templateObject$D;
|
|
10958
|
+
var MyInterestTitleHeadingContainer = styled__default.div(_templateObject$D || (_templateObject$D = _taggedTemplateLiteral(["\n display: flex;\n justify-content: space-between;\n\n .heading-title-section {\n display: flex;\n justify-content: space-between;\n width: 95%;\n padding: ", ";\n }\n\n .heading-title {\n color: ", ";\n font-weight: bold;\n flex-basis: calc(100% / 6);\n margin-left: ", ";\n padding-bottom: 0;\n }\n\n .heading-title-empty {\n flex-basis: 5%;\n margin-left: 1rem;\n }\n\n @media (max-width: ", ") {\n display: none;\n }\n"])), function (props) {
|
|
10903
10959
|
return props.theme.marginPaddings[0];
|
|
10904
10960
|
}, function (props) {
|
|
10905
10961
|
return props.theme.colors.primary;
|
|
@@ -10929,8 +10985,8 @@
|
|
|
10929
10985
|
|
|
10930
10986
|
var MyInterestTitleHeading$1 = themed(MyInterestTitleHeading);
|
|
10931
10987
|
|
|
10932
|
-
var _templateObject$
|
|
10933
|
-
var SvgWrapper$2 = styled__default.span(_templateObject$
|
|
10988
|
+
var _templateObject$E;
|
|
10989
|
+
var SvgWrapper$2 = styled__default.span(_templateObject$E || (_templateObject$E = _taggedTemplateLiteral(["\n svg {\n path {\n fill: ", ";\n }\n }\n"])), function (props) {
|
|
10934
10990
|
return props.theme.colors.primary;
|
|
10935
10991
|
});
|
|
10936
10992
|
var AccountIcon = themed(function () {
|