@royaloperahouse/harmonic 1.0.9 → 1.0.10
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/CHANGELOG.md +4 -0
- package/dist/components/index.d.ts +2 -2
- package/dist/components/molecules/CastFilter/{CastFilters.d.ts → Original/CastFilters.d.ts} +1 -1
- package/dist/components/molecules/CastFilter/Original/CastFilters.style.d.ts +5 -0
- package/dist/components/molecules/CastFilter/Original/index.d.ts +2 -0
- package/dist/components/molecules/CastFilter/Variant/CastFiltersVariant.d.ts +9 -0
- package/dist/components/molecules/CastFilter/Variant/CastFiltersVariant.style.d.ts +6 -0
- package/dist/components/molecules/CastFilter/Variant/index.d.ts +2 -0
- package/dist/components/molecules/index.d.ts +3 -2
- package/dist/harmonic.cjs.development.js +600 -297
- package/dist/harmonic.cjs.development.js.map +1 -1
- package/dist/harmonic.cjs.production.min.js +1 -1
- package/dist/harmonic.cjs.production.min.js.map +1 -1
- package/dist/harmonic.esm.js +600 -298
- package/dist/harmonic.esm.js.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/types/types.d.ts +12 -0
- package/package.json +2 -1
- package/dist/components/molecules/CastFilter/index.d.ts +0 -2
|
@@ -6425,13 +6425,13 @@ var Cards = function Cards(_ref) {
|
|
|
6425
6425
|
};
|
|
6426
6426
|
|
|
6427
6427
|
var _templateObject$I, _templateObject2$v, _templateObject3$j, _templateObject4$i, _templateObject5$e, _templateObject6$9, _templateObject7$6, _templateObject8$4, _templateObject9$3, _templateObject0$3, _templateObject1$2, _templateObject10$2;
|
|
6428
|
-
var CastFiltersComponentWrapper = /*#__PURE__*/styled__default.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 20px;\n\n @media ", " {\n
|
|
6428
|
+
var CastFiltersComponentWrapper = /*#__PURE__*/styled__default.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 20px;\n\n @media ", " {\n gap: 15px;\n }\n"])), devices.mobile);
|
|
6429
6429
|
var CastFiltersWrapper = /*#__PURE__*/styled__default.div(_templateObject2$v || (_templateObject2$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 32px;\n\n @media ", " {\n gap: 15px;\n }\n"])), devices.mobile);
|
|
6430
6430
|
var HeadingTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 44px;\n display: flex;\n align-items: center;\n"])));
|
|
6431
|
-
var RotatorButtonsWrapper = /*#__PURE__*/styled__default(GridItem)(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["
|
|
6431
|
+
var RotatorButtonsWrapper = /*#__PURE__*/styled__default(GridItem)(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
6432
6432
|
var CastWrapper = /*#__PURE__*/styled__default.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 20px;\n overflow-x: hidden;\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n ::-webkit-scrollbar {\n display: none;\n }\n\n @media ", " {\n flex-direction: column;\n gap: 10px;\n overflow-x: scroll;\n }\n"])), devices.mobile);
|
|
6433
|
-
var ActionButtons = /*#__PURE__*/styled__default.div(_templateObject6$9 || (_templateObject6$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: baseline;\n gap: 32px;\n\n .mobile-only {\n visibility: hidden;\n\n p {\n font-size: 14px;\n line-height: 17px;\n }\n }\n\n @media ", " {\n .mobile-only {\n visibility: visible;\n padding-block: 24px;\n font-size: 17px;\n line-height: 24px;\n }\n\n
|
|
6434
|
-
var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject7$6 || (_templateObject7$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 6px;\n margin-block-start: 2px;\n margin-inline: 2px;\n\n p {\n font-size: 14px;\n line-height: 17px;\n }\n\n :focus-visible {\n outline: none;\n\n & > div:first-child {\n outline: 2px solid var(--color-base-black);\n }\n }\n\n @media ", " {\n
|
|
6433
|
+
var ActionButtons = /*#__PURE__*/styled__default.div(_templateObject6$9 || (_templateObject6$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: baseline;\n gap: 32px;\n\n .mobile-only {\n visibility: hidden;\n\n p {\n font-size: 14px;\n line-height: 17px;\n }\n }\n\n @media ", " {\n .mobile-only {\n visibility: visible;\n padding-block: 24px;\n font-size: 17px;\n line-height: 24px;\n }\n\n :has(.mobile-only) {\n justify-content: left;\n }\n\n :not(:has(.mobile-only)) {\n padding-block: 12px;\n }\n\n a {\n width: fit-content;\n }\n }\n"])), devices.mobile);
|
|
6434
|
+
var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject7$6 || (_templateObject7$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 6px;\n margin-block-start: 2px;\n margin-inline: 2px;\n\n p {\n font-size: 14px;\n line-height: 17px;\n }\n\n :focus-visible {\n outline: none;\n\n & > div:first-child {\n outline: 2px solid var(--color-base-black);\n }\n }\n\n @media ", " {\n p {\n font-size: 17px;\n line-height: 24px;\n }\n }\n"])), devices.mobile);
|
|
6435
6435
|
var PersonToggle = /*#__PURE__*/styled__default.div(_templateObject8$4 || (_templateObject8$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n width: 86px;\n height: 86px;\n min-width: 86px;\n border: 4px solid;\n border-color: ", ";\n border-radius: 50%;\n background: var(--color-base-white);\n position: relative;\n box-shadow: inset 0 0 0 4px var(--color-base-white);\n"])), function (_ref) {
|
|
6436
6436
|
var isSelected = _ref.isSelected;
|
|
6437
6437
|
return isSelected ? 'var(--color-primary-red)' : 'var(--color-base-light-grey)';
|
|
@@ -6443,7 +6443,7 @@ var PersonImage = /*#__PURE__*/styled__default.img(_templateObject9$3 || (_templ
|
|
|
6443
6443
|
var isDefaultPlaceholder = _ref3.isDefaultPlaceholder;
|
|
6444
6444
|
return isDefaultPlaceholder && "\n transform: scale(1.24);\n ";
|
|
6445
6445
|
});
|
|
6446
|
-
var PersonName = /*#__PURE__*/styled__default.div(_templateObject0$3 || (_templateObject0$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 86px;\n display: flex;\n flex-wrap: wrap;\n text-align: center;\n
|
|
6446
|
+
var PersonName = /*#__PURE__*/styled__default.div(_templateObject0$3 || (_templateObject0$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 86px;\n display: flex;\n flex-wrap: wrap;\n text-align: center;\n"])));
|
|
6447
6447
|
var Decal = /*#__PURE__*/styled__default.div(_templateObject1$2 || (_templateObject1$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 20px;\n height: 20px;\n border-radius: 50%;\n background: var(--color-primary-red);\n display: ", ";\n position: absolute;\n top: 6px;\n right: -6px;\n align-items: center;\n justify-content: center;\n\n span {\n display: ", ";\n width: 65%;\n height: 65%;\n }\n"])), function (_ref4) {
|
|
6448
6448
|
var isSelected = _ref4.isSelected;
|
|
6449
6449
|
return isSelected ? 'flex' : 'none';
|
|
@@ -6453,12 +6453,18 @@ var Decal = /*#__PURE__*/styled__default.div(_templateObject1$2 || (_templateObj
|
|
|
6453
6453
|
});
|
|
6454
6454
|
var EmptySelectionTextSpacer = /*#__PURE__*/styled__default.div(_templateObject10$2 || (_templateObject10$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: hidden;\n\n @media ", " {\n visibility: visible;\n min-height: var(--button-height);\n }\n"])), devices.mobile);
|
|
6455
6455
|
|
|
6456
|
+
var _templateObject$J, _templateObject2$w, _templateObject3$k, _templateObject5$f;
|
|
6457
|
+
var CastFiltersComponentWrapper$1 = /*#__PURE__*/styled__default(CastFiltersComponentWrapper)(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n flex-direction: column-reverse;\n }\n"])), devices.mobile);
|
|
6458
|
+
var RotatorButtonsWrapper$1 = /*#__PURE__*/styled__default(RotatorButtonsWrapper)(_templateObject2$w || (_templateObject2$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
6459
|
+
var PersonWrapper$1 = /*#__PURE__*/styled__default(PersonWrapper)(_templateObject3$k || (_templateObject3$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n flex-direction: row;\n gap: 20px;\n margin-block-end: 2px;\n margin-inline-end: unset;\n }\n"])), devices.mobile);
|
|
6460
|
+
var ActionButtons$1 = /*#__PURE__*/styled__default(ActionButtons)(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n flex-direction: row-reverse;\n gap: unset;\n justify-content: space-between;\n border-block-end: 2px solid var(--base-color-light-grey);\n }\n"])), devices.mobile);
|
|
6461
|
+
|
|
6456
6462
|
var defaultPlaceholderImage = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23c9c9c9%3Bstroke%3A%23c9c9c9%3B%7D.cls-1%2C.cls-2%2C.cls-3%7Bstroke-miterlimit%3A10%3B%7D.cls-2%7Bfill-rule%3Aevenodd%3B%7D.cls-2%2C.cls-3%7Bfill%3A%2372767c%3Bstroke%3A%2372767c%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M50.42%2C89.58c21.86%2C0%2C39.58-17.72%2C39.58-39.58S72.28%2C10.42%2C50.42%2C10.42%2C10.83%2C28.14%2C10.83%2C50s17.72%2C39.58%2C39.58%2C39.58Z%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M50.4%2C89.58c10.88%2C0%2C20.75-4.42%2C27.92-11.54-4.96-10.46-15.58-17.71-27.92-17.71s-22.96%2C7.25-27.92%2C17.71c7.17%2C7.12%2C17%2C11.54%2C27.92%2C11.54Z%22%2F%3E%3Cpath%20class%3D%22cls-3%22%20d%3D%22M50.4%2C55.67c8.05%2C0%2C14.58-6.53%2C14.58-14.58s-6.53-14.58-14.58-14.58-14.58%2C6.53-14.58%2C14.58%2C6.53%2C14.58%2C14.58%2C14.58Z%22%2F%3E%3C%2Fsvg%3E";
|
|
6457
6463
|
|
|
6458
|
-
var _templateObject$
|
|
6464
|
+
var _templateObject$K, _templateObject2$x;
|
|
6459
6465
|
var SWIPE_SLIDE_CLASS_NAME = 'swipe-slide';
|
|
6460
|
-
var SwipeContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
6461
|
-
var SwipeTrack = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
6466
|
+
var SwipeContainer = /*#__PURE__*/styled__default.div(_templateObject$K || (_templateObject$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n width: 100%;\n touch-action: pan-y;\n"])));
|
|
6467
|
+
var SwipeTrack = /*#__PURE__*/styled__default.div(_templateObject2$x || (_templateObject2$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n transition: ", ";\n transform: translateX(", ");\n\n .", " {\n flex-shrink: 0;\n }\n"])), function (_ref) {
|
|
6462
6468
|
var transitioning = _ref.transitioning;
|
|
6463
6469
|
return transitioning ? 'transform 0.3s ease' : 'none';
|
|
6464
6470
|
}, function (_ref2) {
|
|
@@ -6876,7 +6882,8 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
6876
6882
|
greyscale = _ref$greyscale === void 0 ? false : _ref$greyscale,
|
|
6877
6883
|
_ref$selectedIndices = _ref.selectedIndices,
|
|
6878
6884
|
selectedIndices = _ref$selectedIndices === void 0 ? [] : _ref$selectedIndices,
|
|
6879
|
-
selectedIds = _ref.selectedIds
|
|
6885
|
+
selectedIds = _ref.selectedIds,
|
|
6886
|
+
posthog = _ref.posthog;
|
|
6880
6887
|
var _useViewport = useViewport(),
|
|
6881
6888
|
isMobile = _useViewport.isMobile;
|
|
6882
6889
|
var castWrapperRef = React.useRef(null);
|
|
@@ -7018,6 +7025,9 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7018
7025
|
if (onSelectId) onSelectId(itemId);
|
|
7019
7026
|
if (onSelect) onSelect(index);
|
|
7020
7027
|
if (onClick) onClick();
|
|
7028
|
+
posthog == null || posthog.capture('cast_filter_person_card_click', {
|
|
7029
|
+
variant: 'control'
|
|
7030
|
+
});
|
|
7021
7031
|
}, [onSelect, onSelectId]);
|
|
7022
7032
|
var handlePersonKeydown = React__default.useCallback(function (e, index, itemId, onClick) {
|
|
7023
7033
|
if (e.key === 'Enter' || e.key === ' ' || e.key === 'Spacebar') {
|
|
@@ -7040,7 +7050,7 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7040
7050
|
var personSelectionId = getCastItemSelectionId(person);
|
|
7041
7051
|
var isSelected = isIdSelectionMode ? selectedIdsSet.has(personSelectionId) : selectedIndices.includes(index);
|
|
7042
7052
|
var personImage = image || placeholderImage || defaultPlaceholderImage;
|
|
7043
|
-
return /*#__PURE__*/React__default.createElement(PersonWrapper, {
|
|
7053
|
+
return /*#__PURE__*/React__default.createElement(PersonWrapper$1, {
|
|
7044
7054
|
key: personSelectionId,
|
|
7045
7055
|
"aria-selected": isSelected,
|
|
7046
7056
|
"aria-label": ariaLabel != null ? ariaLabel : name,
|
|
@@ -7053,7 +7063,8 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7053
7063
|
},
|
|
7054
7064
|
onKeyDown: function onKeyDown(e) {
|
|
7055
7065
|
return handlePersonKeydown(e, index, personSelectionId, _onClick);
|
|
7056
|
-
}
|
|
7066
|
+
},
|
|
7067
|
+
"data-roh": "cast-filter-person-card"
|
|
7057
7068
|
}, /*#__PURE__*/React__default.createElement(PersonToggle, {
|
|
7058
7069
|
isSelected: isSelected,
|
|
7059
7070
|
"aria-hidden": "true"
|
|
@@ -7073,7 +7084,7 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7073
7084
|
}, name)));
|
|
7074
7085
|
});
|
|
7075
7086
|
};
|
|
7076
|
-
return /*#__PURE__*/React__default.createElement(CastFiltersComponentWrapper, {
|
|
7087
|
+
return /*#__PURE__*/React__default.createElement(CastFiltersComponentWrapper$1, {
|
|
7077
7088
|
className: className
|
|
7078
7089
|
}, /*#__PURE__*/React__default.createElement(CastFiltersWrapper, null, /*#__PURE__*/React__default.createElement(Grid, null, headingText && (/*#__PURE__*/React__default.createElement(GridItem, {
|
|
7079
7090
|
columnStartDesktop: 1,
|
|
@@ -7082,7 +7093,7 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7082
7093
|
columnSpanDevice: 9
|
|
7083
7094
|
}, /*#__PURE__*/React__default.createElement(HeadingTextWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7084
7095
|
size: "large"
|
|
7085
|
-
}, headingText)))), showRotatorButtons && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper, {
|
|
7096
|
+
}, headingText)))), showRotatorButtons && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$1, {
|
|
7086
7097
|
columnStartDesktop: 16,
|
|
7087
7098
|
columnSpanDesktop: 2
|
|
7088
7099
|
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
@@ -7107,29 +7118,320 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7107
7118
|
ref: swipeRef,
|
|
7108
7119
|
onOverflowChange: handleOverflowChange,
|
|
7109
7120
|
limitDragToNavigableRange: true
|
|
7110
|
-
}, getPersonCards())))), showActionButtonsSection && (/*#__PURE__*/React__default.createElement(ActionButtons, null, selectedStateIndices.length === 0 && emptySelectionText && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7121
|
+
}, getPersonCards())))), showActionButtonsSection && (/*#__PURE__*/React__default.createElement(ActionButtons$1, null, selectedStateIndices.length === 0 && emptySelectionText && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7111
7122
|
size: "medium",
|
|
7112
7123
|
className: "mobile-only"
|
|
7113
7124
|
}, emptySelectionText)), selectedStateIndices.length === 0 && !emptySelectionText && /*#__PURE__*/React__default.createElement(EmptySelectionTextSpacer, null), selectedStateIndices.length > 0 && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, (onApply || onApplyIds) && (/*#__PURE__*/React__default.createElement(PrimaryButton, {
|
|
7114
7125
|
onClick: function onClick() {
|
|
7115
7126
|
if (onApply) onApply(selectedStateIndices);
|
|
7116
7127
|
if (onApplyIds) onApplyIds(selectedStateIds);
|
|
7117
|
-
}
|
|
7128
|
+
},
|
|
7129
|
+
"data-roh": "cast-filter-apply"
|
|
7118
7130
|
}, ctaText != null ? ctaText : 'Apply')), onClear && (/*#__PURE__*/React__default.createElement(TextLink, {
|
|
7119
7131
|
tabIndex: 0,
|
|
7120
7132
|
role: "button",
|
|
7121
7133
|
onClick: onClear,
|
|
7122
|
-
onKeyDown: handleClearKeydown
|
|
7134
|
+
onKeyDown: handleClearKeydown,
|
|
7135
|
+
"data-roh": "cast-filter-clear"
|
|
7123
7136
|
}, textLinkText != null ? textLinkText : 'Clear')))))));
|
|
7124
7137
|
};
|
|
7125
7138
|
|
|
7126
|
-
var _templateObject$
|
|
7127
|
-
var
|
|
7128
|
-
var
|
|
7129
|
-
var
|
|
7130
|
-
var
|
|
7131
|
-
var
|
|
7132
|
-
var
|
|
7139
|
+
var _templateObject$L, _templateObject2$y, _templateObject3$l, _templateObject4$j, _templateObject5$g, _templateObject6$a;
|
|
7140
|
+
var CastFiltersWrapperVariant = /*#__PURE__*/styled__default(CastFiltersWrapper)(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0px;\n"])));
|
|
7141
|
+
var AppliedCastFiltersPortal = /*#__PURE__*/styled__default.div(_templateObject2$y || (_templateObject2$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &:has(> div[data-roh='cast-applied']) {\n margin-bottom: 32px;\n }\n"])));
|
|
7142
|
+
var CastFiltersGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$l || (_templateObject3$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n"])));
|
|
7143
|
+
var CastWrapperVariant = /*#__PURE__*/styled__default(CastWrapper)(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 20px;\n"])));
|
|
7144
|
+
var HeadingTextWrapperVariant = /*#__PURE__*/styled__default(HeadingTextWrapper)(_templateObject5$g || (_templateObject5$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n p {\n font-size: 17px;\n }\n }\n"])), devices.mobile);
|
|
7145
|
+
var CastFiltersComponentWrapperVariant = /*#__PURE__*/styled__default(CastFiltersComponentWrapper)(_templateObject6$a || (_templateObject6$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0px;\n\n @media ", " {\n gap: 0px;\n }\n"])), devices.mobile);
|
|
7146
|
+
|
|
7147
|
+
var CastFiltersVariant = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
7148
|
+
var cast = _ref.cast,
|
|
7149
|
+
headingText = _ref.headingText,
|
|
7150
|
+
ctaText = _ref.ctaText,
|
|
7151
|
+
textLinkText = _ref.textLinkText,
|
|
7152
|
+
emptySelectionText = _ref.emptySelectionText,
|
|
7153
|
+
placeholderImage = _ref.placeholderImage,
|
|
7154
|
+
listRoleDescription = _ref.listRoleDescription,
|
|
7155
|
+
className = _ref.className,
|
|
7156
|
+
onSelect = _ref.onSelect,
|
|
7157
|
+
onSelectId = _ref.onSelectId,
|
|
7158
|
+
onApply = _ref.onApply,
|
|
7159
|
+
onApplyIds = _ref.onApplyIds,
|
|
7160
|
+
onClear = _ref.onClear,
|
|
7161
|
+
_ref$greyscale = _ref.greyscale,
|
|
7162
|
+
greyscale = _ref$greyscale === void 0 ? false : _ref$greyscale,
|
|
7163
|
+
_ref$selectedIndices = _ref.selectedIndices,
|
|
7164
|
+
selectedIndices = _ref$selectedIndices === void 0 ? [] : _ref$selectedIndices,
|
|
7165
|
+
selectedIds = _ref.selectedIds,
|
|
7166
|
+
_ref$showCastFilterAp = _ref.showCastFilterApply,
|
|
7167
|
+
showCastFilterApply = _ref$showCastFilterAp === void 0 ? false : _ref$showCastFilterAp,
|
|
7168
|
+
appliedCast = _ref.appliedCast,
|
|
7169
|
+
posthog = _ref.posthog;
|
|
7170
|
+
var _useViewport = useViewport(),
|
|
7171
|
+
isMobile = _useViewport.isMobile;
|
|
7172
|
+
var castWrapperRef = React.useRef(null);
|
|
7173
|
+
var isDraggingRef = React.useRef(false);
|
|
7174
|
+
var startXRef = React.useRef(0);
|
|
7175
|
+
var scrollStartRef = React.useRef(0);
|
|
7176
|
+
var hasDraggedRef = React.useRef(false);
|
|
7177
|
+
var swipeRef = React.useRef(null);
|
|
7178
|
+
var _useState = React.useState(false),
|
|
7179
|
+
availablePrev = _useState[0],
|
|
7180
|
+
setAvailablePrev = _useState[1];
|
|
7181
|
+
var _useState2 = React.useState(cast.length > 1),
|
|
7182
|
+
availableNext = _useState2[0],
|
|
7183
|
+
setAvailableNext = _useState2[1];
|
|
7184
|
+
var _useState3 = React.useState(true),
|
|
7185
|
+
showRotatorButtons = _useState3[0],
|
|
7186
|
+
setShowRotatorButtons = _useState3[1];
|
|
7187
|
+
var onIndexChangeHandler = function onIndexChangeHandler(index) {
|
|
7188
|
+
setAvailablePrev(index > 0);
|
|
7189
|
+
setAvailableNext(function () {
|
|
7190
|
+
var _swipeRef$current$has, _swipeRef$current;
|
|
7191
|
+
return (_swipeRef$current$has = (_swipeRef$current = swipeRef.current) == null ? void 0 : _swipeRef$current.hasNext()) != null ? _swipeRef$current$has : index < Math.max(0, cast.length - 1);
|
|
7192
|
+
});
|
|
7193
|
+
};
|
|
7194
|
+
React.useEffect(function () {
|
|
7195
|
+
setAvailablePrev(false);
|
|
7196
|
+
setAvailableNext(function () {
|
|
7197
|
+
var _swipeRef$current$has2, _swipeRef$current2;
|
|
7198
|
+
return (_swipeRef$current$has2 = (_swipeRef$current2 = swipeRef.current) == null ? void 0 : _swipeRef$current2.hasNext()) != null ? _swipeRef$current$has2 : cast.length > 1;
|
|
7199
|
+
});
|
|
7200
|
+
}, [cast.length]);
|
|
7201
|
+
var handleOverflowChange = function handleOverflowChange(overflow) {
|
|
7202
|
+
var _swipeRef$current3;
|
|
7203
|
+
setShowRotatorButtons(overflow);
|
|
7204
|
+
var hasNext = (_swipeRef$current3 = swipeRef.current) == null ? void 0 : _swipeRef$current3.hasNext();
|
|
7205
|
+
if (typeof hasNext === 'boolean') {
|
|
7206
|
+
setAvailableNext(hasNext);
|
|
7207
|
+
} else {
|
|
7208
|
+
setAvailableNext(overflow);
|
|
7209
|
+
}
|
|
7210
|
+
};
|
|
7211
|
+
var onNext = function onNext() {
|
|
7212
|
+
var _swipeRef$current4;
|
|
7213
|
+
if (!availableNext) return;
|
|
7214
|
+
(_swipeRef$current4 = swipeRef.current) == null || _swipeRef$current4.nextSlide();
|
|
7215
|
+
};
|
|
7216
|
+
var onPrev = function onPrev() {
|
|
7217
|
+
var _swipeRef$current5;
|
|
7218
|
+
if (!availablePrev) return;
|
|
7219
|
+
(_swipeRef$current5 = swipeRef.current) == null || _swipeRef$current5.prevSlide();
|
|
7220
|
+
};
|
|
7221
|
+
React.useEffect(function () {
|
|
7222
|
+
var el = castWrapperRef.current;
|
|
7223
|
+
if (!el) return undefined;
|
|
7224
|
+
var handleKeydown = function handleKeydown(e) {
|
|
7225
|
+
if (!el.contains(document.activeElement)) return;
|
|
7226
|
+
if (e.key === 'ArrowRight') {
|
|
7227
|
+
var _swipeRef$current6;
|
|
7228
|
+
e.preventDefault();
|
|
7229
|
+
(_swipeRef$current6 = swipeRef.current) == null || _swipeRef$current6.nextSlide();
|
|
7230
|
+
} else if (e.key === 'ArrowLeft') {
|
|
7231
|
+
var _swipeRef$current7;
|
|
7232
|
+
e.preventDefault();
|
|
7233
|
+
(_swipeRef$current7 = swipeRef.current) == null || _swipeRef$current7.prevSlide();
|
|
7234
|
+
}
|
|
7235
|
+
};
|
|
7236
|
+
el.addEventListener('keydown', handleKeydown);
|
|
7237
|
+
return function () {
|
|
7238
|
+
return el.removeEventListener('keydown', handleKeydown);
|
|
7239
|
+
};
|
|
7240
|
+
}, []);
|
|
7241
|
+
var handleMouseDown = React.useCallback(function (e) {
|
|
7242
|
+
if (!isMobile || !castWrapperRef.current) return;
|
|
7243
|
+
isDraggingRef.current = true;
|
|
7244
|
+
hasDraggedRef.current = false;
|
|
7245
|
+
startXRef.current = e.clientX;
|
|
7246
|
+
scrollStartRef.current = castWrapperRef.current.scrollLeft;
|
|
7247
|
+
if (e.target === castWrapperRef.current) e.preventDefault();
|
|
7248
|
+
}, [isMobile]);
|
|
7249
|
+
var handleMouseMove = React.useCallback(function (e) {
|
|
7250
|
+
if (!isMobile || !isDraggingRef.current || !castWrapperRef.current) return;
|
|
7251
|
+
var deltaX = e.clientX - startXRef.current;
|
|
7252
|
+
var threshold = 5;
|
|
7253
|
+
if (Math.abs(deltaX) > threshold) {
|
|
7254
|
+
hasDraggedRef.current = true;
|
|
7255
|
+
e.preventDefault();
|
|
7256
|
+
castWrapperRef.current.scrollLeft = scrollStartRef.current - deltaX;
|
|
7257
|
+
}
|
|
7258
|
+
}, [isMobile]);
|
|
7259
|
+
var handleMouseUp = React.useCallback(function () {
|
|
7260
|
+
if (!isMobile) return;
|
|
7261
|
+
isDraggingRef.current = false;
|
|
7262
|
+
setTimeout(function () {
|
|
7263
|
+
hasDraggedRef.current = false;
|
|
7264
|
+
}, 0);
|
|
7265
|
+
}, [isMobile]);
|
|
7266
|
+
var handleMouseLeave = React.useCallback(function () {
|
|
7267
|
+
if (!isMobile) return;
|
|
7268
|
+
isDraggingRef.current = false;
|
|
7269
|
+
hasDraggedRef.current = false;
|
|
7270
|
+
}, [isMobile]);
|
|
7271
|
+
var getCastItemSelectionId = React.useCallback(function (person) {
|
|
7272
|
+
if (person.id !== undefined && person.id !== null) return String(person.id);
|
|
7273
|
+
if (person.slug !== undefined && person.slug !== null) return String(person.slug);
|
|
7274
|
+
return person.name;
|
|
7275
|
+
}, []);
|
|
7276
|
+
var isIdSelectionMode = selectedIds !== undefined;
|
|
7277
|
+
var selectedIdsSet = React.useMemo(function () {
|
|
7278
|
+
var ids = selectedIds != null ? selectedIds : [];
|
|
7279
|
+
return new Set(ids.map(function (id) {
|
|
7280
|
+
return String(id);
|
|
7281
|
+
}));
|
|
7282
|
+
}, [selectedIds]);
|
|
7283
|
+
var selectedStateIndices = React.useMemo(function () {
|
|
7284
|
+
if (!isIdSelectionMode) return selectedIndices;
|
|
7285
|
+
return cast.flatMap(function (person, index) {
|
|
7286
|
+
var itemId = getCastItemSelectionId(person);
|
|
7287
|
+
return selectedIdsSet.has(itemId) ? [index] : [];
|
|
7288
|
+
});
|
|
7289
|
+
}, [cast, getCastItemSelectionId, isIdSelectionMode, selectedIdsSet, selectedIndices]);
|
|
7290
|
+
var selectedStateIds = React.useMemo(function () {
|
|
7291
|
+
if (isIdSelectionMode) {
|
|
7292
|
+
return cast.filter(function (person) {
|
|
7293
|
+
return selectedIdsSet.has(getCastItemSelectionId(person));
|
|
7294
|
+
}).map(function (person) {
|
|
7295
|
+
return getCastItemSelectionId(person);
|
|
7296
|
+
});
|
|
7297
|
+
}
|
|
7298
|
+
return selectedIndices.map(function (index) {
|
|
7299
|
+
return cast[index];
|
|
7300
|
+
}).filter(function (person) {
|
|
7301
|
+
return person !== undefined;
|
|
7302
|
+
}).map(function (person) {
|
|
7303
|
+
return getCastItemSelectionId(person);
|
|
7304
|
+
});
|
|
7305
|
+
}, [cast, getCastItemSelectionId, isIdSelectionMode, selectedIdsSet, selectedIndices]);
|
|
7306
|
+
var handleClick = React__default.useCallback(function (index, itemId, onClick) {
|
|
7307
|
+
if (hasDraggedRef.current) return;
|
|
7308
|
+
if (onSelectId) onSelectId(itemId);
|
|
7309
|
+
if (onSelect) onSelect(index);
|
|
7310
|
+
if (onClick) onClick();
|
|
7311
|
+
posthog == null || posthog.capture('cast_filter_person_card_click', {
|
|
7312
|
+
variant: 'evergreen-cast-filter'
|
|
7313
|
+
});
|
|
7314
|
+
}, [onSelect, onSelectId]);
|
|
7315
|
+
var handlePersonKeydown = React__default.useCallback(function (e, index, itemId, onClick) {
|
|
7316
|
+
if (e.key === 'Enter' || e.key === ' ' || e.key === 'Spacebar') {
|
|
7317
|
+
e.preventDefault();
|
|
7318
|
+
handleClick(index, itemId, onClick);
|
|
7319
|
+
}
|
|
7320
|
+
}, [handleClick]);
|
|
7321
|
+
var handleClearKeydown = React__default.useCallback(function (e) {
|
|
7322
|
+
if (e.key === 'Enter' && onClear) {
|
|
7323
|
+
onClear();
|
|
7324
|
+
}
|
|
7325
|
+
}, [onClear]);
|
|
7326
|
+
var showActionButtonsSection = onApply || onClear || emptySelectionText;
|
|
7327
|
+
var getPersonCards = function getPersonCards() {
|
|
7328
|
+
return cast.map(function (person, index) {
|
|
7329
|
+
var name = person.name,
|
|
7330
|
+
image = person.image,
|
|
7331
|
+
_onClick = person.onClick,
|
|
7332
|
+
ariaLabel = person['aria-label'];
|
|
7333
|
+
var personSelectionId = getCastItemSelectionId(person);
|
|
7334
|
+
var isApplied = appliedCast.some(function (castMember) {
|
|
7335
|
+
return castMember.name === person.name;
|
|
7336
|
+
});
|
|
7337
|
+
var isSelected = isIdSelectionMode ? selectedIdsSet.has(personSelectionId) : selectedIndices.includes(index);
|
|
7338
|
+
var personImage = image || placeholderImage || defaultPlaceholderImage;
|
|
7339
|
+
return /*#__PURE__*/React__default.createElement(PersonWrapper, {
|
|
7340
|
+
key: personSelectionId,
|
|
7341
|
+
"aria-selected": isSelected,
|
|
7342
|
+
"aria-label": ariaLabel != null ? ariaLabel : name,
|
|
7343
|
+
"aria-posinset": index + 1,
|
|
7344
|
+
"aria-setsize": cast.length,
|
|
7345
|
+
role: "option",
|
|
7346
|
+
tabIndex: 0,
|
|
7347
|
+
onClick: function onClick() {
|
|
7348
|
+
return handleClick(index, personSelectionId, _onClick);
|
|
7349
|
+
},
|
|
7350
|
+
onKeyDown: function onKeyDown(e) {
|
|
7351
|
+
return handlePersonKeydown(e, index, personSelectionId, _onClick);
|
|
7352
|
+
},
|
|
7353
|
+
"data-roh": "cast-filter-person-card"
|
|
7354
|
+
}, /*#__PURE__*/React__default.createElement(PersonToggle, {
|
|
7355
|
+
isSelected: isSelected,
|
|
7356
|
+
"aria-hidden": "true"
|
|
7357
|
+
}, /*#__PURE__*/React__default.createElement(PersonImage, {
|
|
7358
|
+
src: personImage,
|
|
7359
|
+
alt: "",
|
|
7360
|
+
draggable: false,
|
|
7361
|
+
isDefaultPlaceholder: !(!!image || !!placeholderImage),
|
|
7362
|
+
greyscale: greyscale
|
|
7363
|
+
}), /*#__PURE__*/React__default.createElement(Decal, {
|
|
7364
|
+
isSelected: isApplied
|
|
7365
|
+
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
7366
|
+
iconName: "Confirm",
|
|
7367
|
+
color: "white"
|
|
7368
|
+
}))), /*#__PURE__*/React__default.createElement(PersonName, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7369
|
+
size: "medium"
|
|
7370
|
+
}, name)));
|
|
7371
|
+
});
|
|
7372
|
+
};
|
|
7373
|
+
return /*#__PURE__*/React__default.createElement(CastFiltersComponentWrapperVariant, {
|
|
7374
|
+
className: className
|
|
7375
|
+
}, /*#__PURE__*/React__default.createElement(CastFiltersWrapperVariant, null, /*#__PURE__*/React__default.createElement(CastFiltersGrid, null, headingText && (/*#__PURE__*/React__default.createElement(GridItem, {
|
|
7376
|
+
columnStartDesktop: 1,
|
|
7377
|
+
columnSpanDesktop: 10,
|
|
7378
|
+
columnStartDevice: 1,
|
|
7379
|
+
columnSpanDevice: 9
|
|
7380
|
+
}, /*#__PURE__*/React__default.createElement(HeadingTextWrapperVariant, null, /*#__PURE__*/React__default.createElement(NavigationText, {
|
|
7381
|
+
color: "grey"
|
|
7382
|
+
}, headingText)))), showRotatorButtons && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper, {
|
|
7383
|
+
columnStartDesktop: 16,
|
|
7384
|
+
columnSpanDesktop: 2
|
|
7385
|
+
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
7386
|
+
size: "small",
|
|
7387
|
+
onClickNext: onNext,
|
|
7388
|
+
onClickPrev: onPrev,
|
|
7389
|
+
availablePrev: availablePrev,
|
|
7390
|
+
availableNext: availableNext
|
|
7391
|
+
})))), /*#__PURE__*/React__default.createElement(AppliedCastFiltersPortal, {
|
|
7392
|
+
ref: ref
|
|
7393
|
+
}), /*#__PURE__*/React__default.createElement(CastWrapperVariant, {
|
|
7394
|
+
ref: castWrapperRef,
|
|
7395
|
+
role: "listbox",
|
|
7396
|
+
"aria-roledescription": listRoleDescription != null ? listRoleDescription : 'filter list',
|
|
7397
|
+
"aria-label": "filter list",
|
|
7398
|
+
"aria-multiselectable": "true",
|
|
7399
|
+
onMouseDown: handleMouseDown,
|
|
7400
|
+
onMouseMove: handleMouseMove,
|
|
7401
|
+
onMouseUp: handleMouseUp,
|
|
7402
|
+
onMouseLeave: handleMouseLeave
|
|
7403
|
+
}, /*#__PURE__*/React__default.createElement(Swipe, {
|
|
7404
|
+
onIndexChange: onIndexChangeHandler,
|
|
7405
|
+
"data-testid": "cast-filter-swipe",
|
|
7406
|
+
ref: swipeRef,
|
|
7407
|
+
onOverflowChange: handleOverflowChange,
|
|
7408
|
+
limitDragToNavigableRange: true
|
|
7409
|
+
}, getPersonCards()))), showActionButtonsSection && (/*#__PURE__*/React__default.createElement(ActionButtons, null, selectedStateIndices.length === 0 && appliedCast.length === 0 && !showCastFilterApply && emptySelectionText && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7410
|
+
size: "medium",
|
|
7411
|
+
className: "mobile-only"
|
|
7412
|
+
}, emptySelectionText)), selectedStateIndices.length === 0 && appliedCast.length === 0 && !showCastFilterApply && !emptySelectionText && /*#__PURE__*/React__default.createElement(EmptySelectionTextSpacer, null), showCastFilterApply && (onApply || onApplyIds) && (/*#__PURE__*/React__default.createElement(PrimaryButton, {
|
|
7413
|
+
onClick: function onClick() {
|
|
7414
|
+
if (onApply) onApply(selectedStateIndices);
|
|
7415
|
+
if (onApplyIds) onApplyIds(selectedStateIds);
|
|
7416
|
+
},
|
|
7417
|
+
"data-roh": "cast-filter-apply"
|
|
7418
|
+
}, ctaText != null ? ctaText : 'Apply')), onClear && appliedCast.length > 0 && (/*#__PURE__*/React__default.createElement(TextLink, {
|
|
7419
|
+
tabIndex: 0,
|
|
7420
|
+
role: "button",
|
|
7421
|
+
onClick: onClear,
|
|
7422
|
+
onKeyDown: handleClearKeydown,
|
|
7423
|
+
"data-roh": "cast-filter-clear"
|
|
7424
|
+
}, textLinkText != null ? textLinkText : 'Clear')))));
|
|
7425
|
+
});
|
|
7426
|
+
CastFiltersVariant.displayName = 'CastFiltersVariant';
|
|
7427
|
+
|
|
7428
|
+
var _templateObject$M, _templateObject2$z, _templateObject3$m, _templateObject4$k, _templateObject5$h, _templateObject6$b, _templateObject7$7;
|
|
7429
|
+
var ContentWrapper = /*#__PURE__*/styled__default.div(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobileAndTablet);
|
|
7430
|
+
var Wrapper$2 = /*#__PURE__*/styled__default.div(_templateObject2$z || (_templateObject2$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: max-content;\n gap: var(--grid-column-gap);\n margin: 0;\n }\n"])), devices.mobileAndTablet);
|
|
7431
|
+
var AddressWrapper = /*#__PURE__*/styled__default.div(_templateObject3$m || (_templateObject3$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 4px;\n"])));
|
|
7432
|
+
var TitleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$k || (_templateObject4$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: baseline;\n gap: 3px;\n"])));
|
|
7433
|
+
var MobileSuffixWrapper = /*#__PURE__*/styled__default.div(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
7434
|
+
var DesktopSuffixWrapper = /*#__PURE__*/styled__default.div(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
7133
7435
|
var DetailsWrapper = /*#__PURE__*/styled__default.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n a {\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n color: var(--color-base-black);\n text-decoration: underline;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n margin-right: 13px;\n display: inline-block;\n\n &:last-child {\n margin-right: 0;\n }\n\n @media ", " {\n font-size: 17px;\n line-height: 24px;\n }\n }\n"])), devices.mobile);
|
|
7134
7436
|
|
|
7135
7437
|
var ContactCard = function ContactCard(_ref) {
|
|
@@ -7181,13 +7483,13 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
7181
7483
|
}, addressString)))))))));
|
|
7182
7484
|
};
|
|
7183
7485
|
|
|
7184
|
-
var _templateObject$
|
|
7185
|
-
var ContactNewsletterWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
7186
|
-
var ContactNewsletterSeparator = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
7187
|
-
var SignUpWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
7188
|
-
var SignUpText = /*#__PURE__*/styled__default.p(_templateObject4$
|
|
7189
|
-
var ContactWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
7190
|
-
var MediaLinksWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
7486
|
+
var _templateObject$N, _templateObject2$A, _templateObject3$n, _templateObject4$l, _templateObject5$i, _templateObject6$c, _templateObject7$8, _templateObject8$5;
|
|
7487
|
+
var ContactNewsletterWrapper = /*#__PURE__*/styled__default.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: calc(50% - 1px) 2px calc(50% - 1px);\n grid-template-rows: 100px;\n gap: 0;\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content min-content;\n gap: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
7488
|
+
var ContactNewsletterSeparator = /*#__PURE__*/styled__default.div(_templateObject2$A || (_templateObject2$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2;\n justify-self: center;\n height: 100%;\n border: 1px solid var(--base-color-white);\n\n @media ", " {\n & {\n grid-column: auto;\n display: none;\n }\n }\n"])), devices.mobile);
|
|
7489
|
+
var SignUpWrapper = /*#__PURE__*/styled__default.div(_templateObject3$n || (_templateObject3$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1;\n padding-top: 9px;\n justify-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n\n @media ", " {\n & {\n grid-column: auto;\n align-items: start;\n justify-self: start;\n padding-top: 0;\n }\n }\n"])), devices.mobile);
|
|
7490
|
+
var SignUpText = /*#__PURE__*/styled__default.p(_templateObject4$l || (_templateObject4$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-body-2);\n line-height: var(--line-height-body-2);\n width: 60%;\n margin: 0 auto;\n height: 60px;\n text-align: center;\n\n @media ", " {\n & {\n width: 100%;\n height: auto;\n text-align: left;\n font-size: 14px;\n margin-bottom: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
7491
|
+
var ContactWrapper = /*#__PURE__*/styled__default.div(_templateObject5$i || (_templateObject5$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 3;\n justify-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: 9px;\n\n @media ", " {\n & {\n grid-column: auto;\n align-items: start;\n justify-self: start;\n padding-top: 0;\n }\n }\n"])), devices.mobile);
|
|
7492
|
+
var MediaLinksWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: var(--footer-media-gap);\n height: 60px;\n\n @media ", " {\n & {\n height: auto;\n margin-bottom: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
7191
7493
|
var MediaIconWrapper$1 = /*#__PURE__*/styled__default.a(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--footer-media-icon-height);\n width: var(--footer-media-icon-width);\n"])));
|
|
7192
7494
|
var TextLinkWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject8$5 || (_templateObject8$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &&& {\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n }\n"])));
|
|
7193
7495
|
|
|
@@ -7214,17 +7516,17 @@ var ContactNewsletter = function ContactNewsletter(_ref) {
|
|
|
7214
7516
|
}, contact.title))));
|
|
7215
7517
|
};
|
|
7216
7518
|
|
|
7217
|
-
var _templateObject$
|
|
7218
|
-
var BodyTextRelative = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject$
|
|
7219
|
-
var ContentSummaryWrapper = /*#__PURE__*/styled__default.article(_templateObject2$
|
|
7519
|
+
var _templateObject$O, _templateObject2$B, _templateObject3$o, _templateObject4$m, _templateObject5$j, _templateObject6$d;
|
|
7520
|
+
var BodyTextRelative = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
7521
|
+
var ContentSummaryWrapper = /*#__PURE__*/styled__default.article(_templateObject2$B || (_templateObject2$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n justify-items: start;\n align-items: center;\n margin: 20px 0;\n gap: 36px;\n cursor: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n"])), function (props) {
|
|
7220
7522
|
return props.clickable ? 'pointer' : 'default';
|
|
7221
7523
|
}, devices.mobile);
|
|
7222
|
-
var ContentSummaryImageWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
7223
|
-
var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
7524
|
+
var ContentSummaryImageWrapper = /*#__PURE__*/styled__default.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 0 0 33.3%;\n"])));
|
|
7525
|
+
var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject4$m || (_templateObject4$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: ", ";\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n gap: 20px;\n\n & * {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n\n @media ", " {\n margin: 0 20px;\n }\n\n & .content-summary-text-link {\n height: unset;\n }\n"])), function (props) {
|
|
7224
7526
|
return props.showImage ? 2 : '1 / span 4';
|
|
7225
7527
|
}, devices.mobile);
|
|
7226
|
-
var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
7227
|
-
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
7528
|
+
var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
|
|
7529
|
+
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & p:not(:last-child):after {\n content: '\\A\\A';\n white-space: pre;\n }\n\n ", "\n"], ["\n & p:not(:last-child):after {\n content: '\\\\A\\\\A';\n white-space: pre;\n }\n\n ", "\n"])), function (props) {
|
|
7228
7530
|
return !!props.truncate && "\n overflow: hidden;\n position: relative;\n display: -webkit-box;\n -webkit-line-clamp: " + props.truncate + ";\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n min-height: 1em;\n max-height: 3em;\n ";
|
|
7229
7531
|
});
|
|
7230
7532
|
|
|
@@ -7306,21 +7608,21 @@ var ContentSummary = function ContentSummary(_ref) {
|
|
|
7306
7608
|
}), link.text))));
|
|
7307
7609
|
};
|
|
7308
7610
|
|
|
7309
|
-
var _templateObject$
|
|
7310
|
-
var EditorialGrid = /*#__PURE__*/styled__default.div(_templateObject$
|
|
7611
|
+
var _templateObject$P, _templateObject2$C, _templateObject3$p, _templateObject4$n, _templateObject5$k;
|
|
7612
|
+
var EditorialGrid = /*#__PURE__*/styled__default.div(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(12, minmax(0, 1fr));\n gap: var(--grid-column-gap);\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content 24px min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2';\n }\n }\n"])), function (_ref) {
|
|
7311
7613
|
var imageToLeft = _ref.imageToLeft;
|
|
7312
7614
|
return imageToLeft ? "'left left left left left . right right right right right right'" : "'left left left left left left . right right right right right'";
|
|
7313
7615
|
}, devices.mobile);
|
|
7314
|
-
var EditorialImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
7616
|
+
var EditorialImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$C || (_templateObject2$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n align-self: center;\n grid-area: ", ";\n @media ", " {\n & {\n grid-area: row1;\n }\n"])), function (_ref2) {
|
|
7315
7617
|
var imageToLeft = _ref2.imageToLeft;
|
|
7316
7618
|
return imageToLeft ? 'left' : 'right';
|
|
7317
7619
|
}, devices.mobile);
|
|
7318
|
-
var EditorialTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
7620
|
+
var EditorialTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n"])), function (_ref3) {
|
|
7319
7621
|
var imageToLeft = _ref3.imageToLeft;
|
|
7320
7622
|
return imageToLeft ? 'right' : 'left';
|
|
7321
7623
|
}, devices.mobile);
|
|
7322
|
-
var EditorialSubtitle = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject4$
|
|
7323
|
-
var EditorialText = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject5$
|
|
7624
|
+
var EditorialSubtitle = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject4$n || (_templateObject4$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-feature-settings: var(--font-feature-settings-subtitle);\n text-transform: var(--text-transform-subtitle);\n margin-bottom: var(--editorial-subtitle-margin-bottom);\n display: block;\n overflow-wrap: break-word;\n"])));
|
|
7625
|
+
var EditorialText = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-feature-settings: var(--font-feature-settings-body);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n em {\n font-family: var(--font-family-body-italics);\n }\n"])));
|
|
7324
7626
|
|
|
7325
7627
|
var Editorial = function Editorial(_ref) {
|
|
7326
7628
|
var _ref$imagePosition = _ref.imagePosition,
|
|
@@ -7359,10 +7661,10 @@ var Editorial = function Editorial(_ref) {
|
|
|
7359
7661
|
})))));
|
|
7360
7662
|
};
|
|
7361
7663
|
|
|
7362
|
-
var _templateObject$
|
|
7363
|
-
var HotFiltersWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
7364
|
-
var HotFilterOptionsWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
7365
|
-
var StyledHotFiltersButton = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject3$
|
|
7664
|
+
var _templateObject$Q, _templateObject2$D, _templateObject3$q;
|
|
7665
|
+
var HotFiltersWrapper = /*#__PURE__*/styled__default.div(_templateObject$Q || (_templateObject$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: scroll;\n\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n ::-webkit-scrollbar {\n display: none;\n }\n"])));
|
|
7666
|
+
var HotFilterOptionsWrapper = /*#__PURE__*/styled__default.div(_templateObject2$D || (_templateObject2$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n width: fit-content;\n min-width: 400px;\n justify-content: space-between;\n gap: 16px;\n font-family: var(--font-family-sans);\n\n @media ", " {\n gap: 10px;\n }\n"])), devices.mobile);
|
|
7667
|
+
var StyledHotFiltersButton = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject3$q || (_templateObject3$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--color-base-black);\n min-width: fit-content;\n\n @media (hover: hover) and (pointer: fine) {\n :hover {\n color: var(--color-base-white);\n }\n }\n"])));
|
|
7366
7668
|
|
|
7367
7669
|
var _excluded$i = ["text", "onClick"];
|
|
7368
7670
|
var HotFilters = function HotFilters(_ref) {
|
|
@@ -7397,10 +7699,10 @@ var HotFilters = function HotFilters(_ref) {
|
|
|
7397
7699
|
})));
|
|
7398
7700
|
};
|
|
7399
7701
|
|
|
7400
|
-
var _templateObject$
|
|
7401
|
-
var ScrollContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
7402
|
-
var TabsContainerWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
7403
|
-
var StyledTab = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject3$
|
|
7702
|
+
var _templateObject$R, _templateObject2$E, _templateObject3$r;
|
|
7703
|
+
var ScrollContainer = /*#__PURE__*/styled__default.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: scroll;\n\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n ::-webkit-scrollbar {\n display: none;\n }\n\n @media ", " {\n overflow-x: visible;\n }\n"])), devices.mobile);
|
|
7704
|
+
var TabsContainerWrapper = /*#__PURE__*/styled__default.div(_templateObject2$E || (_templateObject2$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n width: fit-content;\n min-width: 400px;\n justify-content: space-between;\n gap: 16px;\n font-family: var(--font-family-sans);\n\n @media ", " {\n width: 100%;\n min-width: 0;\n flex-wrap: wrap;\n justify-content: flex-start;\n gap: 10px;\n }\n"])), devices.mobile);
|
|
7705
|
+
var StyledTab = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject3$r || (_templateObject3$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--color-base-black);\n min-width: fit-content;\n\n &:focus-visible {\n outline: 2px solid var(--color-base-black);\n outline-offset: 2px;\n }\n\n @media (hover: hover) and (pointer: fine) {\n &:hover {\n color: var(--color-base-white);\n }\n }\n\n @media ", " {\n width: auto !important;\n min-width: fit-content;\n flex: 0 0 auto;\n }\n"])), devices.mobile);
|
|
7404
7706
|
|
|
7405
7707
|
var _excluded$j = ["text", "id", "isSelected", "allowedSelectedWith"];
|
|
7406
7708
|
/**
|
|
@@ -7492,10 +7794,10 @@ var getBorderColor$1 = function getBorderColor(variant, colorValue) {
|
|
|
7492
7794
|
return variant === InformationCtaVariants.Primary || variant === InformationCtaVariants.Secondary || variant === undefined ? "border-color: " + colorValue + ";" : '';
|
|
7493
7795
|
};
|
|
7494
7796
|
|
|
7495
|
-
var _templateObject$
|
|
7496
|
-
var InfoWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
7497
|
-
var InfoTitle = /*#__PURE__*/styled__default('div')(_templateObject2$
|
|
7498
|
-
var InfoCTAWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$
|
|
7797
|
+
var _templateObject$S, _templateObject2$F, _templateObject3$s, _templateObject4$o;
|
|
7798
|
+
var InfoWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 60px 0;\n color: var(--information-panel-color);\n background-color: var(--information-panel-bg-color);\n\n @media ", " {\n padding: 40px 0;\n }\n"])), devices.mobile);
|
|
7799
|
+
var InfoTitle = /*#__PURE__*/styled__default('div')(_templateObject2$F || (_templateObject2$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n * {\n margin-block: 0;\n }\n"])));
|
|
7800
|
+
var InfoCTAWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$s || (_templateObject3$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n\n @media ", " {\n margin-top: 16px;\n }\n\n a {\n color: ", ";\n ", "\n ", "\n\n svg path {\n fill: ", ";\n }\n\n :hover:not(:active) {\n color: ", ";\n ", "\n ", "\n\n svg path {\n fill: ", ";\n }\n }\n\n :active {\n color: ", ";\n ", "\n ", "\n\n svg path {\n fill: ", ";\n }\n }\n }\n"])), devices.mobile, function (_ref) {
|
|
7499
7801
|
var variant = _ref.variant,
|
|
7500
7802
|
theme = _ref.theme;
|
|
7501
7803
|
return getTextColor$4(variant, theme, COLORS$4.background);
|
|
@@ -7538,7 +7840,7 @@ var InfoCTAWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$q || (
|
|
|
7538
7840
|
theme = _ref10.theme;
|
|
7539
7841
|
return getTextColor$4(variant, theme, COLORS$4.pressed);
|
|
7540
7842
|
});
|
|
7541
|
-
var InfoBodyWrapper = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject4$
|
|
7843
|
+
var InfoBodyWrapper = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject4$o || (_templateObject4$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--information-panel-color);\n\n a {\n text-decoration: underline;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n color: var(--information-panel-color);\n }\n\n @media ", " {\n padding-top: 4px;\n }\n"])), devices.mobile);
|
|
7542
7844
|
|
|
7543
7845
|
var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
|
|
7544
7846
|
|
|
@@ -7718,31 +8020,31 @@ var Information = function Information(_ref) {
|
|
|
7718
8020
|
})))));
|
|
7719
8021
|
};
|
|
7720
8022
|
|
|
7721
|
-
var _templateObject$
|
|
7722
|
-
var PageHeadingWrapper = /*#__PURE__*/styled__default('div')(_templateObject$
|
|
8023
|
+
var _templateObject$T, _templateObject2$G, _templateObject3$t, _templateObject4$p, _templateObject5$l, _templateObject6$e, _templateObject7$9, _templateObject8$6;
|
|
8024
|
+
var PageHeadingWrapper = /*#__PURE__*/styled__default('div')(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: var(--page-header-bg-color);\n color: var(--color-base-white);\n\n ", ";\n\n h1,\n h2,\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
7723
8025
|
var isPageHeadingWithoutTitle = _ref.isPageHeadingWithoutTitle;
|
|
7724
8026
|
return isPageHeadingWithoutTitle && "\n padding-bottom: 42px;\n ";
|
|
7725
8027
|
}, devices.mobile);
|
|
7726
|
-
var PageHeadingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
8028
|
+
var PageHeadingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$G || (_templateObject2$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n & {\n grid-template-rows: 20px min-content min-content min-content 20px;\n grid-template-areas:\n '. . . . . . . . . . . . . .'\n '. title title title title title title title title title title logo logo .'\n '. text text text text text text text text text text text text .'\n '. button button button button button button button button button button button button .'\n '. . . . . . . . . . . . . .';\n }\n }\n\n @media ", " {\n & {\n ", "\n }\n }\n"])), function (_ref2) {
|
|
7727
8029
|
var isMultipleRow = _ref2.isMultipleRow;
|
|
7728
8030
|
return isMultipleRow ? "\n grid-template-rows: min-content min-content;\n grid-template-areas:\n '. . title title title title title title title title title title . . logo .'\n '. . text text text text text text text text text button button button . .';\n " : "\n grid-template-rows: min-content;\n grid-template-areas:\n '. . title title title title title title title title title title button button button . .';\n ";
|
|
7729
8031
|
}, devices.mobile, devices.tablet, function (_ref3) {
|
|
7730
8032
|
var isMultipleRow = _ref3.isMultipleRow;
|
|
7731
8033
|
return isMultipleRow ? "\n grid-template-rows: min-content min-content;\n grid-template-areas:\n '. title title title title title title title title title title logo logo .'\n '. text text text text text text text text text button button button . '\n " : "\n grid-template-rows: min-content;\n grid-template-areas:\n '. . title title title title title title title title button button button button button .';\n ";
|
|
7732
8034
|
});
|
|
7733
|
-
var BadgeWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8035
|
+
var BadgeWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$t || (_templateObject3$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 35px;\n padding-bottom: 20px;\n\n ", ";\n"])), function (_ref4) {
|
|
7734
8036
|
var isPageHeadingWithoutTitle = _ref4.isPageHeadingWithoutTitle;
|
|
7735
8037
|
return isPageHeadingWithoutTitle && "\n height: 50px;\n padding-bottom: 0;\n margin: 10px 0;\n ";
|
|
7736
8038
|
});
|
|
7737
|
-
var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8039
|
+
var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: title;\n margin-top: 80px;\n\n ", ";\n\n @media ", " {\n & {\n margin-top: 0;\n }\n }\n"])), function (_ref5) {
|
|
7738
8040
|
var isPageHeadingWithoutTitle = _ref5.isPageHeadingWithoutTitle;
|
|
7739
8041
|
return isPageHeadingWithoutTitle && "\n margin-top: 42px;\n ";
|
|
7740
8042
|
}, devices.mobile);
|
|
7741
|
-
var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
8043
|
+
var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject5$l || (_templateObject5$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 20px;\n width: fit-content;\n height: 43px;\n\n ", ";\n\n @media ", " {\n & {\n height: 33px;\n margin-top: 10px;\n margin-bottom: 20px;\n }\n }\n"])), function (_ref6) {
|
|
7742
8044
|
var isPageHeadingWithoutTitle = _ref6.isPageHeadingWithoutTitle;
|
|
7743
8045
|
return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
|
|
7744
8046
|
}, devices.mobile);
|
|
7745
|
-
var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
8047
|
+
var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-base-white);\n grid-area: text;\n align-self: end;\n margin-top: 12px;\n\n h6 {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
7746
8048
|
var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject7$9 || (_templateObject7$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n justify-self: end;\n margin-top: 20px;\n position: relative;\n\n > div {\n position: absolute;\n top: 0;\n right: 0;\n }\n\n @media ", " {\n & {\n align-self: start;\n margin-top: 0;\n\n ", ";\n }\n }\n"])), devices.mobile, function (_ref7) {
|
|
7747
8049
|
var isPageHeadingWithoutTitle = _ref7.isPageHeadingWithoutTitle;
|
|
7748
8050
|
return isPageHeadingWithoutTitle && "\n margin-top: 15px;\n ";
|
|
@@ -7823,9 +8125,9 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
7823
8125
|
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, themedLink), linkText))) : null));
|
|
7824
8126
|
};
|
|
7825
8127
|
|
|
7826
|
-
var _templateObject$
|
|
7827
|
-
var ImpactHeaderWrapper = /*#__PURE__*/styled__default.header(_templateObject$
|
|
7828
|
-
var ImpactTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8128
|
+
var _templateObject$U, _templateObject2$H, _templateObject3$u, _templateObject4$q, _templateObject5$m, _templateObject6$f, _templateObject7$a, _templateObject8$7;
|
|
8129
|
+
var ImpactHeaderWrapper = /*#__PURE__*/styled__default.header(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n background-color: var(--color-base-black);\n padding: 36px 0;\n\n @media ", " {\n padding: 21px 0;\n }\n"])), devices.mobile);
|
|
8130
|
+
var ImpactTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: grid;\n grid-template-columns: ", ";\n padding: 0 50px;\n\n @media ", " {\n padding: 0 50px;\n }\n\n @media ", " {\n padding: 0 20px;\n grid-template-columns: ", ";\n }\n"])), function (_ref) {
|
|
7829
8131
|
var hasButton = _ref.hasButton,
|
|
7830
8132
|
sponsorPresent = _ref.sponsorPresent;
|
|
7831
8133
|
if (hasButton || sponsorPresent) return 'auto 80px 1fr 80px auto';
|
|
@@ -7834,13 +8136,13 @@ var ImpactTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$F ||
|
|
|
7834
8136
|
var sponsorPresent = _ref2.sponsorPresent;
|
|
7835
8137
|
return sponsorPresent ? '1fr 20px auto' : '1fr';
|
|
7836
8138
|
});
|
|
7837
|
-
var TitleButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8139
|
+
var TitleButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1;\n display: flex;\n align-items: center;\n min-width: ", ";\n"])), function (_ref3) {
|
|
7838
8140
|
var sponsorWidth = _ref3.sponsorWidth;
|
|
7839
8141
|
return sponsorWidth ? sponsorWidth + "px" : 'auto';
|
|
7840
8142
|
});
|
|
7841
|
-
var TitleButton = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject4$
|
|
7842
|
-
var MobileButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
7843
|
-
var ImpactTitle = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject6$
|
|
8143
|
+
var TitleButton = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n position: static;\n margin-right: 0;\n }\n"])), devices.mobile);
|
|
8144
|
+
var MobileButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject5$m || (_templateObject5$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 0;\n width: 100%;\n box-sizing: border-box;\n padding: 0 20px 16px 20px;\n"])));
|
|
8145
|
+
var ImpactTitle = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject6$f || (_templateObject6$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: -webkit-box;\n align-self: center;\n grid-column: ", ";\n min-width: 0;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-line-clamp: 2;\n max-height: calc(48px * 2);\n text-align: center;\n padding-bottom: 2px;\n\n @media ", " {\n grid-column: 1;\n -webkit-line-clamp: 4;\n max-height: calc(34px * 4);\n text-align: left;\n }\n"])), function (_ref4) {
|
|
7844
8146
|
var hasColumns = _ref4.hasColumns;
|
|
7845
8147
|
return hasColumns ? '3' : '1';
|
|
7846
8148
|
}, devices.mobile);
|
|
@@ -7850,11 +8152,11 @@ var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject8$7 || (_te
|
|
|
7850
8152
|
return buttonWidth ? buttonWidth + "px" : 'auto';
|
|
7851
8153
|
}, devices.mobile);
|
|
7852
8154
|
|
|
7853
|
-
var _templateObject$
|
|
7854
|
-
var VideoPlayButton$1 = /*#__PURE__*/styled__default.button(_templateObject$
|
|
7855
|
-
var VideoControlsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
7856
|
-
var VideoControlsInnerWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
7857
|
-
var LeftWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8155
|
+
var _templateObject$V, _templateObject2$I, _templateObject3$v, _templateObject4$r;
|
|
8156
|
+
var VideoPlayButton$1 = /*#__PURE__*/styled__default.button(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 80px;\n height: 80px;\n background-color: var(--color-base-transparent);\n border: none;\n cursor: pointer;\n\n @media ", " {\n width: 60px;\n height: 60px;\n }\n"])), devices.mobile);
|
|
8157
|
+
var VideoControlsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n width: 100%;\n"])));
|
|
8158
|
+
var VideoControlsInnerWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 20px;\n\n @media ", " {\n margin: 20px 4px;\n }\n"])), devices.mobile);
|
|
8159
|
+
var LeftWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$r || (_templateObject4$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n"])));
|
|
7858
8160
|
|
|
7859
8161
|
var VideoControlsImpact = function VideoControlsImpact(_ref) {
|
|
7860
8162
|
var videoElementId = _ref.videoElementId,
|
|
@@ -8077,21 +8379,21 @@ var PageHeadingImpact = function PageHeadingImpact(_ref4) {
|
|
|
8077
8379
|
}), isMobile && link && linkText ? (/*#__PURE__*/React__default.createElement(MobileButtonWrapper, null, /*#__PURE__*/React__default.createElement(TitleButton, Object.assign({}, restLink), linkText))) : null));
|
|
8078
8380
|
};
|
|
8079
8381
|
|
|
8080
|
-
var _templateObject$
|
|
8081
|
-
var PanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
8382
|
+
var _templateObject$W, _templateObject2$J, _templateObject3$w, _templateObject4$s, _templateObject5$n;
|
|
8383
|
+
var PanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n grid-template-rows: 48px max-content max-content;\n }\n"])), function (_ref) {
|
|
8082
8384
|
var color = _ref.color;
|
|
8083
8385
|
return "\n background-color: " + (color ? "var(--base-color-" + color + ")" : 'var(--base-color-core)') + ";\n color: " + (color === exports.Colors.White ? 'var(--base-color-black)' : 'var(--base-color-white)') + ";\n ";
|
|
8084
8386
|
}, devices.mobileAndTablet);
|
|
8085
|
-
var LeftPanel = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8387
|
+
var LeftPanel = /*#__PURE__*/styled__default.div(_templateObject2$J || (_templateObject2$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n box-sizing: border-box;\n height: 100%;\n display: grid;\n grid-auto-rows: 90% 1fr;\n gap: 0px 36px;\n align-items: center;\n\n @media ", " {\n grid-area: ", ";\n }\n"])), function (_ref2) {
|
|
8086
8388
|
var hasImage = _ref2.hasImage;
|
|
8087
8389
|
return hasImage ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
|
|
8088
8390
|
}, devices.mobileAndTablet, function (_ref3) {
|
|
8089
8391
|
var hasImage = _ref3.hasImage;
|
|
8090
8392
|
return hasImage ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
|
|
8091
8393
|
});
|
|
8092
|
-
var RightPanel = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8093
|
-
var InfoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8094
|
-
var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
8394
|
+
var RightPanel = /*#__PURE__*/styled__default.div(_templateObject3$w || (_templateObject3$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--base-color-black);\n\n @media ", " {\n grid-area: 2 / 1 / 3 / 15;\n }\n"])), devices.mobileAndTablet);
|
|
8395
|
+
var InfoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$s || (_templateObject4$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 36px;\n max-height: 33vw;\n overflow: hidden;\n\n :first-child * {\n margin-block-start: 0;\n }\n\n @media ", " {\n margin: 36px 20px;\n max-height: unset;\n }\n"])), devices.mobileAndTablet);
|
|
8396
|
+
var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0 0 25px 36px;\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
|
|
8095
8397
|
|
|
8096
8398
|
var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
8097
8399
|
var _image$src, _image$alt;
|
|
@@ -8121,19 +8423,19 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
8121
8423
|
})))));
|
|
8122
8424
|
};
|
|
8123
8425
|
|
|
8124
|
-
var _templateObject$
|
|
8125
|
-
var Wrapper$3 = /*#__PURE__*/styled__default.section(_templateObject$
|
|
8126
|
-
var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8127
|
-
var SponsorWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8128
|
-
var ImageButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8129
|
-
var ContentSection = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
8426
|
+
var _templateObject$X, _templateObject2$K, _templateObject3$x, _templateObject4$t, _templateObject5$o, _templateObject6$g, _templateObject7$b, _templateObject8$8, _templateObject9$4, _templateObject0$4, _templateObject1$3;
|
|
8427
|
+
var Wrapper$3 = /*#__PURE__*/styled__default.section(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
8428
|
+
var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n picture,\n img {\n width: 100%;\n height: 100%;\n }\n"])));
|
|
8429
|
+
var SponsorWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$x || (_templateObject3$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
|
|
8430
|
+
var ImageButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: var(--grid-outer-margin);\n bottom: 20px;\n z-index: 10;\n\n @media ", " {\n right: var(--grid-margin);\n bottom: 10px;\n }\n"])), devices.tablet);
|
|
8431
|
+
var ContentSection = /*#__PURE__*/styled__default.div(_templateObject5$o || (_templateObject5$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--heading-promo-bg-color);\n border-bottom: ", ";\n display: ", ";\n\n @media ", " {\n padding: 12px 0 20px;\n }\n"])), function (_ref) {
|
|
8130
8432
|
var theme = _ref.theme;
|
|
8131
8433
|
return theme == exports.ThemeType.Cinema ? '2px solid var(--color-base-light-grey)' : 'none';
|
|
8132
8434
|
}, function (_ref2) {
|
|
8133
8435
|
var showBlock = _ref2.showBlock;
|
|
8134
8436
|
return showBlock ? 'block' : 'none';
|
|
8135
8437
|
}, devices.mobile);
|
|
8136
|
-
var BadgeWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
8438
|
+
var BadgeWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n height: 32px;\n }\n\n @media ", " {\n margin-bottom: 12px;\n }\n"])), devices.mobile);
|
|
8137
8439
|
var AdditionalContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$b || (_templateObject7$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: start;\n align-items: center;\n width: 200px;\n\n @media ", " {\n order: ", ";\n width: 100%;\n justify-content: center;\n }\n"])), devices.mobile, function (_ref3) {
|
|
8138
8440
|
var isBadgePresent = _ref3.isBadgePresent;
|
|
8139
8441
|
return isBadgePresent ? '1' : '4';
|
|
@@ -8335,7 +8637,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
8335
8637
|
})))))))))));
|
|
8336
8638
|
};
|
|
8337
8639
|
|
|
8338
|
-
var _templateObject$
|
|
8640
|
+
var _templateObject$Y, _templateObject2$L, _templateObject3$y, _templateObject4$u;
|
|
8339
8641
|
var GRID = {
|
|
8340
8642
|
desktop: {
|
|
8341
8643
|
leftWithImage: '1 / 1 / 3 / 7',
|
|
@@ -8348,19 +8650,19 @@ var GRID = {
|
|
|
8348
8650
|
right: '2 / 1 / 3 / 15'
|
|
8349
8651
|
}
|
|
8350
8652
|
};
|
|
8351
|
-
var HighlightPanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
8653
|
+
var HighlightPanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$Y || (_templateObject$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n background-color: ", ";\n color: var(--color-base-white);\n"])), function (_ref) {
|
|
8352
8654
|
var $background = _ref.$background;
|
|
8353
8655
|
return "var(--color-" + $background + ")";
|
|
8354
8656
|
});
|
|
8355
|
-
var LeftPanel$1 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8657
|
+
var LeftPanel$1 = /*#__PURE__*/styled__default.div(_templateObject2$L || (_templateObject2$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n\n box-sizing: border-box;\n height: 100%;\n display: grid;\n grid-auto-rows: 90% 1fr;\n gap: 0 36px;\n align-items: center;\n\n @media ", " {\n grid-area: ", ";\n }\n"])), function (_ref2) {
|
|
8356
8658
|
var hasImage = _ref2.hasImage;
|
|
8357
8659
|
return hasImage ? GRID.desktop.leftWithImage : GRID.desktop.leftNoImage;
|
|
8358
8660
|
}, devices.mobileAndTablet, function (_ref3) {
|
|
8359
8661
|
var hasImage = _ref3.hasImage;
|
|
8360
8662
|
return hasImage ? GRID.mobile.leftWithImage : GRID.mobile.leftNoImage;
|
|
8361
8663
|
});
|
|
8362
|
-
var RightPanel$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8363
|
-
var Wrapper$4 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8664
|
+
var RightPanel$1 = /*#__PURE__*/styled__default.div(_templateObject3$y || (_templateObject3$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--color-base-black);\n\n @media ", " {\n grid-area: ", ";\n }\n"])), GRID.desktop.right, devices.mobileAndTablet, GRID.mobile.right);
|
|
8665
|
+
var Wrapper$4 = /*#__PURE__*/styled__default.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 36px 36px 36px 50px;\n overflow: hidden;\n\n :first-child * {\n margin-block-start: 0;\n }\n\n @media ", " {\n margin: 36px 20px 5px 20px;\n max-height: unset;\n }\n"])), devices.mobileAndTablet);
|
|
8364
8666
|
|
|
8365
8667
|
var PageHeadingHighlight = function PageHeadingHighlight(_ref) {
|
|
8366
8668
|
var _image$src, _image$alt;
|
|
@@ -8383,12 +8685,12 @@ var PageHeadingHighlight = function PageHeadingHighlight(_ref) {
|
|
|
8383
8685
|
})))));
|
|
8384
8686
|
};
|
|
8385
8687
|
|
|
8386
|
-
var _templateObject$
|
|
8387
|
-
var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8388
|
-
var BrandingTextBody = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8389
|
-
var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8390
|
-
var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
8391
|
-
var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$
|
|
8688
|
+
var _templateObject$Z, _templateObject2$M, _templateObject3$z, _templateObject5$p, _templateObject6$h, _templateObject7$c, _templateObject8$9, _templateObject9$5, _templateObject0$5;
|
|
8689
|
+
var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-2);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
|
|
8690
|
+
var BrandingTextBody = /*#__PURE__*/styled__default.div(_templateObject2$M || (_templateObject2$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
|
|
8691
|
+
var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
|
|
8692
|
+
var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$p || (_templateObject5$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 37.5vw;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-color: #000;\n img {\n position: relative;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n video {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: contain;\n @media ", " {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n margin: auto;\n height: auto;\n max-height: 100vh;\n width: 100%;\n object-fit: contain;\n }\n }\n @media ", " {\n height: 85vw;\n max-height: 100vh;\n }\n"])), devices.mobile, devices.mobile);
|
|
8693
|
+
var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$h || (_templateObject6$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 160px;\n grid-template-rows: min-content min-content min-content;\n grid-template-areas:\n '. . . . . . . . . . . . . . . .'\n '. logo logo logo title title title title title title title title cta cta . .'\n '. . . . . . . . . . . . . . . .';\n align-content: center;\n gap: 0 var(--grid-column-gap);\n background-color: ", ";\n color: ", ";\n\n svg {\n width: 210px;\n fill: ", ";\n }\n\n h1::selection,\n div::selection {\n ", ";\n }\n\n @media ", " {\n grid-template-columns: 1fr;\n grid-template-areas:\n 'logo'\n 'title'\n 'cta';\n\n gap: 0;\n row-gap: 16px;\n height: auto;\n padding: 32px 20px;\n svg {\n width: 145px;\n }\n }\n\n @media ", " {\n grid-template-columns: 1fr;\n grid-template-areas:\n 'logo'\n 'title'\n 'cta';\n\n gap: 0;\n row-gap: 16px;\n height: auto;\n padding: 32px 20px;\n\n svg {\n width: 180px;\n }\n }\n"])), function (_ref) {
|
|
8392
8694
|
var invert = _ref.invert,
|
|
8393
8695
|
theme = _ref.theme;
|
|
8394
8696
|
return invert ? theme.colors.white : theme.colors.primary;
|
|
@@ -8637,23 +8939,23 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
8637
8939
|
}), linkText))))));
|
|
8638
8940
|
};
|
|
8639
8941
|
|
|
8640
|
-
var _templateObject$
|
|
8641
|
-
var HighlightsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
8642
|
-
var HighlightTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8643
|
-
var HighlightTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8644
|
-
var HighlightsInfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8942
|
+
var _templateObject$_, _templateObject2$N, _templateObject3$A, _templateObject4$v, _templateObject5$q, _templateObject6$i, _templateObject7$d;
|
|
8943
|
+
var HighlightsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-template-rows: max-content minmax(0, 1fr);\n gap: 0 var(--grid-column-gap);\n background-color: var(--color-base-black);\n color: var(--color-base-white);\n user-select: none;\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
|
|
8944
|
+
var HighlightTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n h1 {\n margin: 0 0 8px 0;\n }\n p {\n text-transform: uppercase;\n }\n"])));
|
|
8945
|
+
var HighlightTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobile);
|
|
8946
|
+
var HighlightsInfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n align-self: center;\n padding: 36px 36px 36px 50px;\n\n @media ", " {\n & {\n grid-area: ", ";\n width: 100%;\n padding: 20px;\n }\n }\n"])), function (_ref) {
|
|
8645
8947
|
var hasImages = _ref.hasImages;
|
|
8646
8948
|
return hasImages ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
|
|
8647
8949
|
}, devices.mobile, function (_ref2) {
|
|
8648
8950
|
var hasImages = _ref2.hasImages;
|
|
8649
8951
|
return hasImages ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
|
|
8650
8952
|
});
|
|
8651
|
-
var HighlightsCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
8953
|
+
var HighlightsCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject5$q || (_templateObject5$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--color-base-black);\n\n .swipe-slide {\n ", "\n }\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 3 / 15;\n\n .swiper-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n"])), function (_ref3) {
|
|
8652
8954
|
var hasMultipleImages = _ref3.hasMultipleImages;
|
|
8653
8955
|
return hasMultipleImages ? 'width: calc(100% - 50px - var(--rotator-button-width)); -webkit-transform: translate3d(0, 0, 0);' : 'width: 100%';
|
|
8654
8956
|
}, devices.mobile);
|
|
8655
|
-
var RotatorButtonsWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
8656
|
-
var RotatorButtonsWrapper$
|
|
8957
|
+
var RotatorButtonsWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n margin-top: 8px;\n margin-bottom: 8px;\n\n @media ", " {\n div {\n background-color: var(--color-base-black);\n }\n svg path {\n fill: var(--color-base-white) !important;\n }\n\n & {\n display: flex;\n margin-left: 100px;\n align-self: center;\n justify-content: flex-end;\n }\n }\n"])), devices.mobile);
|
|
8958
|
+
var RotatorButtonsWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$d || (_templateObject7$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: 50px;\n top: calc(50% - calc(var(--rotator-button-width) / 2));\n z-index: 2;\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.mobileAndTablet);
|
|
8657
8959
|
|
|
8658
8960
|
/* eslint-disable react/no-danger */
|
|
8659
8961
|
var PageHeadingHighlightCarousel = function PageHeadingHighlightCarousel(_ref) {
|
|
@@ -8696,7 +8998,7 @@ var PageHeadingHighlightCarousel = function PageHeadingHighlightCarousel(_ref) {
|
|
|
8696
8998
|
}
|
|
8697
8999
|
})))) : null), hasImages && (/*#__PURE__*/React__default.createElement(HighlightsCarouselWrapper, {
|
|
8698
9000
|
hasMultipleImages: hasMultipleImages
|
|
8699
|
-
}, hasMultipleImages && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$
|
|
9001
|
+
}, hasMultipleImages && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$2, {
|
|
8700
9002
|
"data-testid": "rotator-buttons"
|
|
8701
9003
|
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
8702
9004
|
onClickNext: onNext,
|
|
@@ -8716,12 +9018,12 @@ var PageHeadingHighlightCarousel = function PageHeadingHighlightCarousel(_ref) {
|
|
|
8716
9018
|
}))))));
|
|
8717
9019
|
};
|
|
8718
9020
|
|
|
8719
|
-
var _templateObject
|
|
8720
|
-
var linkButtonStyles = /*#__PURE__*/styled.css(_templateObject
|
|
8721
|
-
var PageNav = /*#__PURE__*/styled__default.a(_templateObject2$
|
|
8722
|
-
var PaginationLink = /*#__PURE__*/styled__default.a(_templateObject3$
|
|
8723
|
-
var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject5$
|
|
8724
|
-
var LastPageItem = /*#__PURE__*/styled__default.li(_templateObject6$
|
|
9021
|
+
var _templateObject$$, _templateObject2$O, _templateObject3$B, _templateObject5$r, _templateObject6$j, _templateObject7$e, _templateObject8$a;
|
|
9022
|
+
var linkButtonStyles = /*#__PURE__*/styled.css(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n background: none;\n border: none;\n color: inherit;\n text-decoration: none;\n cursor: pointer;\n font: inherit;\n padding: 0;\n\n span {\n height: 1.5em;\n width: 1.5em;\n\n svg > path {\n fill: var(--color-base-black);\n }\n }\n\n &:hover {\n outline: none;\n }\n"])));
|
|
9023
|
+
var PageNav = /*#__PURE__*/styled__default.a(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
|
|
9024
|
+
var PaginationLink = /*#__PURE__*/styled__default.a(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
|
|
9025
|
+
var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n min-width: fit-content;\n align-items: center;\n justify-content: center;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: 0 auto;\n\n li {\n margin-left: 24px;\n color: var(--color-base-black);\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n\n li:first-child {\n margin-left: 0px;\n }\n"])));
|
|
9026
|
+
var LastPageItem = /*#__PURE__*/styled__default.li(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
|
|
8725
9027
|
var PreviousPageItem = /*#__PURE__*/styled__default.li(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
|
|
8726
9028
|
var TextLinkPagination = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject8$a || (_templateObject8$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: ", ";\n border-bottom: ", ";\n }\n\n :hover {\n cursor: pointer;\n color: var(--color-primary-red);\n border-bottom: 1px solid var(--color-primary-red);\n svg > path {\n fill: var(--color-base-black);\n }\n }\n"])), function (_ref) {
|
|
8727
9029
|
var active = _ref.active;
|
|
@@ -8875,15 +9177,15 @@ var Pagination = function Pagination(_ref) {
|
|
|
8875
9177
|
}))))));
|
|
8876
9178
|
};
|
|
8877
9179
|
|
|
8878
|
-
var _templateObject$
|
|
8879
|
-
var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
9180
|
+
var _templateObject$10;
|
|
9181
|
+
var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 40px 36px;\n\n grid-template-columns: 1fr 1fr 1fr;\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr;\n }\n\n @media ", " {\n grid-template-columns: ", ";\n }\n"])), devices.mobile, devices.tablet, devices.largeDesktop, function (_ref) {
|
|
8880
9182
|
var $largeDesktopColumns = _ref.$largeDesktopColumns;
|
|
8881
9183
|
return "repeat(" + ($largeDesktopColumns != null ? $largeDesktopColumns : 4) + ", 1fr)";
|
|
8882
9184
|
});
|
|
8883
9185
|
|
|
8884
|
-
var _templateObject
|
|
8885
|
-
var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject
|
|
8886
|
-
var RoleContent = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject2$
|
|
9186
|
+
var _templateObject$11, _templateObject2$P;
|
|
9187
|
+
var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-primary-black);\n }\n grid-area: role-person;\n break-inside: avoid;\n"])));
|
|
9188
|
+
var RoleContent = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-base-dark-grey);\n }\n overflow-wrap: break-word;\n padding-bottom: 4px;\n"])));
|
|
8887
9189
|
|
|
8888
9190
|
var PersonDetails = function PersonDetails(_ref) {
|
|
8889
9191
|
var _role$people;
|
|
@@ -8905,9 +9207,9 @@ var PersonDetails = function PersonDetails(_ref) {
|
|
|
8905
9207
|
})));
|
|
8906
9208
|
};
|
|
8907
9209
|
|
|
8908
|
-
var _templateObject$
|
|
8909
|
-
var PersonWrapper$
|
|
8910
|
-
var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
9210
|
+
var _templateObject$12, _templateObject2$Q;
|
|
9211
|
+
var PersonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 82px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 16px;\n"])));
|
|
9212
|
+
var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 82px;\n height: 82px;\n filter: ", ";\n }\n"])), function (_ref) {
|
|
8911
9213
|
var greyscale = _ref.greyscale;
|
|
8912
9214
|
return greyscale ? 'grayscale(100%)' : 'none';
|
|
8913
9215
|
});
|
|
@@ -8921,7 +9223,7 @@ var PersonCard = function PersonCard(_ref) {
|
|
|
8921
9223
|
var firstPerson = (_role$people = role.people) == null ? void 0 : _role$people[0];
|
|
8922
9224
|
return Boolean((firstPerson == null ? void 0 : firstPerson.headshot) && firstPerson.useHeadshot);
|
|
8923
9225
|
}, [role]);
|
|
8924
|
-
if (hasHeadshot) return /*#__PURE__*/React__default.createElement(PersonWrapper$
|
|
9226
|
+
if (hasHeadshot) return /*#__PURE__*/React__default.createElement(PersonWrapper$2, {
|
|
8925
9227
|
className: className
|
|
8926
9228
|
}, /*#__PURE__*/React__default.createElement(HeadshotWrapper, {
|
|
8927
9229
|
greyscale: greyscale
|
|
@@ -8956,14 +9258,14 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
8956
9258
|
}));
|
|
8957
9259
|
};
|
|
8958
9260
|
|
|
8959
|
-
var _templateObject$
|
|
8960
|
-
var ReplacementWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8961
|
-
var CreditListingWrapper = /*#__PURE__*/styled__default(PeopleListingGrid)(_templateObject2$
|
|
9261
|
+
var _templateObject$13, _templateObject2$R, _templateObject3$C, _templateObject4$w;
|
|
9262
|
+
var ReplacementWrapper = /*#__PURE__*/styled__default.div(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
|
|
9263
|
+
var CreditListingWrapper = /*#__PURE__*/styled__default(PeopleListingGrid)(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n\n grid-template-columns: ", ";\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: repeat(2, 1fr);\n }\n"])), function (_ref) {
|
|
8962
9264
|
var columnCount = _ref.columnCount;
|
|
8963
9265
|
return "repeat(" + columnCount + ", 1fr)";
|
|
8964
9266
|
}, devices.mobile, devices.tablet);
|
|
8965
|
-
var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8966
|
-
var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
9267
|
+
var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 25px;\n margin-bottom: 3px;\n }\n"])));
|
|
9268
|
+
var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n min-height: 1.5em;\n"])));
|
|
8967
9269
|
|
|
8968
9270
|
// Get the total character length of a property in an array of objects
|
|
8969
9271
|
var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
|
|
@@ -9090,8 +9392,8 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
9090
9392
|
}, creditEntries);
|
|
9091
9393
|
};
|
|
9092
9394
|
|
|
9093
|
-
var _templateObject$
|
|
9094
|
-
var PolicyLinksTextLinkWrapper = /*#__PURE__*/styled__default(TextLink)(_templateObject$
|
|
9395
|
+
var _templateObject$14;
|
|
9396
|
+
var PolicyLinksTextLinkWrapper = /*#__PURE__*/styled__default(TextLink)(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-sans);\n font-size: 17px;\n line-height: 24px;\n letter-spacing: 0.4px;\n color: var(--color-base-white);\n border-bottom: unset;\n text-decoration: underline;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n margin-bottom: 0;\n padding-bottom: 0;\n"])));
|
|
9095
9397
|
|
|
9096
9398
|
var PolicyLinks = function PolicyLinks(_ref) {
|
|
9097
9399
|
var items = _ref.items;
|
|
@@ -9109,14 +9411,14 @@ var PolicyLinks = function PolicyLinks(_ref) {
|
|
|
9109
9411
|
}));
|
|
9110
9412
|
};
|
|
9111
9413
|
|
|
9112
|
-
var _templateObject$
|
|
9414
|
+
var _templateObject$15, _templateObject3$D, _templateObject4$x, _templateObject5$s, _templateObject6$k, _templateObject7$f, _templateObject8$b, _templateObject9$6, _templateObject0$6, _templateObject1$4, _templateObject10$3, _templateObject11$2, _templateObject12$2, _templateObject13$1, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
|
|
9113
9415
|
var LENGTH_TEXT = 28;
|
|
9114
9416
|
var LENGTH_TEXT_TABLET$1 = 12;
|
|
9115
9417
|
var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
|
|
9116
9418
|
var GridTemplateImageToRight = "'. . left left left left left . right right right right right right right right'";
|
|
9117
9419
|
var GridTemplateAsCard = "'. . left left left left left right right right right right right right . . '";
|
|
9118
9420
|
var GridTemplateAsCardTablet = "'. . left left left left left left left right right right right right . . '";
|
|
9119
|
-
var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
9421
|
+
var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n grid-template-areas: ", ";\n }\n }\n\n @media ", " {\n & {\n grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n grid-template-rows: min-content 24px min-content;\n gap: 0;\n grid-template-areas:\n 'row1 row1 row1'\n '. . .'\n '. row2 .';\n }\n }\n\n /* Overwrite template for card */\n ", "\n"])), function (_ref) {
|
|
9120
9422
|
var imageToLeft = _ref.imageToLeft;
|
|
9121
9423
|
return imageToLeft ? GridTemplateImageToLeft : GridTemplateImageToRight;
|
|
9122
9424
|
}, devices.tablet, function (_ref2) {
|
|
@@ -9126,7 +9428,7 @@ var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$13 ||
|
|
|
9126
9428
|
var asCard = _ref3.asCard;
|
|
9127
9429
|
return asCard ? "\n grid-template-areas: " + GridTemplateAsCard + ";\n @media " + devices.tablet + " {\n grid-template-areas: " + GridTemplateAsCardTablet + ";\n }\n " : "";
|
|
9128
9430
|
});
|
|
9129
|
-
var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
9431
|
+
var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 24px;\n\n ", ";\n\n ", "\n\n @media ", " {\n gap: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref4) {
|
|
9130
9432
|
var hasTextLinks = _ref4.hasTextLinks;
|
|
9131
9433
|
return "margin-top: " + (hasTextLinks ? '0' : '24px') + ";";
|
|
9132
9434
|
}, function (_ref5) {
|
|
@@ -9150,15 +9452,15 @@ var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$B ||
|
|
|
9150
9452
|
}
|
|
9151
9453
|
return '';
|
|
9152
9454
|
});
|
|
9153
|
-
var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
9455
|
+
var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n\n ", "\n"])), function (_ref7) {
|
|
9154
9456
|
var marginBottom = _ref7.marginBottom;
|
|
9155
9457
|
return marginBottom + "px";
|
|
9156
9458
|
}, function (_ref8) {
|
|
9157
9459
|
var mobileMarginBottom = _ref8.mobileMarginBottom;
|
|
9158
9460
|
return mobileMarginBottom && "\n @media " + devices.mobile + " {\n margin-bottom: " + mobileMarginBottom + "px;\n }\n ";
|
|
9159
9461
|
});
|
|
9160
|
-
var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
9161
|
-
var TextLinkWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
9462
|
+
var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
|
|
9463
|
+
var TextLinkWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
|
|
9162
9464
|
var ExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
|
|
9163
9465
|
var IconWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n position: absolute;\n top: 25px;\n right: 35px;\n width: 24px;\n height: 24px;\n\n @media ", " {\n top: 30px;\n right: 30px;\n }\n\n @media ", " {\n top: 3px;\n right: 20px;\n }\n"])), devices.tablet, devices.mobile);
|
|
9164
9466
|
var PrimaryButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--button-height);\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
|
|
@@ -9381,27 +9683,27 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
9381
9683
|
}))));
|
|
9382
9684
|
};
|
|
9383
9685
|
|
|
9384
|
-
var _templateObject$
|
|
9686
|
+
var _templateObject$16, _templateObject2$S, _templateObject3$E, _templateObject4$y, _templateObject5$t, _templateObject6$l, _templateObject7$g;
|
|
9385
9687
|
var LENGTH_TEXT$2 = 28;
|
|
9386
9688
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
9387
|
-
var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
9689
|
+
var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n grid-template-areas: ", ";\n }\n }\n\n @media ", " {\n & {\n grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n grid-template-rows: min-content 24px min-content;\n gap: 0;\n grid-template-areas:\n 'row1 row1 row1'\n '. . .'\n '. row2 .';\n }\n }\n"])), function (_ref) {
|
|
9388
9690
|
var imageToLeft = _ref.imageToLeft;
|
|
9389
9691
|
return imageToLeft ? "'left left left left left left left left . right right right right right . .'" : "'. . left left left left left . right right right right right right right right'";
|
|
9390
9692
|
}, devices.tablet, function (_ref2) {
|
|
9391
9693
|
var imageToLeft = _ref2.imageToLeft;
|
|
9392
9694
|
return imageToLeft ? "'left left left left left left left right right right right right right .'" : "'. left left left left left left right right right right right right right'";
|
|
9393
9695
|
}, devices.mobile);
|
|
9394
|
-
var PromoWithTitleImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
9696
|
+
var PromoWithTitleImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref3) {
|
|
9395
9697
|
var imageToLeft = _ref3.imageToLeft;
|
|
9396
9698
|
return imageToLeft ? 'left' : 'right';
|
|
9397
9699
|
}, devices.mobile);
|
|
9398
|
-
var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
9700
|
+
var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n }\n"])), function (_ref4) {
|
|
9399
9701
|
var imageToLeft = _ref4.imageToLeft;
|
|
9400
9702
|
return imageToLeft ? 'right' : 'left';
|
|
9401
9703
|
}, devices.mobile);
|
|
9402
|
-
var HarmonicHeaderWithWrapper$1 = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject4$
|
|
9403
|
-
var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject5$
|
|
9404
|
-
var BodyCopyHarmonicWithWrapper$2 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$
|
|
9704
|
+
var HarmonicHeaderWithWrapper$1 = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 32px;\n\n @media ", " {\n padding-bottom: 24px;\n }\n"])), devices.mobile);
|
|
9705
|
+
var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
|
|
9706
|
+
var BodyCopyHarmonicWithWrapper$2 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n margin-bottom: 32px;\n whiete-space: break-spaces;\n overflow-wrap: break-word;\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n @media ", " {\n margin-bottom: 24px;\n }\n"])), devices.mobile);
|
|
9405
9707
|
var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$g || (_templateObject7$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 32px;\n\n ", "\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref5) {
|
|
9406
9708
|
var _ref5$primaryButtonTe = _ref5.primaryButtonTextLength,
|
|
9407
9709
|
primaryButtonTextLength = _ref5$primaryButtonTe === void 0 ? 0 : _ref5$primaryButtonTe,
|
|
@@ -9424,8 +9726,8 @@ var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$g ||
|
|
|
9424
9726
|
return '';
|
|
9425
9727
|
});
|
|
9426
9728
|
|
|
9427
|
-
var _templateObject$
|
|
9428
|
-
var VideoContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
9729
|
+
var _templateObject$17;
|
|
9730
|
+
var VideoContainer = /*#__PURE__*/styled__default.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n video {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
|
|
9429
9731
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
9430
9732
|
aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
|
|
9431
9733
|
return aspectRatio;
|
|
@@ -9607,10 +9909,10 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
9607
9909
|
}, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? (/*#__PURE__*/React__default.createElement(TertiaryButton, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate)) : null)) : null));
|
|
9608
9910
|
};
|
|
9609
9911
|
|
|
9610
|
-
var _templateObject$
|
|
9611
|
-
var FigureBlock = /*#__PURE__*/styled__default.figure(_templateObject$
|
|
9612
|
-
var BlockquoteBlock = /*#__PURE__*/styled__default.blockquote(_templateObject2$
|
|
9613
|
-
var AttributionBlock = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject3$
|
|
9912
|
+
var _templateObject$18, _templateObject2$T, _templateObject3$F;
|
|
9913
|
+
var FigureBlock = /*#__PURE__*/styled__default.figure(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
|
|
9914
|
+
var BlockquoteBlock = /*#__PURE__*/styled__default.blockquote(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
|
|
9915
|
+
var AttributionBlock = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 32px 0;\n\n & cite {\n font-style: normal;\n }\n\n @media ", " {\n padding: 24px 0;\n }\n"])), devices.mobile);
|
|
9614
9916
|
|
|
9615
9917
|
/* eslint-disable react/no-danger */
|
|
9616
9918
|
var Quote = function Quote(_ref) {
|
|
@@ -9640,9 +9942,9 @@ var Quote = function Quote(_ref) {
|
|
|
9640
9942
|
}, /*#__PURE__*/React__default.createElement("cite", null, attribution))))));
|
|
9641
9943
|
};
|
|
9642
9944
|
|
|
9643
|
-
var _templateObject$
|
|
9644
|
-
var Container$3 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
9645
|
-
var RadioGroup = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
9945
|
+
var _templateObject$19, _templateObject2$U, _templateObject3$G;
|
|
9946
|
+
var Container$3 = /*#__PURE__*/styled__default.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
9947
|
+
var RadioGroup = /*#__PURE__*/styled__default.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
|
|
9646
9948
|
var horizontalMode = _ref.horizontalMode;
|
|
9647
9949
|
if (horizontalMode) return 'row';
|
|
9648
9950
|
return 'column';
|
|
@@ -9650,7 +9952,7 @@ var RadioGroup = /*#__PURE__*/styled__default.div(_templateObject2$S || (_templa
|
|
|
9650
9952
|
var gap = _ref2.gap;
|
|
9651
9953
|
return gap + "px";
|
|
9652
9954
|
});
|
|
9653
|
-
var ErrorLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
9955
|
+
var ErrorLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref3) {
|
|
9654
9956
|
var darkMode = _ref3.darkMode;
|
|
9655
9957
|
if (darkMode) return 'var(--base-color-white)';
|
|
9656
9958
|
return 'var(--base-color-errorstate)';
|
|
@@ -9727,10 +10029,10 @@ var RadioGroup2 = function RadioGroup2(_ref) {
|
|
|
9727
10029
|
}, error))));
|
|
9728
10030
|
};
|
|
9729
10031
|
|
|
9730
|
-
var _templateObject$
|
|
9731
|
-
var StatusBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
9732
|
-
var ContentContainer$3 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
9733
|
-
var SvgContainer$3 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
10032
|
+
var _templateObject$1a, _templateObject2$V, _templateObject3$H;
|
|
10033
|
+
var StatusBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-light-grey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
|
|
10034
|
+
var ContentContainer$3 = /*#__PURE__*/styled__default.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.3s ease-in-out;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n"])));
|
|
10035
|
+
var SvgContainer$3 = /*#__PURE__*/styled__default.div(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: end;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n padding-left: 50px;\n }\n\n cursor: pointer;\n\n @media ", " {\n padding-left: 20px;\n }\n"])), devices.mobile);
|
|
9734
10036
|
|
|
9735
10037
|
/* eslint-disable react/no-danger */
|
|
9736
10038
|
var StatusBanner = function StatusBanner(_ref) {
|
|
@@ -9786,12 +10088,12 @@ var StatusBanner = function StatusBanner(_ref) {
|
|
|
9786
10088
|
return null;
|
|
9787
10089
|
};
|
|
9788
10090
|
|
|
9789
|
-
var _templateObject$
|
|
9790
|
-
var SearchBarContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
9791
|
-
var SvgContainerSearch = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
9792
|
-
var SvgContainerClose = /*#__PURE__*/styled__default.button(_templateObject3$
|
|
9793
|
-
var InputContainer = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
9794
|
-
var TextLinkWrapper$3 = /*#__PURE__*/styled__default(TextLink)(_templateObject6$
|
|
10091
|
+
var _templateObject$1b, _templateObject2$W, _templateObject3$I, _templateObject5$u, _templateObject6$m, _templateObject7$h;
|
|
10092
|
+
var SearchBarContainer = /*#__PURE__*/styled__default.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 64px;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n background-color: transparent;\n\n @media ", " {\n column-gap: 12px;\n }\n"])), devices.mobile);
|
|
10093
|
+
var SvgContainerSearch = /*#__PURE__*/styled__default.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-xlarge-gap);\n height: var(--navigation-xlarge-gap);\n }\n"])));
|
|
10094
|
+
var SvgContainerClose = /*#__PURE__*/styled__default.button(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n all: unset;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n\n :hover {\n cursor: pointer;\n && svg path {\n fill: var(--color-primary-red);\n }\n }\n\n &:focus {\n outline: 2px solid var(--color-primary-black);\n outline-offset: 2px;\n }\n"])));
|
|
10095
|
+
var InputContainer = /*#__PURE__*/styled__default.div(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: blue;\n width: 100%;\n\n input {\n font-size: var(--font-size-search);\n font-family: var(--font-family-serif);\n border: none;\n border-radius: 0;\n outline: none;\n outline-color: var(--color-base-white);\n height: 48px;\n box-sizing: border-box;\n width: 100%;\n -webkit-appearance: none;\n\n &.search-input {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n @media ", " {\n column-gap: 24px;\n }\n }\n"])), devices.mobile);
|
|
10096
|
+
var TextLinkWrapper$3 = /*#__PURE__*/styled__default(TextLink)(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-primary-red);\n"])));
|
|
9795
10097
|
var SearchArrowContainer = /*#__PURE__*/styled__default.a(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-right: 8px;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n"])));
|
|
9796
10098
|
|
|
9797
10099
|
function useFocusTrap(containerRef, onEscape, enabled) {
|
|
@@ -9930,8 +10232,8 @@ var SearchBar = function SearchBar(_ref) {
|
|
|
9930
10232
|
})));
|
|
9931
10233
|
};
|
|
9932
10234
|
|
|
9933
|
-
var _templateObject$
|
|
9934
|
-
var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
10235
|
+
var _templateObject$1c;
|
|
10236
|
+
var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 30px 0;\n\n & > div {\n row-gap: 0;\n }\n\n & h1,\n & h2 {\n margin: 16px 0;\n white-space: pre-wrap;\n }\n\n @media ", " {\n & h1,\n & h2 {\n margin: 12px 0;\n }\n }\n\n & div {\n margin-block-start: 0;\n }\n"])), devices.mobile);
|
|
9935
10237
|
|
|
9936
10238
|
/* ~~~~~~~ new harmonic types ~~~~~~~ */
|
|
9937
10239
|
var HarmonicSize = {
|
|
@@ -9973,9 +10275,9 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
9973
10275
|
}, description)))));
|
|
9974
10276
|
};
|
|
9975
10277
|
|
|
9976
|
-
var _templateObject$
|
|
9977
|
-
var Container$4 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
9978
|
-
var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
10278
|
+
var _templateObject$1d, _templateObject2$X, _templateObject3$J, _templateObject4$z;
|
|
10279
|
+
var Container$4 = /*#__PURE__*/styled__default.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
10280
|
+
var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .harmonic-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n\n .harmonic-select__control--is-focused {\n border-color: var(--color-base-dark-grey);\n box-shadow: ", ";\n }\n\n .harmonic-select__control--menu-is-open {\n .harmonic-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n\n .harmonic-select__indicator {\n font-size: 25px;\n padding: 0;\n margin-right: 12px;\n color: var(--color-primary-black);\n svg {\n height: 1em;\n width: 1em;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n }\n\n .harmonic-select__single-value,\n .harmonic-select__placeholder {\n margin-left: 0;\n margin-right: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n\n @media ", " {\n font-size: 17px;\n }\n }\n\n .harmonic-select__placeholder {\n color: var(--color-primary-black);\n }\n\n .harmonic-select__single-value {\n color: var(--color-primary-black);\n }\n\n .harmonic-select__value-container {\n padding-left: 20px;\n padding-right: 20px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n\n .harmonic-select--is-disabled {\n .harmonic-select__control {\n border: 1px solid var(--color-base-light-grey);\n background: var(--color-base-light-grey);\n }\n .harmonic-select__indicator,\n .harmonic-select__single-value {\n color: var(--color-base-dark-grey);\n }\n }\n\n .harmonic-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--color-base-mid-grey);\n }\n\n .harmonic-select__menu-list {\n padding: 10px 0;\n }\n\n .harmonic-select__option {\n padding: 10px 20px;\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n color: var(--color-primary-black);\n\n @media ", " {\n font-size: 17px;\n }\n\n &:active,\n &.harmonic-select__option--is-focused {\n background: var(--color-base-light-grey);\n }\n }\n\n .harmonic-select__option--is-selected {\n color: var(--color-primary-black);\n background: none;\n }\n\n .harmonic-select__input-container {\n margin: 0;\n padding-top: 0;\n padding-bottom: 0;\n color: var(--color-primary-black);\n }\n\n .harmonic-select__menu-notice {\n color: var(--color-primary-black);\n padding: 20px 20px;\n text-align: left;\n }\n\n .harmonic-select__menu-notice--loading {\n font-style: italic;\n }\n"])), function (_ref) {
|
|
9979
10281
|
var width = _ref.width;
|
|
9980
10282
|
if (!width) return 'none';
|
|
9981
10283
|
return width + "px";
|
|
@@ -9992,12 +10294,12 @@ var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject2$V || (_tem
|
|
|
9992
10294
|
if (darkMode) return "0 0 0 1px var(--color-state-medium)";
|
|
9993
10295
|
return "0 0 0 3px var(--base-color-lapislazuli)";
|
|
9994
10296
|
}, devices.mobile, devices.mobile);
|
|
9995
|
-
var TextLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
10297
|
+
var TextLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0 20px;\n color: ", ";\n\n @media ", " {\n margin: 0 0 12px;\n }\n"])), function (_ref5) {
|
|
9996
10298
|
var darkMode = _ref5.darkMode;
|
|
9997
10299
|
if (darkMode) return "var(--color-base-white)";
|
|
9998
10300
|
return "var(--color-primary-black)";
|
|
9999
10301
|
}, devices.mobile);
|
|
10000
|
-
var ErrorLabel$5 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
10302
|
+
var ErrorLabel$5 = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 20px 0 0;\n color: ", ";\n"])), function (_ref6) {
|
|
10001
10303
|
var darkMode = _ref6.darkMode;
|
|
10002
10304
|
if (darkMode) return "var(--color-base-white)";
|
|
10003
10305
|
return "var(--color-state-error)";
|
|
@@ -10116,16 +10418,16 @@ var SelectComponent$1 = function SelectComponent(_ref) {
|
|
|
10116
10418
|
})));
|
|
10117
10419
|
};
|
|
10118
10420
|
|
|
10119
|
-
var _templateObject$
|
|
10120
|
-
var TabsContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
10121
|
-
var ItemsContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
10421
|
+
var _templateObject$1e, _templateObject2$Y, _templateObject3$K, _templateObject4$A;
|
|
10422
|
+
var TabsContainer = /*#__PURE__*/styled__default.div(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
|
|
10423
|
+
var ItemsContainer = /*#__PURE__*/styled__default.div(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n\n @media ", " {\n column-gap: 15px;\n }\n\n @media ", ", ", " {\n div:last-child > div {\n right: 1px;\n }\n }\n\n @media ", " {\n ", "\n }\n"])), devices.desktop, devices.desktop, devices.largeDesktop, devices.mobileAndTablet, function (props) {
|
|
10122
10424
|
if (props.showMenu) {
|
|
10123
10425
|
return "\n display: flex;\n flex-direction: column;\n row-gap: 28px;\n ";
|
|
10124
10426
|
}
|
|
10125
10427
|
return "display: none;";
|
|
10126
10428
|
});
|
|
10127
|
-
var MenuContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
10128
|
-
var MenuItem = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
10429
|
+
var MenuContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n width: 60px;\n\n & a {\n font-size: var(--harmonic-font-size-navigation);\n font-family: var(--font-family-sans);\n color: var(--color-primary-black);\n text-decoration: none;\n cursor: pointer;\n\n :hover {\n color: var(--color-primary-red);\n }\n }\n\n && svg path {\n fill: var(--color-primary-black);\n }\n\n :hover {\n && svg path {\n fill: var(--color-primary-red);\n }\n }\n\n @media ", " {\n display: block;\n\n svg {\n width: 24px;\n height: 24px;\n margin-left: 40px;\n margin-top: -20px;\n }\n\n a {\n margin-left: 20px;\n }\n }\n"])), devices.mobileAndTablet);
|
|
10430
|
+
var MenuItem = /*#__PURE__*/styled__default.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n a {\n margin-left: 0;\n }\n }\n"])), devices.mobileAndTablet);
|
|
10129
10431
|
|
|
10130
10432
|
/* eslint-disable jsx-a11y/no-static-element-interactions */
|
|
10131
10433
|
var Tabs = function Tabs(_ref) {
|
|
@@ -10251,21 +10553,21 @@ var Tabs = function Tabs(_ref) {
|
|
|
10251
10553
|
}, "Menu"))))));
|
|
10252
10554
|
};
|
|
10253
10555
|
|
|
10254
|
-
var _templateObject$
|
|
10255
|
-
var Wrapper$5 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
10256
|
-
var PromoLabel = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject3$
|
|
10257
|
-
var ButtonContainer = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
10556
|
+
var _templateObject$1f, _templateObject3$L, _templateObject4$B, _templateObject5$v, _templateObject6$n, _templateObject7$i, _templateObject8$c, _templateObject9$7;
|
|
10557
|
+
var Wrapper$5 = /*#__PURE__*/styled__default.div(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--color-base-light-grey);\n padding: 40px 20px;\n position: relative;\n display: flex;\n flex-direction: column;\n gap: 20px;\n align-items: stretch;\n"])));
|
|
10558
|
+
var PromoLabel = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: var(--upsell-border-color);\n padding: 6px 8px;\n width: fit-content;\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n right: 20px;\n top: 0;\n width: auto;\n margin: auto;\n\n && {\n color: var(--color-base-white);\n }\n\n font-feature-settings:\n 'tnum' on,\n 'lnum' on,\n 'liga' off,\n 'calt' off;\n text-align: center;\n"])));
|
|
10559
|
+
var ButtonContainer = /*#__PURE__*/styled__default.div(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: auto;\n padding-top: 10px;\n width: fit-content;\n display: flex;\n flex-direction: row;\n gap: 20px;\n\n @media ", " {\n width: 100%;\n flex-direction: column;\n gap: 16px;\n }\n\n ", "\n\n @media ", ", ", " {\n a {\n text-align: center;\n }\n }\n"])), function (_ref) {
|
|
10258
10560
|
var stackCtasEarly = _ref.stackCtasEarly;
|
|
10259
10561
|
return stackCtasEarly ? devices.smallDesktop + ", " + devices.mobileAndTablet : devices.mobile;
|
|
10260
10562
|
}, function (_ref2) {
|
|
10261
10563
|
var stackCtasEarly = _ref2.stackCtasEarly;
|
|
10262
10564
|
return stackCtasEarly && "\n @media " + devices.smallDesktop + ", " + devices.mobileAndTablet + " {\n * {\n width: 100%;\n }\n }\n ";
|
|
10263
10565
|
}, devices.smallDesktop, devices.mobileAndTablet);
|
|
10264
|
-
var TitleContainer$3 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
10566
|
+
var TitleContainer$3 = /*#__PURE__*/styled__default.div(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-primary-black);\n display: flex;\n flex-direction: column;\n gap: ", ";\n align-items: stretch;\n"])), function (_ref3) {
|
|
10265
10567
|
var singleChild = _ref3.singleChild;
|
|
10266
10568
|
return singleChild ? '0' : '10px';
|
|
10267
10569
|
});
|
|
10268
|
-
var DescriptionWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$
|
|
10570
|
+
var DescriptionWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && p {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
10269
10571
|
var PriceRow = /*#__PURE__*/styled__default.div(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n gap: 6px 12px;\n"])));
|
|
10270
10572
|
var LineThrough = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject8$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration-line: line-through;\n color: var(--color-base-dark-grey);\n"])));
|
|
10271
10573
|
var VisuallyHidden = /*#__PURE__*/styled__default.span(_templateObject9$7 || (_templateObject9$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 0 !important;\n clip: rect(1px, 1px, 1px, 1px) !important;\n -webkit-clip-path: inset(50%) !important;\n clip-path: inset(50%) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n white-space: nowrap !important;\n"])));
|
|
@@ -10359,8 +10661,8 @@ var UpsellCard = function UpsellCard(_ref) {
|
|
|
10359
10661
|
}, /*#__PURE__*/React__default.createElement(SecondaryButton, Object.assign({}, secondaryLink), truncate(secondaryLink.text, LENGTH_SMALL_TEXT$2))))))));
|
|
10360
10662
|
};
|
|
10361
10663
|
|
|
10362
|
-
var _templateObject$
|
|
10363
|
-
var Wrapper$6 = /*#__PURE__*/styled__default.figure(_templateObject$
|
|
10664
|
+
var _templateObject$1g, _templateObject2$Z, _templateObject3$M;
|
|
10665
|
+
var Wrapper$6 = /*#__PURE__*/styled__default.figure(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: table;\n width: auto;\n margin: 0;\n\n ", " {\n width: 100%;\n\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
|
|
10364
10666
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
10365
10667
|
aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
|
|
10366
10668
|
return aspectRatio;
|
|
@@ -10370,8 +10672,8 @@ var Wrapper$6 = /*#__PURE__*/styled__default.figure(_templateObject$1e || (_temp
|
|
|
10370
10672
|
height = _ref2.height;
|
|
10371
10673
|
return height ? "calc(" + height + "px * " + AspectRatioWidth[aspectRatio] + ")" : 'auto';
|
|
10372
10674
|
});
|
|
10373
|
-
var CaptionWrapper = /*#__PURE__*/styled__default.figcaption(_templateObject2$
|
|
10374
|
-
var CaptionContext = /*#__PURE__*/styled__default(Caption)(_templateObject3$
|
|
10675
|
+
var CaptionWrapper = /*#__PURE__*/styled__default.figcaption(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: table-caption;\n caption-side: bottom;\n margin-top: var(--carousel-image-caption-margin);\n"])));
|
|
10676
|
+
var CaptionContext = /*#__PURE__*/styled__default(Caption)(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n line-clamp: 2;\n max-height: 46px;\n white-space: normal;\n word-break: break-word;\n font-feature-settings: var(--font-feature-settings-body);\n text-transform: var(--text-transform-body);\n"])));
|
|
10375
10677
|
|
|
10376
10678
|
var _excluded$q = ["caption", "altText", "src", "srcSet", "sizes", "loading", "aspectRatio", "className"];
|
|
10377
10679
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
@@ -10404,13 +10706,13 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
10404
10706
|
}, caption))));
|
|
10405
10707
|
};
|
|
10406
10708
|
|
|
10407
|
-
var _templateObject$
|
|
10408
|
-
var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
10409
|
-
var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
10410
|
-
var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$
|
|
10411
|
-
var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
10412
|
-
var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
10413
|
-
var TitleWrapper$4 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
10709
|
+
var _templateObject$1h, _templateObject2$_, _templateObject3$N, _templateObject4$C, _templateObject5$w, _templateObject6$o;
|
|
10710
|
+
var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n width: 100%;\n display: grid;\n grid-template-columns: repeat(7, minmax(0, 1fr));\n gap: 15px;\n min-height: 50px;\n"])));
|
|
10711
|
+
var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
10712
|
+
var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
10713
|
+
var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
10714
|
+
var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
10715
|
+
var TitleWrapper$4 = /*#__PURE__*/styled__default.div(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
|
|
10414
10716
|
|
|
10415
10717
|
var MiniCard = function MiniCard(_ref) {
|
|
10416
10718
|
var _ref$title = _ref.title,
|
|
@@ -10448,8 +10750,8 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
10448
10750
|
}, title)))));
|
|
10449
10751
|
};
|
|
10450
10752
|
|
|
10451
|
-
var _templateObject$
|
|
10452
|
-
var NavTopContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
10753
|
+
var _templateObject$1i;
|
|
10754
|
+
var NavTopContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 16px;\n justify-content: flex-end;\n height: 100%;\n\n @media ", " {\n column-gap: 20px;\n }\n"])), devices.mobile);
|
|
10453
10755
|
|
|
10454
10756
|
var NavTop = function NavTop(_ref) {
|
|
10455
10757
|
var accountText = _ref.accountText,
|
|
@@ -10489,18 +10791,18 @@ var NavTop = function NavTop(_ref) {
|
|
|
10489
10791
|
}));
|
|
10490
10792
|
};
|
|
10491
10793
|
|
|
10492
|
-
var _templateObject$
|
|
10493
|
-
var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
10494
|
-
var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2
|
|
10495
|
-
var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
10794
|
+
var _templateObject$1j, _templateObject2$$, _templateObject3$O, _templateObject4$D, _templateObject5$x;
|
|
10795
|
+
var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0px 0px 12px 0px !important;\n }\n width: 100%;\n"])));
|
|
10796
|
+
var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n\n @media print {\n visibility: hidden;\n }\n"])));
|
|
10797
|
+
var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
|
|
10496
10798
|
var isVisible = _ref.isVisible;
|
|
10497
10799
|
return isVisible ? 'visible' : 'hidden';
|
|
10498
10800
|
});
|
|
10499
|
-
var IntroTextContainer = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
10801
|
+
var IntroTextContainer = /*#__PURE__*/styled__default.div(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: hidden;\n }\n"])), function (_ref2) {
|
|
10500
10802
|
var isVisible = _ref2.isVisible;
|
|
10501
10803
|
return isVisible ? 'visible' : 'hidden';
|
|
10502
10804
|
});
|
|
10503
|
-
var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
10805
|
+
var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
|
|
10504
10806
|
|
|
10505
10807
|
var keyDown = function keyDown(e, toggleFunction) {
|
|
10506
10808
|
if (e.key === 'Enter' || e.key === 'Space') {
|
|
@@ -10581,15 +10883,15 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10581
10883
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText))));
|
|
10582
10884
|
};
|
|
10583
10885
|
|
|
10584
|
-
var _templateObject$
|
|
10585
|
-
var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$
|
|
10586
|
-
var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$
|
|
10587
|
-
var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$
|
|
10588
|
-
var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$
|
|
10886
|
+
var _templateObject$1k, _templateObject2$10, _templateObject3$P, _templateObject4$E, _templateObject5$y;
|
|
10887
|
+
var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
10888
|
+
var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n }\n"])), exports.Colors.LightGrey);
|
|
10889
|
+
var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 46px 14px 20px;\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n cursor: pointer;\n position: relative;\n span {\n width: 25px;\n height: 25px;\n position: absolute;\n top: 50%;\n margin-top: -12px;\n right: 10px;\n }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey);
|
|
10890
|
+
var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n text-decoration: none;\n margin: 0;\n padding: 16px 20px 15px 5px;\n display: block;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n"])), exports.Colors.Black, function (_ref) {
|
|
10589
10891
|
var isActive = _ref.isActive;
|
|
10590
10892
|
return isActive ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
|
|
10591
10893
|
}, exports.Colors.MidGrey);
|
|
10592
|
-
var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$
|
|
10894
|
+
var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
|
|
10593
10895
|
var isOpen = _ref2.isOpen;
|
|
10594
10896
|
return isOpen ? 'block' : 'none';
|
|
10595
10897
|
}, exports.Colors.White, exports.Colors.DarkGrey, MenuItem$1);
|
|
@@ -10745,19 +11047,19 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
|
|
|
10745
11047
|
});
|
|
10746
11048
|
};
|
|
10747
11049
|
|
|
10748
|
-
var _templateObject$
|
|
10749
|
-
var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
10750
|
-
var Sections = /*#__PURE__*/styled__default.div(_templateObject2
|
|
10751
|
-
var Section = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
11050
|
+
var _templateObject$1l, _templateObject2$11, _templateObject3$Q, _templateObject4$F, _templateObject5$z, _templateObject6$p;
|
|
11051
|
+
var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
11052
|
+
var Sections = /*#__PURE__*/styled__default.div(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
11053
|
+
var Section = /*#__PURE__*/styled__default.div(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
10752
11054
|
var color = _ref.color;
|
|
10753
11055
|
return "var(--base-color-" + color + ")";
|
|
10754
11056
|
});
|
|
10755
|
-
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
10756
|
-
var Text = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
11057
|
+
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
11058
|
+
var Text = /*#__PURE__*/styled__default.div(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
10757
11059
|
var color = _ref2.color;
|
|
10758
11060
|
return "var(--base-color-" + color + ")";
|
|
10759
11061
|
});
|
|
10760
|
-
var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
11062
|
+
var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
|
|
10761
11063
|
var color = _ref3.color;
|
|
10762
11064
|
return "var(--base-color-" + color + ")";
|
|
10763
11065
|
});
|
|
@@ -10839,17 +11141,17 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
10839
11141
|
}, strengthLabel))));
|
|
10840
11142
|
};
|
|
10841
11143
|
|
|
10842
|
-
var _templateObject$
|
|
10843
|
-
var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$
|
|
10844
|
-
var Container$6 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
10845
|
-
var Wrapper$7 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
10846
|
-
var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$
|
|
11144
|
+
var _templateObject$1m, _templateObject2$12, _templateObject3$R, _templateObject4$G, _templateObject5$A, _templateObject6$q, _templateObject7$j, _templateObject8$d;
|
|
11145
|
+
var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
11146
|
+
var Container$6 = /*#__PURE__*/styled__default.div(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
11147
|
+
var Wrapper$7 = /*#__PURE__*/styled__default.div(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
11148
|
+
var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$G || (_templateObject4$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n text-transform: capitalize;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n white-space: nowrap;\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n @media ", " {\n &:last-child {\n white-space: nowrap;\n }\n }\n\n @media ", " {\n min-width: 150px;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
|
|
10847
11149
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
10848
11150
|
}, devices.tablet, devices.mobile);
|
|
10849
|
-
var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$
|
|
11151
|
+
var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 12px;\n text-align: left;\n vertical-align: middle;\n border: 1px solid var(--color-primary-black);\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n min-width: 150px;\n }\n"])), function (props) {
|
|
10850
11152
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
10851
11153
|
}, devices.mobile);
|
|
10852
|
-
var PaginationWrapper = /*#__PURE__*/styled__default(Pagination)(_templateObject6$
|
|
11154
|
+
var PaginationWrapper = /*#__PURE__*/styled__default(Pagination)(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 40px;\n padding-bottom: 80px;\n\n @media ", " {\n padding-top: 24px;\n padding-bottom: 60px;\n }\n"])), devices.mobile);
|
|
10853
11155
|
var ScrollButtons = /*#__PURE__*/styled__default.div(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 60px 0 24px 0;\n\n div:hover {\n background-color: var(--color-base-light-grey);\n }\n\n > div > div {\n background-color: var(--color-base-light-grey);\n }\n\n svg path {\n fill: var(--color-base-black) !important;\n }\n"])));
|
|
10854
11156
|
var AriaDescription$2 = /*#__PURE__*/styled__default.span(_templateObject8$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
|
|
10855
11157
|
|
|
@@ -11054,19 +11356,19 @@ var Table = function Table(_ref) {
|
|
|
11054
11356
|
}))));
|
|
11055
11357
|
};
|
|
11056
11358
|
|
|
11057
|
-
var _templateObject$
|
|
11058
|
-
var Wrapper$8 = /*#__PURE__*/styled__default('div')(_templateObject$
|
|
11359
|
+
var _templateObject$1n, _templateObject2$13, _templateObject3$S, _templateObject4$H, _templateObject5$B, _templateObject6$r, _templateObject7$k, _templateObject8$e, _templateObject9$8, _templateObject0$7, _templateObject1$5, _templateObject10$4, _templateObject11$3, _templateObject12$3, _templateObject13$2;
|
|
11360
|
+
var Wrapper$8 = /*#__PURE__*/styled__default('div')(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
|
|
11059
11361
|
var theme = _ref.theme;
|
|
11060
11362
|
return "var(--color-" + theme + ")";
|
|
11061
11363
|
}, function (_ref2) {
|
|
11062
11364
|
var theme = _ref2.theme;
|
|
11063
11365
|
return "var(--color-" + theme + ")";
|
|
11064
11366
|
});
|
|
11065
|
-
var SignUpFormWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
11066
|
-
var SignUpTitleWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$
|
|
11067
|
-
var Error = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
11068
|
-
var Form = /*#__PURE__*/styled__default.form(_templateObject5$
|
|
11069
|
-
var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
11367
|
+
var SignUpFormWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
|
|
11368
|
+
var SignUpTitleWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n position: relative;\n top: -25px;\n left: -20px;\n height: 52px;\n background: var(--color-base-white);\n display: inline-block;\n padding: 0 20px;\n\n @media ", " {\n top: -18px;\n height: 37px;\n padding: 0 13px;\n left: -13px;\n }\n"])), devices.mobile);
|
|
11369
|
+
var Error = /*#__PURE__*/styled__default.div(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
|
|
11370
|
+
var Form = /*#__PURE__*/styled__default.form(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n align-items: center;\n ", " {\n margin-top: -20px;\n }\n a[href] {\n color: inherit;\n }\n"])), Error);
|
|
11371
|
+
var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n gap: 28px;\n align-items: center;\n\n @media ", " {\n flex-direction: column;\n align-items: flex-start;\n }\n"])), devices.mobile);
|
|
11070
11372
|
var ServerError = /*#__PURE__*/styled__default.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
|
|
11071
11373
|
var CTALinkWrapper = /*#__PURE__*/styled__default.a(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n @media ", " {\n text-decoration: underline;\n }\n"])), devices.mobile);
|
|
11072
11374
|
var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject9$8 || (_templateObject9$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n all: unset;\n width: fit-content;\n color: var(--base-color-white);\n text-decoration: none;\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
|
|
@@ -11481,13 +11783,13 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
|
|
|
11481
11783
|
}))))));
|
|
11482
11784
|
};
|
|
11483
11785
|
|
|
11484
|
-
var _templateObject$
|
|
11485
|
-
var AnchorBarContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
11786
|
+
var _templateObject$1o, _templateObject2$14, _templateObject4$I, _templateObject5$C;
|
|
11787
|
+
var AnchorBarContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n top: 0;\n min-height: 70px;\n background: var(--color-base-white);\n z-index: ", ";\n align-content: center;\n border-bottom: 1px solid var(--color-base-light-grey);\n\n ", "\n\n @media ", " {\n min-height: 60px;\n }\n"])), zIndexes.anchor, function (_ref) {
|
|
11486
11788
|
var withShadow = _ref.withShadow;
|
|
11487
|
-
return withShadow && styled.css(_templateObject2$
|
|
11789
|
+
return withShadow && styled.css(_templateObject2$14 || (_templateObject2$14 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
|
|
11488
11790
|
}, devices.mobile);
|
|
11489
|
-
var CloseButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject4$
|
|
11490
|
-
var ContentWrapper$2 = /*#__PURE__*/styled__default.a(_templateObject5$
|
|
11791
|
+
var CloseButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 24px;\n min-width: 24px;\n max-height: 24px;\n max-width: 24px;\n border: none;\n padding: 0;\n background: none;\n\n :hover {\n cursor: pointer;\n }\n\n @media ", " {\n min-height: 12px;\n min-width: 12px;\n max-height: 12px;\n max-width: 12px;\n }\n"])), devices.mobile);
|
|
11792
|
+
var ContentWrapper$2 = /*#__PURE__*/styled__default.a(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
11491
11793
|
|
|
11492
11794
|
var defaultGrid = {
|
|
11493
11795
|
columnStartDesktop: 2,
|
|
@@ -11545,12 +11847,12 @@ var AnchorBar = function AnchorBar(_ref) {
|
|
|
11545
11847
|
return null;
|
|
11546
11848
|
};
|
|
11547
11849
|
|
|
11548
|
-
var _templateObject$
|
|
11549
|
-
var FocusableTab = /*#__PURE__*/styled__default(Tab)(_templateObject$
|
|
11850
|
+
var _templateObject$1p, _templateObject2$15;
|
|
11851
|
+
var FocusableTab = /*#__PURE__*/styled__default(Tab)(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n &:not(:active):not(:focus) {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: 0;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n border: 0;\n white-space: nowrap;\n user-select: none;\n }\n\n @media ", " {\n position: absolute;\n left: 10px;\n top: 10px;\n width: 80px;\n height: 44px;\n margin: 0;\n padding: 0;\n overflow: hidden;\n clip: auto;\n color: transparent;\n background: transparent;\n opacity: 0;\n border: 0;\n white-space: nowrap;\n user-select: none;\n }\n"])), function (_ref) {
|
|
11550
11852
|
var hide = _ref.hide;
|
|
11551
11853
|
return hide && "display: none;";
|
|
11552
11854
|
}, devices.mobileAndTablet);
|
|
11553
|
-
var HiddenBlock = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
11855
|
+
var HiddenBlock = /*#__PURE__*/styled__default.div(_templateObject2$15 || (_templateObject2$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 29px 50px;\n display: inline-block;\n width: 100%;\n height: fit-content;\n border-bottom: solid 2px var(--color-base-light-grey);\n overflow: hidden;\n &:not(:has(div:focus)) {\n position: absolute;\n border-bottom: 0;\n padding: 0;\n }\n @media ", " {\n border-bottom: 0;\n position: absolute;\n padding: 0;\n }\n"])), devices.mobileAndTablet);
|
|
11554
11856
|
|
|
11555
11857
|
/**
|
|
11556
11858
|
* An accessible component which allows Assistive Technology users to move the focus
|
|
@@ -11642,24 +11944,24 @@ var SkipToMain = function SkipToMain(_ref) {
|
|
|
11642
11944
|
}));
|
|
11643
11945
|
};
|
|
11644
11946
|
|
|
11645
|
-
var _templateObject$
|
|
11947
|
+
var _templateObject$1q, _templateObject2$16, _templateObject3$T, _templateObject4$J, _templateObject5$D, _templateObject6$s, _templateObject7$l;
|
|
11646
11948
|
var color = 'primary-black';
|
|
11647
11949
|
var Button$2 = /*#__PURE__*/styled__default(SecondaryButton).attrs({
|
|
11648
11950
|
borderColor: color,
|
|
11649
11951
|
hoveredColor: color,
|
|
11650
11952
|
pressedColor: color,
|
|
11651
11953
|
textColor: color
|
|
11652
|
-
})(_templateObject$
|
|
11653
|
-
var Container$7 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
11654
|
-
var Description = /*#__PURE__*/styled__default(BodyContentTextContainer)(_templateObject3$
|
|
11954
|
+
})(_templateObject$1q || (_templateObject$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 35px;\n margin-top: 33px;\n width: fit-content;\n\n @media ", " {\n margin-bottom: 33px;\n margin-top: 31px;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n"])), devices.mobile);
|
|
11955
|
+
var Container$7 = /*#__PURE__*/styled__default.div(_templateObject2$16 || (_templateObject2$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--color-", ");\n padding: 60px 59px 59px;\n\n @media ", " {\n padding: 35px 20px 34px;\n }\n"])), color, devices.mobile);
|
|
11956
|
+
var Description = /*#__PURE__*/styled__default(BodyContentTextContainer)(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n margin: 27px 0;\n\n @media ", " {\n margin: 20px 0;\n }\n }\n"])), devices.mobile);
|
|
11655
11957
|
var Heading = /*#__PURE__*/styled__default(HarmonicHeader).attrs({
|
|
11656
11958
|
serif: true,
|
|
11657
11959
|
size: 'medium'
|
|
11658
|
-
})(_templateObject4$
|
|
11960
|
+
})(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n letter-spacing: -0.5px;\n margin-bottom: 27px;\n\n @media ", " {\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
11659
11961
|
var Intro = /*#__PURE__*/styled__default(HarmonicSubtitle).attrs({
|
|
11660
11962
|
size: 'large'
|
|
11661
|
-
})(_templateObject5$
|
|
11662
|
-
var SignInLink = /*#__PURE__*/styled__default.a(_templateObject6$
|
|
11963
|
+
})(_templateObject5$D || (_templateObject5$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-bottom: 27px;\n\n @media ", " {\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
11964
|
+
var SignInLink = /*#__PURE__*/styled__default.a(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--primary-black);\n cursor: pointer;\n text-decoration: underline;\n text-decoration-skip: none;\n"])));
|
|
11663
11965
|
var SignInPrompt = /*#__PURE__*/styled__default(BodyCopyHarmonic).attrs({
|
|
11664
11966
|
size: 'large'
|
|
11665
11967
|
})(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
@@ -11689,8 +11991,8 @@ var Paywall = function Paywall(_ref) {
|
|
|
11689
11991
|
}, "Sign in"))));
|
|
11690
11992
|
};
|
|
11691
11993
|
|
|
11692
|
-
var _templateObject$
|
|
11693
|
-
var Wrapper$9 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
11994
|
+
var _templateObject$1r;
|
|
11995
|
+
var Wrapper$9 = /*#__PURE__*/styled__default.div(_templateObject$1r || (_templateObject$1r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 60px 74px;\n grid-template-columns: repeat(2, 1fr);\n width: 100%;\n\n @media ", " {\n gap: 40px 74px;\n width: 100%;\n padding-left: 0;\n padding-right: 0;\n grid-template-columns: 1fr;\n }\n"])), devices.mobile);
|
|
11694
11996
|
|
|
11695
11997
|
var UpsellCards = function UpsellCards(_ref) {
|
|
11696
11998
|
var upsellCards = _ref.upsellCards,
|
|
@@ -11881,13 +12183,13 @@ var Navigation = function Navigation(_ref) {
|
|
|
11881
12183
|
})))))));
|
|
11882
12184
|
};
|
|
11883
12185
|
|
|
11884
|
-
var _templateObject$
|
|
11885
|
-
var FooterSection = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
11886
|
-
var PolicyLinksSection = /*#__PURE__*/styled__default(GridItem)(_templateObject2$
|
|
11887
|
-
var SocialAndNewsletterSection = /*#__PURE__*/styled__default(GridItem)(_templateObject3$
|
|
11888
|
-
var SectionWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
11889
|
-
var LogoAndDescriptionSection = /*#__PURE__*/styled__default(GridItem)(_templateObject5$
|
|
11890
|
-
var SponsorLogoContainer = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
12186
|
+
var _templateObject$1s, _templateObject2$17, _templateObject3$U, _templateObject4$K, _templateObject5$E, _templateObject6$t, _templateObject7$m;
|
|
12187
|
+
var FooterSection = /*#__PURE__*/styled__default(Grid)(_templateObject$1s || (_templateObject$1s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--color-base-black);\n color: var(--color-base-white);\n padding: 44px 0px;\n grid-template-areas: '. . policy policy policy policy social social social social logo logo logo logo . .';\n\n @media ", " {\n padding: 40px 0px;\n gap: 24px;\n }\n\n @media ", " {\n padding: 20px 0px;\n row-gap: 40px;\n grid-template-areas:\n '. social social social social social social social social social social social social .'\n '. policy policy policy policy policy policy policy policy policy policy policy policy .'\n '. logo logo logo logo logo logo logo logo logo logo logo logo .';\n }\n"])), devices.tablet, devices.mobile);
|
|
12188
|
+
var PolicyLinksSection = /*#__PURE__*/styled__default(GridItem)(_templateObject2$17 || (_templateObject2$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: policy;\n display: flex;\n flex-direction: column;\n gap: 16px;\n\n @media ", " {\n gap: 20px;\n }\n\n @media ", " {\n gap: 12px;\n }\n"])), devices.tablet, devices.mobile);
|
|
12189
|
+
var SocialAndNewsletterSection = /*#__PURE__*/styled__default(GridItem)(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: social;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 20px;\n\n @media ", " {\n gap: 40px;\n }\n"])), devices.mobile);
|
|
12190
|
+
var SectionWrapper = /*#__PURE__*/styled__default.div(_templateObject4$K || (_templateObject4$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 20px;\n\n @media ", " {\n gap: 24px;\n }\n"])), devices.mobile);
|
|
12191
|
+
var LogoAndDescriptionSection = /*#__PURE__*/styled__default(GridItem)(_templateObject5$E || (_templateObject5$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n\n @media ", " {\n gap: 24px;\n }\n"])), devices.mobile);
|
|
12192
|
+
var SponsorLogoContainer = /*#__PURE__*/styled__default.div(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 290px;\n\n @media ", " {\n max-width: unset;\n }\n"])), devices.mobile);
|
|
11891
12193
|
var TextLinkWrapper$4 = /*#__PURE__*/styled__default(TextLink)(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-sans);\n font-size: 17px;\n line-height: 24px;\n letter-spacing: 0.4px;\n color: var(--color-base-white);\n border-bottom: unset;\n text-decoration: underline;\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n margin-bottom: 0;\n padding-bottom: 0;\n"])));
|
|
11892
12194
|
|
|
11893
12195
|
var SPONSOR_IMAGE_SOURCE = 'https://s3.eu-west-1.amazonaws.com/static.roh.org.uk/sponsorlogos/arts-council-england-invert.svg';
|
|
@@ -11946,18 +12248,18 @@ var Footer = function Footer(_ref) {
|
|
|
11946
12248
|
}, additionalInfo))));
|
|
11947
12249
|
};
|
|
11948
12250
|
|
|
11949
|
-
var _templateObject$
|
|
12251
|
+
var _templateObject$1t, _templateObject2$18, _templateObject3$V, _templateObject4$L, _templateObject5$F, _templateObject8$f, _templateObject9$9, _templateObject0$8;
|
|
11950
12252
|
var LIST_ITEM_GAP = 32;
|
|
11951
|
-
var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
12253
|
+
var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$1t || (_templateObject$1t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--color-base-white);\n z-index: ", ";\n\n ", "\n"])), function (_ref) {
|
|
11952
12254
|
var bottomBorder = _ref.bottomBorder;
|
|
11953
12255
|
return bottomBorder ? '1px solid var(--color-base-light-grey)' : 'none';
|
|
11954
12256
|
}, zIndexes.anchor, function (_ref2) {
|
|
11955
12257
|
var withShadow = _ref2.withShadow;
|
|
11956
|
-
return withShadow && styled.css(_templateObject2$
|
|
12258
|
+
return withShadow && styled.css(_templateObject2$18 || (_templateObject2$18 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
|
|
11957
12259
|
});
|
|
11958
|
-
var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$
|
|
11959
|
-
var TabsWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
11960
|
-
var TabsList = /*#__PURE__*/styled__default.ul(_templateObject5$
|
|
12260
|
+
var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$V || (_templateObject3$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
|
|
12261
|
+
var TabsWrapper = /*#__PURE__*/styled__default.div(_templateObject4$L || (_templateObject4$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
12262
|
+
var TabsList = /*#__PURE__*/styled__default.ul(_templateObject5$F || (_templateObject5$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n display: flex;\n gap: ", "px;\n justify-content: ", ";\n align-items: center;\n list-style: none;\n padding: 0;\n margin: 0;\n height: var(--anchor-tabs-height);\n white-space: nowrap;\n overflow: scroll;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n scroll-behavior: smooth;\n\n @media ", " {\n & {\n width: ", ";\n }\n }\n"])), function (_ref3) {
|
|
11961
12263
|
var tabsOverflow = _ref3.tabsOverflow;
|
|
11962
12264
|
return tabsOverflow ? 'calc(100% - 74px)' : '100%';
|
|
11963
12265
|
}, LIST_ITEM_GAP, function (_ref4) {
|
|
@@ -12227,18 +12529,18 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
12227
12529
|
})))) : null))));
|
|
12228
12530
|
};
|
|
12229
12531
|
|
|
12230
|
-
var _templateObject$
|
|
12231
|
-
var TitleCTAGridWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
12532
|
+
var _templateObject$1u, _templateObject2$19, _templateObject3$W, _templateObject4$M, _templateObject6$u, _templateObject7$n, _templateObject8$g, _templateObject9$a, _templateObject0$9;
|
|
12533
|
+
var TitleCTAGridWrapper = /*#__PURE__*/styled__default.div(_templateObject$1u || (_templateObject$1u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
12232
12534
|
var sticky = _ref.sticky;
|
|
12233
12535
|
return sticky ? 'sticky' : 'initial';
|
|
12234
12536
|
}, zIndexes.anchor);
|
|
12235
|
-
var TitleCTAGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
12236
|
-
var TitleCTAGridItem = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
12537
|
+
var TitleCTAGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$19 || (_templateObject2$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: solid 2px var(--base-color-light-grey);\n"])));
|
|
12538
|
+
var TitleCTAGridItem = /*#__PURE__*/styled__default.div(_templateObject3$W || (_templateObject3$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2 / span 15;\n display: flex;\n align-items: center;\n flex-direction: ", ";\n gap: 40px;\n justify-content: space-between;\n\n @media ", " {\n & {\n grid-column: 2 / span 13;\n gap: 20px;\n }\n }\n\n @media ", " {\n & {\n grid-column: 2 / span 12;\n }\n }\n"])), function (_ref2) {
|
|
12237
12539
|
var title = _ref2.title;
|
|
12238
12540
|
return title ? 'row' : 'row-reverse';
|
|
12239
12541
|
}, devices.tablet, devices.mobile);
|
|
12240
|
-
var AnchorTitle = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
12241
|
-
var ButtonsDesktopWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
12542
|
+
var AnchorTitle = /*#__PURE__*/styled__default.div(_templateObject4$M || (_templateObject4$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n min-height: var(--button-height);\n\n h5 {\n padding: 0;\n margin: 0;\n }\n\n @media ", " {\n & {\n min-height: 50px;\n }\n }\n"])), devices.mobile);
|
|
12543
|
+
var ButtonsDesktopWrapper = /*#__PURE__*/styled__default.div(_templateObject6$u || (_templateObject6$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n\n @media ", " {\n display: none;\n }\n\n a {\n width: max-content;\n }\n"])), devices.mobile);
|
|
12242
12544
|
var ButtonsMobileWrapper = /*#__PURE__*/styled__default.div(_templateObject7$n || (_templateObject7$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: block;\n }\n }\n"])), devices.mobile);
|
|
12243
12545
|
var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject8$g || (_templateObject8$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n"])), function (_ref3) {
|
|
12244
12546
|
var theme = _ref3.theme;
|
|
@@ -12287,11 +12589,11 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
|
12287
12589
|
}, message))));
|
|
12288
12590
|
};
|
|
12289
12591
|
|
|
12290
|
-
var _templateObject$
|
|
12291
|
-
var UpsellBorderBox = /*#__PURE__*/styled__default.div(_templateObject$
|
|
12292
|
-
var TitleContent = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject2$
|
|
12293
|
-
var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
12294
|
-
var TextContent = /*#__PURE__*/styled__default(BodyContent)(_templateObject4$
|
|
12592
|
+
var _templateObject$1v, _templateObject2$1a, _templateObject3$X, _templateObject4$N;
|
|
12593
|
+
var UpsellBorderBox = /*#__PURE__*/styled__default.div(_templateObject$1v || (_templateObject$1v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: solid 4px;\n border-color: var(--upsell-border-color);\n padding: 66px 74px 70px;\n\n @media ", " {\n & {\n border-left: none;\n border-right: none;\n padding: 40px 0px;\n }\n }\n"])), devices.mobile);
|
|
12594
|
+
var TitleContent = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject2$1a || (_templateObject2$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-primary-black);\n\n @media ", " {\n margin-left: 20px;\n margin-right: 20px;\n }\n }\n"])), devices.mobile);
|
|
12595
|
+
var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$X || (_templateObject3$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 60px;\n\n @media ", " {\n margin-bottom: 40px;\n margin-left: 20px;\n margin-right: 20px;\n }\n"])), devices.mobile);
|
|
12596
|
+
var TextContent = /*#__PURE__*/styled__default(BodyContent)(_templateObject4$N || (_templateObject4$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && :is(h1, h2, h3, h4, h5, h6, p, ul, ol):first-child {\n margin: 35px 0 10px;\n\n @media ", " {\n margin-top: 24px;\n }\n }\n\n && :is(h1, h2, h3, h4, h5, h6, p, ul, ol):last-child {\n margin-bottom: 0;\n }\n"])), devices.mobile);
|
|
12295
12597
|
|
|
12296
12598
|
var UpsellSection = function UpsellSection(_ref) {
|
|
12297
12599
|
var title = _ref.title,
|
|
@@ -12336,9 +12638,9 @@ var UpsellSection = function UpsellSection(_ref) {
|
|
|
12336
12638
|
})))));
|
|
12337
12639
|
};
|
|
12338
12640
|
|
|
12339
|
-
var _templateObject$
|
|
12340
|
-
var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
12341
|
-
var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
12641
|
+
var _templateObject$1w, _templateObject2$1b;
|
|
12642
|
+
var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$1w || (_templateObject$1w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--color-base-white);\n"])), zIndexes.anchor);
|
|
12643
|
+
var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$1b || (_templateObject2$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n padding: 28px 0 26px;\n\n @media ", " {\n padding: 24px 0 28px;\n }\n\n @media ", " {\n border-bottom: none;\n }\n"])), function (_ref) {
|
|
12342
12644
|
var bottomBorder = _ref.bottomBorder;
|
|
12343
12645
|
return bottomBorder && 'border-bottom: 1px solid var(--color-base-light-grey);';
|
|
12344
12646
|
}, devices.mobileAndTablet, devices.mobile);
|
|
@@ -12369,11 +12671,11 @@ var StickyBar = function StickyBar(_ref) {
|
|
|
12369
12671
|
}, children)));
|
|
12370
12672
|
};
|
|
12371
12673
|
|
|
12372
|
-
var _templateObject$
|
|
12373
|
-
var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$
|
|
12374
|
-
var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$
|
|
12375
|
-
var ContentWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
12376
|
-
var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$
|
|
12674
|
+
var _templateObject$1x, _templateObject2$1c, _templateObject3$Y, _templateObject4$O;
|
|
12675
|
+
var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$1x || (_templateObject$1x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 62px;\n background-color: var(--base-color-white);\n z-index: ", ";\n position: relative;\n\n @media ", ", ", " {\n height: 100vh;\n padding: 62px 0 0;\n }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
|
|
12676
|
+
var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$1c || (_templateObject2$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n right: 0;\n margin: 15px;\n height: 26px;\n width: 26px;\n padding: 0;\n background-color: transparent;\n border: none;\n cursor: pointer;\n @media ", " {\n margin: 25px;\n }\n @media ", ", ", " {\n margin: 30px;\n }\n"])), devices.tablet, devices.desktop, devices.largeDesktop);
|
|
12677
|
+
var ContentWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject3$Y || (_templateObject3$Y = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
12678
|
+
var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$O || (_templateObject4$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n align-content: center;\n background-color: rgba(0, 0, 0, 0.4);\n"])));
|
|
12377
12679
|
|
|
12378
12680
|
var _excluded$t = ["isOpen", "setIsOpen", "children", "appElementId", "closeButtonAriaLabel"];
|
|
12379
12681
|
var MAX_Z_INDEX = 9999999999;
|
|
@@ -12580,26 +12882,26 @@ var getCardSlideMobileStyles = function getCardSlideMobileStyles(type) {
|
|
|
12580
12882
|
return "\n width: " + ("calc((" + columnsPerSlide + " * " + gridColumnWidth + ") + (" + gapsPerSlide + " * " + GRID_COLUMN_GAP + "))") + ";\n margin-right: " + ("calc(" + gridColumnWidth + " + (" + GRID_COLUMN_GAP + " * 2))") + ";\n ";
|
|
12581
12883
|
};
|
|
12582
12884
|
|
|
12583
|
-
var _templateObject$
|
|
12584
|
-
var ImageCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
12885
|
+
var _templateObject$1y, _templateObject2$1d, _templateObject3$Z, _templateObject4$P, _templateObject5$G, _templateObject6$v, _templateObject7$o, _templateObject8$h, _templateObject9$b;
|
|
12886
|
+
var ImageCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject$1y || (_templateObject$1y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n @media ", " {\n ", "\n }}\n\n &:fullscreen {\n background: var(--color-base-white);\n padding-top: 44px;\n padding-bottom: 84px;\n\n .swipe-slide > figure {\n height: var(--fullscreen-figure-height);\n\n > div {\n height: var(--fullscreen-figure-height);\n }\n }\n }\n"])), function (_ref) {
|
|
12585
12887
|
var imagesHeightDesktop = _ref.imagesHeightDesktop;
|
|
12586
12888
|
return "& {\n .swipe-slide {\n height: fit-content;\n width: auto;\n margin-right: var(--grid-column-gap);\n\n > figure {\n margin: 0px;\n\n > div {\n height: " + imagesHeightDesktop + "px;\n }\n }\n }\n }";
|
|
12587
12889
|
}, devices.mobile, function (_ref2) {
|
|
12588
12890
|
var imagesHeightDevice = _ref2.imagesHeightDevice;
|
|
12589
12891
|
return "&&& {\n .swipe-slide > figure {\n > div {\n height: " + imagesHeightDevice + "px;\n }\n }\n }";
|
|
12590
12892
|
});
|
|
12591
|
-
var CardsCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
12893
|
+
var CardsCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject2$1d || (_templateObject2$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n}"])), function (_ref3) {
|
|
12592
12894
|
var type = _ref3.type,
|
|
12593
12895
|
isActive = _ref3.isActive;
|
|
12594
12896
|
return "\n & {\n .swipe-slide {\n " + getCardSlideDesktopStyles(type, isActive) + "\n }\n }\n\n @media " + devices.tablet + " {\n & {\n .swipe-slide {\n " + getCardSlideTabletStyles(type) + "\n }\n }\n }\n\n @media " + devices.mobile + " {\n && {\n .swipe-slide {\n " + getCardSlideMobileStyles(type) + "\n }\n }\n }\n ";
|
|
12595
12897
|
});
|
|
12596
|
-
var TitleButtonsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$
|
|
12597
|
-
var CarouselInfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
12598
|
-
var TitleWrapper$5 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
12898
|
+
var TitleButtonsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$Z || (_templateObject3$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 28px;\n\n @media ", " {\n padding-bottom: 0;\n }\n\n @media ", " {\n margin-bottom: 20px;\n }\n"])), devices.mobile, devices.mobile);
|
|
12899
|
+
var CarouselInfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$P || (_templateObject4$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n user-select: text;\n"])));
|
|
12900
|
+
var TitleWrapper$5 = /*#__PURE__*/styled__default.div(_templateObject5$G || (_templateObject5$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref4) {
|
|
12599
12901
|
var isDescriptionPresent = _ref4.isDescriptionPresent;
|
|
12600
12902
|
return isDescriptionPresent && 'margin: 20px 0';
|
|
12601
12903
|
});
|
|
12602
|
-
var TitleText$1 = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject6$
|
|
12904
|
+
var TitleText$1 = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject6$v || (_templateObject6$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n line-height: 42px;\n }\n overflow: hidden;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n padding-top: 4px;\n box-sizing: border-box;\n /* max-height = 2 * 40px (two lines): 40px is the design line-height for header--medium (matches font-size/optical metrics), +4px provides extra descender room so glyphs like g/y aren't clipped \u2014 non\u2011WebKit fallback */\n max-height: calc(2 * 40px + 4px);\n"])));
|
|
12603
12905
|
var ButtonsWrapper = /*#__PURE__*/styled__default.div(_templateObject7$o || (_templateObject7$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n align-items: start;\n\n @media ", " {\n margin-right: var(--navigation-middle-gap);\n }\n"])), devices.mobile);
|
|
12604
12906
|
var TitleGridItem = /*#__PURE__*/styled__default(GridItem)(_templateObject8$h || (_templateObject8$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 2 / span 10;\n }\n"])), devices.tablet);
|
|
12605
12907
|
var SwipeGridWrapper = /*#__PURE__*/styled__default(GridItem)(_templateObject9$b || (_templateObject9$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n .swipe {\n padding-inline-start: 2px;\n padding-block-start: 2px;\n }\n\n ", ";\n\n @media ", " {\n grid-column: ", ";\n }\n\n @media ", " {\n grid-column: 2 / span 13;\n }\n"])), function (_ref5) {
|
|
@@ -12872,17 +13174,17 @@ var Carousel = function Carousel(_ref) {
|
|
|
12872
13174
|
}, children))));
|
|
12873
13175
|
};
|
|
12874
13176
|
|
|
12875
|
-
var _templateObject$
|
|
12876
|
-
var HighlightsGrid$1 = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
12877
|
-
var CarouselTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
12878
|
-
var HeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
12879
|
-
var InfoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
12880
|
-
var InfoLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
12881
|
-
var InfoTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
13177
|
+
var _templateObject$1z, _templateObject2$1e, _templateObject3$_, _templateObject4$Q, _templateObject5$H, _templateObject6$w, _templateObject7$p, _templateObject8$i, _templateObject9$c, _templateObject0$a, _templateObject1$6, _templateObject10$5, _templateObject11$4, _templateObject12$4, _templateObject13$3, _templateObject14$1, _templateObject15$1, _templateObject16$1;
|
|
13178
|
+
var HighlightsGrid$1 = /*#__PURE__*/styled__default(Grid)(_templateObject$1z || (_templateObject$1z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-template-rows: max-content minmax(0, 1fr);\n gap: 0 var(--grid-column-gap);\n background-color: var(--color-base-black);\n user-select: none;\n\n .highlight-carousel-text {\n color: var(--color-base-white);\n }\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
|
|
13179
|
+
var CarouselTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$1e || (_templateObject2$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 1 / 1 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n padding-top: 40px;\n padding-left: 50px;\n padding-right: 36px;\n user-select: text;\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 12;\n padding: 12px 0 12px var(--grid-margin);\n min-height: 64px;\n box-sizing: border-box;\n width: 100%;\n }\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 11;\n width: 100%;\n padding: 8px 0 8px 20px;\n min-height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
13180
|
+
var HeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$_ || (_templateObject3$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
|
|
13181
|
+
var InfoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$Q || (_templateObject4$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 2 / 1 / 2 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n align-self: center;\n padding: 36px 36px 36px 50px;\n\n a {\n text-underline-offset: var(--harmonic-text-link-underline-offset);\n }\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 2 / 7;\n padding: 0 12px 12px var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n grid-area: 3 / 1 / 4 / 15;\n width: 100%;\n padding: 0 20px;\n margin: 24px 0;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
13182
|
+
var InfoLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject5$H || (_templateObject5$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n width: 132px;\n height: 36px;\n\n @media ", " {\n & {\n margin-bottom: 16px;\n width: 102px;\n height: 28px;\n }\n }\n\n @media ", " {\n & {\n margin-bottom: 20px;\n width: 102px;\n height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
13183
|
+
var InfoTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject6$w || (_templateObject6$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n\n h1,\n h2,\n h3 {\n margin-bottom: 8px;\n }\n"])));
|
|
12882
13184
|
var InfoTextWrapper = /*#__PURE__*/styled__default.div(_templateObject7$p || (_templateObject7$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobileAndTablet);
|
|
12883
13185
|
var InfoLinkWrapper = /*#__PURE__*/styled__default.div(_templateObject8$i || (_templateObject8$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n flex-direction: row;\n\n @media ", " {\n & {\n margin-top: 16px;\n }\n }\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n display: flex;\n flex-direction: column;\n }\n"])), devices.tablet, devices.mobile);
|
|
12884
13186
|
var CarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject9$c || (_templateObject9$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n\n .swipe-slide {\n width: calc(100% - 50px - var(--rotator-button-width));\n -webkit-transform: translate3d(0, 0, 0);\n }\n\n @media ", " {\n & {\n grid-area: 2 / 7 / 3 / 15;\n\n .swipe-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 3 / 15;\n\n .swipe-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
12885
|
-
var RotatorButtonsWrapper$
|
|
13187
|
+
var RotatorButtonsWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject0$a || (_templateObject0$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: 50px;\n top: calc(50% - calc(var(--rotator-button-width) / 2));\n z-index: 2;\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.mobileAndTablet);
|
|
12886
13188
|
var RotatorButtonsWrapperMobile$1 = /*#__PURE__*/styled__default.div(_templateObject1$6 || (_templateObject1$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n div {\n background-color: var(--color-base-black);\n }\n svg path {\n fill: var(--color-base-white);\n }\n\n & {\n display: flex;\n grid-area: 1 / 12 / 2 / 14;\n align-self: center;\n justify-content: flex-end;\n }\n }\n\n @media ", " {\n div {\n background-color: var(--color-base-black);\n }\n svg path {\n fill: var(--color-base-white);\n }\n\n & {\n display: flex;\n grid-area: 1 / 11 / 2 / 14;\n align-self: center;\n justify-content: flex-end;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
12887
13189
|
var HtmlBodyText = /*#__PURE__*/styled__default.p(_templateObject10$5 || (_templateObject10$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n"])));
|
|
12888
13190
|
var FirstButtonComponentWrapper = /*#__PURE__*/styled__default.div(_templateObject11$4 || (_templateObject11$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 16px;\n\n @media ", " {\n & {\n display: flex;\n flex-direction: column;\n margin-right: 0;\n margin-bottom: 10px;\n }\n }\n"])), devices.mobile);
|
|
@@ -13132,7 +13434,7 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
|
|
|
13132
13434
|
auxiliaryCTA: auxiliaryCTA
|
|
13133
13435
|
})), /*#__PURE__*/React__default.createElement(CarouselWrapper, {
|
|
13134
13436
|
"data-testid": "carousel-wrapper"
|
|
13135
|
-
}, hasMultipleSlides && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$
|
|
13437
|
+
}, hasMultipleSlides && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$3, {
|
|
13136
13438
|
"data-testid": "rotator-buttons"
|
|
13137
13439
|
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
13138
13440
|
onClickNext: onNext,
|
|
@@ -13208,9 +13510,9 @@ var HighlightsStream = function HighlightsStream(_ref) {
|
|
|
13208
13510
|
})));
|
|
13209
13511
|
};
|
|
13210
13512
|
|
|
13211
|
-
var _templateObject$
|
|
13212
|
-
var CarouselWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
13213
|
-
var ButtonsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3
|
|
13513
|
+
var _templateObject$1A, _templateObject3$$;
|
|
13514
|
+
var CarouselWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$1A || (_templateObject$1A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n\n .swipe-slide {\n width: 100%;\n }\n"])));
|
|
13515
|
+
var ButtonsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$$ || (_templateObject3$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
|
|
13214
13516
|
|
|
13215
13517
|
var MinimalCarousel = function MinimalCarousel(_ref) {
|
|
13216
13518
|
var children = _ref.children;
|
|
@@ -13805,8 +14107,8 @@ var Theme = function Theme(_ref) {
|
|
|
13805
14107
|
}, children);
|
|
13806
14108
|
};
|
|
13807
14109
|
|
|
13808
|
-
var _templateObject$
|
|
13809
|
-
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1z || (_templateObject$1z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", ";\n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n\n --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n --harmonic-text-link-underline-offset: 4px;\n --harmonic-text-transform-navigation: capitalize;\n --harmonic-font-size-navigation: 19px;\n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n }\n\n @media ", " {\n\n }\n\n @media ", " {\n\n }\n }\n"])), function (_ref) {
|
|
14110
|
+
var _templateObject$1B;
|
|
14111
|
+
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1B || (_templateObject$1B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", ";\n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n\n --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n --harmonic-text-link-underline-offset: 4px;\n --harmonic-text-transform-navigation: capitalize;\n --harmonic-font-size-navigation: 19px;\n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n }\n\n @media ", " {\n\n }\n\n @media ", " {\n\n }\n }\n"])), function (_ref) {
|
|
13810
14112
|
var theme = _ref.theme;
|
|
13811
14113
|
return theme.colors.primary;
|
|
13812
14114
|
}, function (_ref2) {
|
|
@@ -14772,6 +15074,7 @@ exports.Card = Card;
|
|
|
14772
15074
|
exports.Cards = Cards;
|
|
14773
15075
|
exports.Carousel = Carousel;
|
|
14774
15076
|
exports.CastFilter = CastFilters;
|
|
15077
|
+
exports.CastFilterVariant = CastFiltersVariant;
|
|
14775
15078
|
exports.CinemaBadge = CinemaBadge;
|
|
14776
15079
|
exports.ContactCard = ContactCard;
|
|
14777
15080
|
exports.ContactNewsletter = ContactNewsletter;
|