@royaloperahouse/harmonic 1.0.8-e → 1.0.9-a
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 +6 -3
- package/README.GIT +293 -0
- package/README.md +43 -267
- 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 +4 -0
- package/dist/components/molecules/CastFilter/Variant/index.d.ts +2 -0
- package/dist/components/molecules/CustomStrategyTabsFilter/CustomStrategyTabsFilter.d.ts +1 -1
- package/dist/components/molecules/index.d.ts +3 -2
- package/dist/harmonic.cjs.development.js +512 -240
- 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 +512 -241
- package/dist/harmonic.esm.js.map +1 -1
- package/dist/index.d.ts +2 -2
- package/package.json +2 -2
- package/dist/components/molecules/CastFilter/index.d.ts +0 -2
package/dist/harmonic.esm.js
CHANGED
|
@@ -6495,13 +6495,13 @@ var Cards = function Cards(_ref) {
|
|
|
6495
6495
|
};
|
|
6496
6496
|
|
|
6497
6497
|
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;
|
|
6498
|
-
var CastFiltersComponentWrapper = /*#__PURE__*/styled.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 20px;\n\n @media ", " {\n
|
|
6498
|
+
var CastFiltersComponentWrapper = /*#__PURE__*/styled.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);
|
|
6499
6499
|
var CastFiltersWrapper = /*#__PURE__*/styled.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);
|
|
6500
6500
|
var HeadingTextWrapper = /*#__PURE__*/styled.div(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 44px;\n display: flex;\n align-items: center;\n"])));
|
|
6501
|
-
var RotatorButtonsWrapper = /*#__PURE__*/styled(GridItem)(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["
|
|
6501
|
+
var RotatorButtonsWrapper = /*#__PURE__*/styled(GridItem)(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
6502
6502
|
var CastWrapper = /*#__PURE__*/styled.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);
|
|
6503
|
-
var ActionButtons = /*#__PURE__*/styled.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
|
|
6504
|
-
var PersonWrapper = /*#__PURE__*/styled.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
|
|
6503
|
+
var ActionButtons = /*#__PURE__*/styled.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);
|
|
6504
|
+
var PersonWrapper = /*#__PURE__*/styled.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);
|
|
6505
6505
|
var PersonToggle = /*#__PURE__*/styled.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) {
|
|
6506
6506
|
var isSelected = _ref.isSelected;
|
|
6507
6507
|
return isSelected ? 'var(--color-primary-red)' : 'var(--color-base-light-grey)';
|
|
@@ -6513,7 +6513,7 @@ var PersonImage = /*#__PURE__*/styled.img(_templateObject9$3 || (_templateObject
|
|
|
6513
6513
|
var isDefaultPlaceholder = _ref3.isDefaultPlaceholder;
|
|
6514
6514
|
return isDefaultPlaceholder && "\n transform: scale(1.24);\n ";
|
|
6515
6515
|
});
|
|
6516
|
-
var PersonName = /*#__PURE__*/styled.div(_templateObject0$3 || (_templateObject0$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 86px;\n display: flex;\n flex-wrap: wrap;\n text-align: center;\n
|
|
6516
|
+
var PersonName = /*#__PURE__*/styled.div(_templateObject0$3 || (_templateObject0$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 86px;\n display: flex;\n flex-wrap: wrap;\n text-align: center;\n"])));
|
|
6517
6517
|
var Decal = /*#__PURE__*/styled.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) {
|
|
6518
6518
|
var isSelected = _ref4.isSelected;
|
|
6519
6519
|
return isSelected ? 'flex' : 'none';
|
|
@@ -6523,12 +6523,18 @@ var Decal = /*#__PURE__*/styled.div(_templateObject1$2 || (_templateObject1$2 =
|
|
|
6523
6523
|
});
|
|
6524
6524
|
var EmptySelectionTextSpacer = /*#__PURE__*/styled.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);
|
|
6525
6525
|
|
|
6526
|
+
var _templateObject$J, _templateObject2$w, _templateObject3$k, _templateObject5$f;
|
|
6527
|
+
var CastFiltersComponentWrapper$1 = /*#__PURE__*/styled(CastFiltersComponentWrapper)(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n flex-direction: column-reverse;\n }\n"])), devices.mobile);
|
|
6528
|
+
var RotatorButtonsWrapper$1 = /*#__PURE__*/styled(RotatorButtonsWrapper)(_templateObject2$w || (_templateObject2$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
6529
|
+
var PersonWrapper$1 = /*#__PURE__*/styled(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);
|
|
6530
|
+
var ActionButtons$1 = /*#__PURE__*/styled(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);
|
|
6531
|
+
|
|
6526
6532
|
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";
|
|
6527
6533
|
|
|
6528
|
-
var _templateObject$
|
|
6534
|
+
var _templateObject$K, _templateObject2$x;
|
|
6529
6535
|
var SWIPE_SLIDE_CLASS_NAME = 'swipe-slide';
|
|
6530
|
-
var SwipeContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
6531
|
-
var SwipeTrack = /*#__PURE__*/styled.div(_templateObject2$
|
|
6536
|
+
var SwipeContainer = /*#__PURE__*/styled.div(_templateObject$K || (_templateObject$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n width: 100%;\n touch-action: pan-y;\n"])));
|
|
6537
|
+
var SwipeTrack = /*#__PURE__*/styled.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) {
|
|
6532
6538
|
var transitioning = _ref.transitioning;
|
|
6533
6539
|
return transitioning ? 'transform 0.3s ease' : 'none';
|
|
6534
6540
|
}, function (_ref2) {
|
|
@@ -7101,6 +7107,269 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7101
7107
|
}
|
|
7102
7108
|
}, [onClear]);
|
|
7103
7109
|
var showActionButtonsSection = onApply || onClear || emptySelectionText;
|
|
7110
|
+
var getPersonCards = function getPersonCards() {
|
|
7111
|
+
return cast.map(function (person, index) {
|
|
7112
|
+
var name = person.name,
|
|
7113
|
+
image = person.image,
|
|
7114
|
+
_onClick = person.onClick,
|
|
7115
|
+
ariaLabel = person['aria-label'];
|
|
7116
|
+
var personSelectionId = getCastItemSelectionId(person);
|
|
7117
|
+
var isSelected = isIdSelectionMode ? selectedIdsSet.has(personSelectionId) : selectedIndices.includes(index);
|
|
7118
|
+
var personImage = image || placeholderImage || defaultPlaceholderImage;
|
|
7119
|
+
return /*#__PURE__*/React__default.createElement(PersonWrapper$1, {
|
|
7120
|
+
key: personSelectionId,
|
|
7121
|
+
"aria-selected": isSelected,
|
|
7122
|
+
"aria-label": ariaLabel != null ? ariaLabel : name,
|
|
7123
|
+
role: "option",
|
|
7124
|
+
tabIndex: 0,
|
|
7125
|
+
onClick: function onClick() {
|
|
7126
|
+
return handleClick(index, personSelectionId, _onClick);
|
|
7127
|
+
},
|
|
7128
|
+
onKeyDown: function onKeyDown(e) {
|
|
7129
|
+
return handlePersonKeydown(e, index, personSelectionId, _onClick);
|
|
7130
|
+
}
|
|
7131
|
+
}, /*#__PURE__*/React__default.createElement(PersonToggle, {
|
|
7132
|
+
isSelected: isSelected,
|
|
7133
|
+
"aria-hidden": "true"
|
|
7134
|
+
}, /*#__PURE__*/React__default.createElement(PersonImage, {
|
|
7135
|
+
src: personImage,
|
|
7136
|
+
alt: "",
|
|
7137
|
+
draggable: false,
|
|
7138
|
+
isDefaultPlaceholder: !(!!image || !!placeholderImage),
|
|
7139
|
+
greyscale: greyscale
|
|
7140
|
+
}), /*#__PURE__*/React__default.createElement(Decal, {
|
|
7141
|
+
isSelected: isSelected
|
|
7142
|
+
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
7143
|
+
iconName: "Confirm",
|
|
7144
|
+
color: "white"
|
|
7145
|
+
}))), /*#__PURE__*/React__default.createElement(PersonName, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7146
|
+
size: "medium"
|
|
7147
|
+
}, name)));
|
|
7148
|
+
});
|
|
7149
|
+
};
|
|
7150
|
+
return /*#__PURE__*/React__default.createElement(CastFiltersComponentWrapper$1, {
|
|
7151
|
+
className: className
|
|
7152
|
+
}, /*#__PURE__*/React__default.createElement(CastFiltersWrapper, null, /*#__PURE__*/React__default.createElement(Grid, null, headingText && (/*#__PURE__*/React__default.createElement(GridItem, {
|
|
7153
|
+
columnStartDesktop: 1,
|
|
7154
|
+
columnSpanDesktop: 10,
|
|
7155
|
+
columnStartDevice: 1,
|
|
7156
|
+
columnSpanDevice: 9
|
|
7157
|
+
}, /*#__PURE__*/React__default.createElement(HeadingTextWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7158
|
+
size: "large"
|
|
7159
|
+
}, headingText)))), showRotatorButtons && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$1, {
|
|
7160
|
+
columnStartDesktop: 16,
|
|
7161
|
+
columnSpanDesktop: 2
|
|
7162
|
+
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
7163
|
+
size: "small",
|
|
7164
|
+
onClickNext: onNext,
|
|
7165
|
+
onClickPrev: onPrev,
|
|
7166
|
+
availablePrev: availablePrev,
|
|
7167
|
+
availableNext: availableNext
|
|
7168
|
+
})))), /*#__PURE__*/React__default.createElement(CastWrapper, {
|
|
7169
|
+
ref: castWrapperRef,
|
|
7170
|
+
role: "listbox",
|
|
7171
|
+
"aria-roledescription": listRoleDescription != null ? listRoleDescription : 'filter list',
|
|
7172
|
+
"aria-label": "filter list",
|
|
7173
|
+
"aria-multiselectable": "true",
|
|
7174
|
+
onMouseDown: handleMouseDown,
|
|
7175
|
+
onMouseMove: handleMouseMove,
|
|
7176
|
+
onMouseUp: handleMouseUp,
|
|
7177
|
+
onMouseLeave: handleMouseLeave
|
|
7178
|
+
}, isMobile ? getPersonCards() : (/*#__PURE__*/React__default.createElement(Swipe, {
|
|
7179
|
+
onIndexChange: onIndexChangeHandler,
|
|
7180
|
+
"data-testid": "cast-filter-swipe",
|
|
7181
|
+
ref: swipeRef,
|
|
7182
|
+
onOverflowChange: handleOverflowChange,
|
|
7183
|
+
limitDragToNavigableRange: true
|
|
7184
|
+
}, getPersonCards())))), showActionButtonsSection && (/*#__PURE__*/React__default.createElement(ActionButtons$1, null, selectedStateIndices.length === 0 && emptySelectionText && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7185
|
+
size: "medium",
|
|
7186
|
+
className: "mobile-only"
|
|
7187
|
+
}, 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, {
|
|
7188
|
+
onClick: function onClick() {
|
|
7189
|
+
if (onApply) onApply(selectedStateIndices);
|
|
7190
|
+
if (onApplyIds) onApplyIds(selectedStateIds);
|
|
7191
|
+
}
|
|
7192
|
+
}, ctaText != null ? ctaText : 'Apply')), onClear && (/*#__PURE__*/React__default.createElement(TextLink, {
|
|
7193
|
+
tabIndex: 0,
|
|
7194
|
+
role: "button",
|
|
7195
|
+
onClick: onClear,
|
|
7196
|
+
onKeyDown: handleClearKeydown
|
|
7197
|
+
}, textLinkText != null ? textLinkText : 'Clear')))))));
|
|
7198
|
+
};
|
|
7199
|
+
|
|
7200
|
+
var CastFiltersVariant = function CastFiltersVariant(_ref) {
|
|
7201
|
+
var cast = _ref.cast,
|
|
7202
|
+
headingText = _ref.headingText,
|
|
7203
|
+
ctaText = _ref.ctaText,
|
|
7204
|
+
textLinkText = _ref.textLinkText,
|
|
7205
|
+
emptySelectionText = _ref.emptySelectionText,
|
|
7206
|
+
placeholderImage = _ref.placeholderImage,
|
|
7207
|
+
listRoleDescription = _ref.listRoleDescription,
|
|
7208
|
+
className = _ref.className,
|
|
7209
|
+
onSelect = _ref.onSelect,
|
|
7210
|
+
onSelectId = _ref.onSelectId,
|
|
7211
|
+
onApply = _ref.onApply,
|
|
7212
|
+
onApplyIds = _ref.onApplyIds,
|
|
7213
|
+
onClear = _ref.onClear,
|
|
7214
|
+
_ref$greyscale = _ref.greyscale,
|
|
7215
|
+
greyscale = _ref$greyscale === void 0 ? false : _ref$greyscale,
|
|
7216
|
+
_ref$selectedIndices = _ref.selectedIndices,
|
|
7217
|
+
selectedIndices = _ref$selectedIndices === void 0 ? [] : _ref$selectedIndices,
|
|
7218
|
+
selectedIds = _ref.selectedIds;
|
|
7219
|
+
var _useViewport = useViewport(),
|
|
7220
|
+
isMobile = _useViewport.isMobile;
|
|
7221
|
+
var castWrapperRef = useRef(null);
|
|
7222
|
+
var isDraggingRef = useRef(false);
|
|
7223
|
+
var startXRef = useRef(0);
|
|
7224
|
+
var scrollStartRef = useRef(0);
|
|
7225
|
+
var hasDraggedRef = useRef(false);
|
|
7226
|
+
var swipeRef = useRef(null);
|
|
7227
|
+
var _useState = useState(false),
|
|
7228
|
+
availablePrev = _useState[0],
|
|
7229
|
+
setAvailablePrev = _useState[1];
|
|
7230
|
+
var _useState2 = useState(cast.length > 1),
|
|
7231
|
+
availableNext = _useState2[0],
|
|
7232
|
+
setAvailableNext = _useState2[1];
|
|
7233
|
+
var _useState3 = useState(true),
|
|
7234
|
+
showRotatorButtons = _useState3[0],
|
|
7235
|
+
setShowRotatorButtons = _useState3[1];
|
|
7236
|
+
var onIndexChangeHandler = function onIndexChangeHandler(index) {
|
|
7237
|
+
setAvailablePrev(index > 0);
|
|
7238
|
+
setAvailableNext(function () {
|
|
7239
|
+
var _swipeRef$current$has, _swipeRef$current;
|
|
7240
|
+
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);
|
|
7241
|
+
});
|
|
7242
|
+
};
|
|
7243
|
+
useEffect(function () {
|
|
7244
|
+
setAvailablePrev(false);
|
|
7245
|
+
setAvailableNext(function () {
|
|
7246
|
+
var _swipeRef$current$has2, _swipeRef$current2;
|
|
7247
|
+
return (_swipeRef$current$has2 = (_swipeRef$current2 = swipeRef.current) == null ? void 0 : _swipeRef$current2.hasNext()) != null ? _swipeRef$current$has2 : cast.length > 1;
|
|
7248
|
+
});
|
|
7249
|
+
}, [cast.length]);
|
|
7250
|
+
var handleOverflowChange = function handleOverflowChange(overflow) {
|
|
7251
|
+
var _swipeRef$current3;
|
|
7252
|
+
setShowRotatorButtons(overflow);
|
|
7253
|
+
var hasNext = (_swipeRef$current3 = swipeRef.current) == null ? void 0 : _swipeRef$current3.hasNext();
|
|
7254
|
+
if (typeof hasNext === 'boolean') {
|
|
7255
|
+
setAvailableNext(hasNext);
|
|
7256
|
+
} else {
|
|
7257
|
+
setAvailableNext(overflow);
|
|
7258
|
+
}
|
|
7259
|
+
};
|
|
7260
|
+
var onNext = function onNext() {
|
|
7261
|
+
var _swipeRef$current4;
|
|
7262
|
+
if (!availableNext) return;
|
|
7263
|
+
(_swipeRef$current4 = swipeRef.current) == null || _swipeRef$current4.nextSlide();
|
|
7264
|
+
};
|
|
7265
|
+
var onPrev = function onPrev() {
|
|
7266
|
+
var _swipeRef$current5;
|
|
7267
|
+
if (!availablePrev) return;
|
|
7268
|
+
(_swipeRef$current5 = swipeRef.current) == null || _swipeRef$current5.prevSlide();
|
|
7269
|
+
};
|
|
7270
|
+
useEffect(function () {
|
|
7271
|
+
var el = castWrapperRef.current;
|
|
7272
|
+
if (!el) return undefined;
|
|
7273
|
+
var handleKeydown = function handleKeydown(e) {
|
|
7274
|
+
if (!el.contains(document.activeElement)) return;
|
|
7275
|
+
if (e.key === 'ArrowRight') {
|
|
7276
|
+
var _swipeRef$current6;
|
|
7277
|
+
e.preventDefault();
|
|
7278
|
+
(_swipeRef$current6 = swipeRef.current) == null || _swipeRef$current6.nextSlide();
|
|
7279
|
+
} else if (e.key === 'ArrowLeft') {
|
|
7280
|
+
var _swipeRef$current7;
|
|
7281
|
+
e.preventDefault();
|
|
7282
|
+
(_swipeRef$current7 = swipeRef.current) == null || _swipeRef$current7.prevSlide();
|
|
7283
|
+
}
|
|
7284
|
+
};
|
|
7285
|
+
el.addEventListener('keydown', handleKeydown);
|
|
7286
|
+
return function () {
|
|
7287
|
+
return el.removeEventListener('keydown', handleKeydown);
|
|
7288
|
+
};
|
|
7289
|
+
}, []);
|
|
7290
|
+
var handleMouseDown = useCallback(function (e) {
|
|
7291
|
+
if (!isMobile || !castWrapperRef.current) return;
|
|
7292
|
+
isDraggingRef.current = true;
|
|
7293
|
+
hasDraggedRef.current = false;
|
|
7294
|
+
startXRef.current = e.clientX;
|
|
7295
|
+
scrollStartRef.current = castWrapperRef.current.scrollLeft;
|
|
7296
|
+
if (e.target === castWrapperRef.current) e.preventDefault();
|
|
7297
|
+
}, [isMobile]);
|
|
7298
|
+
var handleMouseMove = useCallback(function (e) {
|
|
7299
|
+
if (!isMobile || !isDraggingRef.current || !castWrapperRef.current) return;
|
|
7300
|
+
var deltaX = e.clientX - startXRef.current;
|
|
7301
|
+
var threshold = 5;
|
|
7302
|
+
if (Math.abs(deltaX) > threshold) {
|
|
7303
|
+
hasDraggedRef.current = true;
|
|
7304
|
+
e.preventDefault();
|
|
7305
|
+
castWrapperRef.current.scrollLeft = scrollStartRef.current - deltaX;
|
|
7306
|
+
}
|
|
7307
|
+
}, [isMobile]);
|
|
7308
|
+
var handleMouseUp = useCallback(function () {
|
|
7309
|
+
if (!isMobile) return;
|
|
7310
|
+
isDraggingRef.current = false;
|
|
7311
|
+
setTimeout(function () {
|
|
7312
|
+
hasDraggedRef.current = false;
|
|
7313
|
+
}, 0);
|
|
7314
|
+
}, [isMobile]);
|
|
7315
|
+
var handleMouseLeave = useCallback(function () {
|
|
7316
|
+
if (!isMobile) return;
|
|
7317
|
+
isDraggingRef.current = false;
|
|
7318
|
+
hasDraggedRef.current = false;
|
|
7319
|
+
}, [isMobile]);
|
|
7320
|
+
var getCastItemSelectionId = useCallback(function (person) {
|
|
7321
|
+
if (person.id !== undefined && person.id !== null) return String(person.id);
|
|
7322
|
+
if (person.slug !== undefined && person.slug !== null) return String(person.slug);
|
|
7323
|
+
return person.name;
|
|
7324
|
+
}, []);
|
|
7325
|
+
var isIdSelectionMode = selectedIds !== undefined;
|
|
7326
|
+
var selectedIdsSet = useMemo(function () {
|
|
7327
|
+
var ids = selectedIds != null ? selectedIds : [];
|
|
7328
|
+
return new Set(ids.map(function (id) {
|
|
7329
|
+
return String(id);
|
|
7330
|
+
}));
|
|
7331
|
+
}, [selectedIds]);
|
|
7332
|
+
var selectedStateIndices = useMemo(function () {
|
|
7333
|
+
if (!isIdSelectionMode) return selectedIndices;
|
|
7334
|
+
return cast.flatMap(function (person, index) {
|
|
7335
|
+
var itemId = getCastItemSelectionId(person);
|
|
7336
|
+
return selectedIdsSet.has(itemId) ? [index] : [];
|
|
7337
|
+
});
|
|
7338
|
+
}, [cast, getCastItemSelectionId, isIdSelectionMode, selectedIdsSet, selectedIndices]);
|
|
7339
|
+
var selectedStateIds = useMemo(function () {
|
|
7340
|
+
if (isIdSelectionMode) {
|
|
7341
|
+
return cast.filter(function (person) {
|
|
7342
|
+
return selectedIdsSet.has(getCastItemSelectionId(person));
|
|
7343
|
+
}).map(function (person) {
|
|
7344
|
+
return getCastItemSelectionId(person);
|
|
7345
|
+
});
|
|
7346
|
+
}
|
|
7347
|
+
return selectedIndices.map(function (index) {
|
|
7348
|
+
return cast[index];
|
|
7349
|
+
}).filter(function (person) {
|
|
7350
|
+
return person !== undefined;
|
|
7351
|
+
}).map(function (person) {
|
|
7352
|
+
return getCastItemSelectionId(person);
|
|
7353
|
+
});
|
|
7354
|
+
}, [cast, getCastItemSelectionId, isIdSelectionMode, selectedIdsSet, selectedIndices]);
|
|
7355
|
+
var handleClick = React__default.useCallback(function (index, itemId, onClick) {
|
|
7356
|
+
if (hasDraggedRef.current) return;
|
|
7357
|
+
if (onSelectId) onSelectId(itemId);
|
|
7358
|
+
if (onSelect) onSelect(index);
|
|
7359
|
+
if (onClick) onClick();
|
|
7360
|
+
}, [onSelect, onSelectId]);
|
|
7361
|
+
var handlePersonKeydown = React__default.useCallback(function (e, index, itemId, onClick) {
|
|
7362
|
+
if (e.key === 'Enter' || e.key === ' ' || e.key === 'Spacebar') {
|
|
7363
|
+
e.preventDefault();
|
|
7364
|
+
handleClick(index, itemId, onClick);
|
|
7365
|
+
}
|
|
7366
|
+
}, [handleClick]);
|
|
7367
|
+
var handleClearKeydown = React__default.useCallback(function (e) {
|
|
7368
|
+
if (e.key === 'Enter' && onClear) {
|
|
7369
|
+
onClear();
|
|
7370
|
+
}
|
|
7371
|
+
}, [onClear]);
|
|
7372
|
+
var showActionButtonsSection = onApply || onClear || emptySelectionText;
|
|
7104
7373
|
var getPersonCards = function getPersonCards() {
|
|
7105
7374
|
return cast.map(function (person, index) {
|
|
7106
7375
|
var name = person.name,
|
|
@@ -7114,6 +7383,8 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7114
7383
|
key: personSelectionId,
|
|
7115
7384
|
"aria-selected": isSelected,
|
|
7116
7385
|
"aria-label": ariaLabel != null ? ariaLabel : name,
|
|
7386
|
+
"aria-posinset": index + 1,
|
|
7387
|
+
"aria-setsize": cast.length,
|
|
7117
7388
|
role: "option",
|
|
7118
7389
|
tabIndex: 0,
|
|
7119
7390
|
onClick: function onClick() {
|
|
@@ -7169,13 +7440,13 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7169
7440
|
onMouseMove: handleMouseMove,
|
|
7170
7441
|
onMouseUp: handleMouseUp,
|
|
7171
7442
|
onMouseLeave: handleMouseLeave
|
|
7172
|
-
},
|
|
7443
|
+
}, /*#__PURE__*/React__default.createElement(Swipe, {
|
|
7173
7444
|
onIndexChange: onIndexChangeHandler,
|
|
7174
7445
|
"data-testid": "cast-filter-swipe",
|
|
7175
7446
|
ref: swipeRef,
|
|
7176
7447
|
onOverflowChange: handleOverflowChange,
|
|
7177
7448
|
limitDragToNavigableRange: true
|
|
7178
|
-
}, getPersonCards())))
|
|
7449
|
+
}, getPersonCards()))), showActionButtonsSection && (/*#__PURE__*/React__default.createElement(ActionButtons, null, selectedStateIndices.length === 0 && emptySelectionText && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7179
7450
|
size: "medium",
|
|
7180
7451
|
className: "mobile-only"
|
|
7181
7452
|
}, 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, {
|
|
@@ -7191,12 +7462,12 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7191
7462
|
}, textLinkText != null ? textLinkText : 'Clear')))))));
|
|
7192
7463
|
};
|
|
7193
7464
|
|
|
7194
|
-
var _templateObject$
|
|
7195
|
-
var ContentWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
7196
|
-
var Wrapper$2 = /*#__PURE__*/styled.div(_templateObject2$
|
|
7197
|
-
var AddressWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
7465
|
+
var _templateObject$L, _templateObject2$y, _templateObject3$l, _templateObject4$j, _templateObject5$g, _templateObject6$a, _templateObject7$7;
|
|
7466
|
+
var ContentWrapper = /*#__PURE__*/styled.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobileAndTablet);
|
|
7467
|
+
var Wrapper$2 = /*#__PURE__*/styled.div(_templateObject2$y || (_templateObject2$y = /*#__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);
|
|
7468
|
+
var AddressWrapper = /*#__PURE__*/styled.div(_templateObject3$l || (_templateObject3$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 4px;\n"])));
|
|
7198
7469
|
var TitleWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: baseline;\n gap: 3px;\n"])));
|
|
7199
|
-
var MobileSuffixWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
7470
|
+
var MobileSuffixWrapper = /*#__PURE__*/styled.div(_templateObject5$g || (_templateObject5$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
7200
7471
|
var DesktopSuffixWrapper = /*#__PURE__*/styled.div(_templateObject6$a || (_templateObject6$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
7201
7472
|
var DetailsWrapper = /*#__PURE__*/styled.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);
|
|
7202
7473
|
|
|
@@ -7249,12 +7520,12 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
7249
7520
|
}, addressString)))))))));
|
|
7250
7521
|
};
|
|
7251
7522
|
|
|
7252
|
-
var _templateObject$
|
|
7253
|
-
var ContactNewsletterWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
7254
|
-
var ContactNewsletterSeparator = /*#__PURE__*/styled.div(_templateObject2$
|
|
7255
|
-
var SignUpWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
7523
|
+
var _templateObject$M, _templateObject2$z, _templateObject3$m, _templateObject4$k, _templateObject5$h, _templateObject6$b, _templateObject7$8, _templateObject8$5;
|
|
7524
|
+
var ContactNewsletterWrapper = /*#__PURE__*/styled.div(_templateObject$M || (_templateObject$M = /*#__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);
|
|
7525
|
+
var ContactNewsletterSeparator = /*#__PURE__*/styled.div(_templateObject2$z || (_templateObject2$z = /*#__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);
|
|
7526
|
+
var SignUpWrapper = /*#__PURE__*/styled.div(_templateObject3$m || (_templateObject3$m = /*#__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);
|
|
7256
7527
|
var SignUpText = /*#__PURE__*/styled.p(_templateObject4$k || (_templateObject4$k = /*#__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);
|
|
7257
|
-
var ContactWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
7528
|
+
var ContactWrapper = /*#__PURE__*/styled.div(_templateObject5$h || (_templateObject5$h = /*#__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);
|
|
7258
7529
|
var MediaLinksWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$b || (_templateObject6$b = /*#__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);
|
|
7259
7530
|
var MediaIconWrapper$1 = /*#__PURE__*/styled.a(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--footer-media-icon-height);\n width: var(--footer-media-icon-width);\n"])));
|
|
7260
7531
|
var TextLinkWrapper$1 = /*#__PURE__*/styled.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"])));
|
|
@@ -7282,16 +7553,16 @@ var ContactNewsletter = function ContactNewsletter(_ref) {
|
|
|
7282
7553
|
}, contact.title))));
|
|
7283
7554
|
};
|
|
7284
7555
|
|
|
7285
|
-
var _templateObject$
|
|
7286
|
-
var BodyTextRelative = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject$
|
|
7287
|
-
var ContentSummaryWrapper = /*#__PURE__*/styled.article(_templateObject2$
|
|
7556
|
+
var _templateObject$N, _templateObject2$A, _templateObject3$n, _templateObject4$l, _templateObject5$i, _templateObject6$c;
|
|
7557
|
+
var BodyTextRelative = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
7558
|
+
var ContentSummaryWrapper = /*#__PURE__*/styled.article(_templateObject2$A || (_templateObject2$A = /*#__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) {
|
|
7288
7559
|
return props.clickable ? 'pointer' : 'default';
|
|
7289
7560
|
}, devices.mobile);
|
|
7290
|
-
var ContentSummaryImageWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
7561
|
+
var ContentSummaryImageWrapper = /*#__PURE__*/styled.div(_templateObject3$n || (_templateObject3$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 0 0 33.3%;\n"])));
|
|
7291
7562
|
var ContentSummaryTextWrapper = /*#__PURE__*/styled.div(_templateObject4$l || (_templateObject4$l = /*#__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) {
|
|
7292
7563
|
return props.showImage ? 2 : '1 / span 4';
|
|
7293
7564
|
}, devices.mobile);
|
|
7294
|
-
var BodyTextLimit = /*#__PURE__*/styled.div(_templateObject5$
|
|
7565
|
+
var BodyTextLimit = /*#__PURE__*/styled.div(_templateObject5$i || (_templateObject5$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
|
|
7295
7566
|
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled.div(_templateObject6$c || (_templateObject6$c = /*#__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) {
|
|
7296
7567
|
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 ";
|
|
7297
7568
|
});
|
|
@@ -7375,21 +7646,21 @@ var ContentSummary = function ContentSummary(_ref) {
|
|
|
7375
7646
|
}), link.text))));
|
|
7376
7647
|
};
|
|
7377
7648
|
|
|
7378
|
-
var _templateObject$
|
|
7379
|
-
var EditorialGrid = /*#__PURE__*/styled.div(_templateObject$
|
|
7649
|
+
var _templateObject$O, _templateObject2$B, _templateObject3$o, _templateObject4$m, _templateObject5$j;
|
|
7650
|
+
var EditorialGrid = /*#__PURE__*/styled.div(_templateObject$O || (_templateObject$O = /*#__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) {
|
|
7380
7651
|
var imageToLeft = _ref.imageToLeft;
|
|
7381
7652
|
return imageToLeft ? "'left left left left left . right right right right right right'" : "'left left left left left left . right right right right right'";
|
|
7382
7653
|
}, devices.mobile);
|
|
7383
|
-
var EditorialImageWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
7654
|
+
var EditorialImageWrapper = /*#__PURE__*/styled.div(_templateObject2$B || (_templateObject2$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n align-self: center;\n grid-area: ", ";\n @media ", " {\n & {\n grid-area: row1;\n }\n"])), function (_ref2) {
|
|
7384
7655
|
var imageToLeft = _ref2.imageToLeft;
|
|
7385
7656
|
return imageToLeft ? 'left' : 'right';
|
|
7386
7657
|
}, devices.mobile);
|
|
7387
|
-
var EditorialTextWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
7658
|
+
var EditorialTextWrapper = /*#__PURE__*/styled.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n"])), function (_ref3) {
|
|
7388
7659
|
var imageToLeft = _ref3.imageToLeft;
|
|
7389
7660
|
return imageToLeft ? 'right' : 'left';
|
|
7390
7661
|
}, devices.mobile);
|
|
7391
7662
|
var EditorialSubtitle = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject4$m || (_templateObject4$m = /*#__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"])));
|
|
7392
|
-
var EditorialText = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject5$
|
|
7663
|
+
var EditorialText = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject5$j || (_templateObject5$j = /*#__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"])));
|
|
7393
7664
|
|
|
7394
7665
|
var Editorial = function Editorial(_ref) {
|
|
7395
7666
|
var _ref$imagePosition = _ref.imagePosition,
|
|
@@ -7428,10 +7699,10 @@ var Editorial = function Editorial(_ref) {
|
|
|
7428
7699
|
})))));
|
|
7429
7700
|
};
|
|
7430
7701
|
|
|
7431
|
-
var _templateObject$
|
|
7432
|
-
var HotFiltersWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
7433
|
-
var HotFilterOptionsWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
7434
|
-
var StyledHotFiltersButton = /*#__PURE__*/styled(PrimaryButton)(_templateObject3$
|
|
7702
|
+
var _templateObject$P, _templateObject2$C, _templateObject3$p;
|
|
7703
|
+
var HotFiltersWrapper = /*#__PURE__*/styled.div(_templateObject$P || (_templateObject$P = /*#__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"])));
|
|
7704
|
+
var HotFilterOptionsWrapper = /*#__PURE__*/styled.div(_templateObject2$C || (_templateObject2$C = /*#__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);
|
|
7705
|
+
var StyledHotFiltersButton = /*#__PURE__*/styled(PrimaryButton)(_templateObject3$p || (_templateObject3$p = /*#__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"])));
|
|
7435
7706
|
|
|
7436
7707
|
var _excluded$i = ["text", "onClick"];
|
|
7437
7708
|
var HotFilters = function HotFilters(_ref) {
|
|
@@ -7466,10 +7737,10 @@ var HotFilters = function HotFilters(_ref) {
|
|
|
7466
7737
|
})));
|
|
7467
7738
|
};
|
|
7468
7739
|
|
|
7469
|
-
var _templateObject$
|
|
7470
|
-
var ScrollContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
7471
|
-
var TabsContainerWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
7472
|
-
var StyledTab = /*#__PURE__*/styled(PrimaryButton)(_templateObject3$
|
|
7740
|
+
var _templateObject$Q, _templateObject2$D, _templateObject3$q;
|
|
7741
|
+
var ScrollContainer = /*#__PURE__*/styled.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\n @media ", " {\n overflow-x: visible;\n }\n"])), devices.mobile);
|
|
7742
|
+
var TabsContainerWrapper = /*#__PURE__*/styled.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 width: 100%;\n min-width: 0;\n flex-wrap: wrap;\n justify-content: flex-start;\n gap: 10px;\n }\n"])), devices.mobile);
|
|
7743
|
+
var StyledTab = /*#__PURE__*/styled(PrimaryButton)(_templateObject3$q || (_templateObject3$q = /*#__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);
|
|
7473
7744
|
|
|
7474
7745
|
var _excluded$j = ["text", "id", "isSelected", "allowedSelectedWith"];
|
|
7475
7746
|
/**
|
|
@@ -7544,8 +7815,8 @@ var CustomStrategyTabsFilter = function CustomStrategyTabsFilter(_ref) {
|
|
|
7544
7815
|
var _customViewConfig$bac, _customViewConfig$bac2, _customViewConfig$tex, _customViewConfig$tex2;
|
|
7545
7816
|
var items = _ref.items,
|
|
7546
7817
|
className = _ref.className,
|
|
7547
|
-
ariaLabel = _ref.ariaLabel,
|
|
7548
7818
|
onClick = _ref.onClick,
|
|
7819
|
+
ariaLabel = _ref.ariaLabel,
|
|
7549
7820
|
customViewConfig = _ref.customViewConfig;
|
|
7550
7821
|
var handleClick = React__default.useCallback(function (item) {
|
|
7551
7822
|
onClick(item);
|
|
@@ -7625,10 +7896,10 @@ var getBorderColor$1 = function getBorderColor(variant, colorValue) {
|
|
|
7625
7896
|
return variant === InformationCtaVariants.Primary || variant === InformationCtaVariants.Secondary || variant === undefined ? "border-color: " + colorValue + ";" : '';
|
|
7626
7897
|
};
|
|
7627
7898
|
|
|
7628
|
-
var _templateObject$
|
|
7629
|
-
var InfoWrapper = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
7630
|
-
var InfoTitle = /*#__PURE__*/styled('div')(_templateObject2$
|
|
7631
|
-
var InfoCTAWrapper = /*#__PURE__*/styled('div')(_templateObject3$
|
|
7899
|
+
var _templateObject$R, _templateObject2$E, _templateObject3$r, _templateObject4$n;
|
|
7900
|
+
var InfoWrapper = /*#__PURE__*/styled(Grid)(_templateObject$R || (_templateObject$R = /*#__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);
|
|
7901
|
+
var InfoTitle = /*#__PURE__*/styled('div')(_templateObject2$E || (_templateObject2$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n * {\n margin-block: 0;\n }\n"])));
|
|
7902
|
+
var InfoCTAWrapper = /*#__PURE__*/styled('div')(_templateObject3$r || (_templateObject3$r = /*#__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) {
|
|
7632
7903
|
var variant = _ref.variant,
|
|
7633
7904
|
theme = _ref.theme;
|
|
7634
7905
|
return getTextColor$4(variant, theme, COLORS$4.background);
|
|
@@ -7865,19 +8136,19 @@ var Information = function Information(_ref) {
|
|
|
7865
8136
|
})))));
|
|
7866
8137
|
};
|
|
7867
8138
|
|
|
7868
|
-
var _templateObject$
|
|
7869
|
-
var PageHeadingWrapper = /*#__PURE__*/styled('div')(_templateObject$
|
|
8139
|
+
var _templateObject$S, _templateObject2$F, _templateObject3$s, _templateObject4$o, _templateObject5$k, _templateObject6$d, _templateObject7$9, _templateObject8$6;
|
|
8140
|
+
var PageHeadingWrapper = /*#__PURE__*/styled('div')(_templateObject$S || (_templateObject$S = /*#__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) {
|
|
7870
8141
|
var isPageHeadingWithoutTitle = _ref.isPageHeadingWithoutTitle;
|
|
7871
8142
|
return isPageHeadingWithoutTitle && "\n padding-bottom: 42px;\n ";
|
|
7872
8143
|
}, devices.mobile);
|
|
7873
|
-
var PageHeadingGrid = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
8144
|
+
var PageHeadingGrid = /*#__PURE__*/styled(Grid)(_templateObject2$F || (_templateObject2$F = /*#__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) {
|
|
7874
8145
|
var isMultipleRow = _ref2.isMultipleRow;
|
|
7875
8146
|
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 ";
|
|
7876
8147
|
}, devices.mobile, devices.tablet, function (_ref3) {
|
|
7877
8148
|
var isMultipleRow = _ref3.isMultipleRow;
|
|
7878
8149
|
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 ";
|
|
7879
8150
|
});
|
|
7880
|
-
var BadgeWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
8151
|
+
var BadgeWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$s || (_templateObject3$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 35px;\n padding-bottom: 20px;\n\n ", ";\n"])), function (_ref4) {
|
|
7881
8152
|
var isPageHeadingWithoutTitle = _ref4.isPageHeadingWithoutTitle;
|
|
7882
8153
|
return isPageHeadingWithoutTitle && "\n height: 50px;\n padding-bottom: 0;\n margin: 10px 0;\n ";
|
|
7883
8154
|
});
|
|
@@ -7885,7 +8156,7 @@ var TitleWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$o || (_templateObj
|
|
|
7885
8156
|
var isPageHeadingWithoutTitle = _ref5.isPageHeadingWithoutTitle;
|
|
7886
8157
|
return isPageHeadingWithoutTitle && "\n margin-top: 42px;\n ";
|
|
7887
8158
|
}, devices.mobile);
|
|
7888
|
-
var ChildrenWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8159
|
+
var ChildrenWrapper = /*#__PURE__*/styled.div(_templateObject5$k || (_templateObject5$k = /*#__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) {
|
|
7889
8160
|
var isPageHeadingWithoutTitle = _ref6.isPageHeadingWithoutTitle;
|
|
7890
8161
|
return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
|
|
7891
8162
|
}, devices.mobile);
|
|
@@ -7970,9 +8241,9 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
7970
8241
|
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, themedLink), linkText))) : null));
|
|
7971
8242
|
};
|
|
7972
8243
|
|
|
7973
|
-
var _templateObject$
|
|
7974
|
-
var ImpactHeaderWrapper = /*#__PURE__*/styled.header(_templateObject$
|
|
7975
|
-
var ImpactTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
8244
|
+
var _templateObject$T, _templateObject2$G, _templateObject3$t, _templateObject4$p, _templateObject5$l, _templateObject6$e, _templateObject7$a, _templateObject8$7;
|
|
8245
|
+
var ImpactHeaderWrapper = /*#__PURE__*/styled.header(_templateObject$T || (_templateObject$T = /*#__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);
|
|
8246
|
+
var ImpactTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$G || (_templateObject2$G = /*#__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) {
|
|
7976
8247
|
var hasButton = _ref.hasButton,
|
|
7977
8248
|
sponsorPresent = _ref.sponsorPresent;
|
|
7978
8249
|
if (hasButton || sponsorPresent) return 'auto 80px 1fr 80px auto';
|
|
@@ -7981,12 +8252,12 @@ var ImpactTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$F || (_templat
|
|
|
7981
8252
|
var sponsorPresent = _ref2.sponsorPresent;
|
|
7982
8253
|
return sponsorPresent ? '1fr 20px auto' : '1fr';
|
|
7983
8254
|
});
|
|
7984
|
-
var TitleButtonWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
8255
|
+
var TitleButtonWrapper = /*#__PURE__*/styled.div(_templateObject3$t || (_templateObject3$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1;\n display: flex;\n align-items: center;\n min-width: ", ";\n"])), function (_ref3) {
|
|
7985
8256
|
var sponsorWidth = _ref3.sponsorWidth;
|
|
7986
8257
|
return sponsorWidth ? sponsorWidth + "px" : 'auto';
|
|
7987
8258
|
});
|
|
7988
8259
|
var TitleButton = /*#__PURE__*/styled(PrimaryButton)(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n position: static;\n margin-right: 0;\n }\n"])), devices.mobile);
|
|
7989
|
-
var MobileButtonWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8260
|
+
var MobileButtonWrapper = /*#__PURE__*/styled.div(_templateObject5$l || (_templateObject5$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 0;\n width: 100%;\n box-sizing: border-box;\n padding: 0 20px 16px 20px;\n"])));
|
|
7990
8261
|
var ImpactTitle = /*#__PURE__*/styled(HarmonicHeader)(_templateObject6$e || (_templateObject6$e = /*#__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) {
|
|
7991
8262
|
var hasColumns = _ref4.hasColumns;
|
|
7992
8263
|
return hasColumns ? '3' : '1';
|
|
@@ -7997,10 +8268,10 @@ var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject8$7 || (_templateObj
|
|
|
7997
8268
|
return buttonWidth ? buttonWidth + "px" : 'auto';
|
|
7998
8269
|
}, devices.mobile);
|
|
7999
8270
|
|
|
8000
|
-
var _templateObject$
|
|
8001
|
-
var VideoPlayButton$1 = /*#__PURE__*/styled.button(_templateObject$
|
|
8002
|
-
var VideoControlsWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$
|
|
8003
|
-
var VideoControlsInnerWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
8271
|
+
var _templateObject$U, _templateObject2$H, _templateObject3$u, _templateObject4$q;
|
|
8272
|
+
var VideoPlayButton$1 = /*#__PURE__*/styled.button(_templateObject$U || (_templateObject$U = /*#__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);
|
|
8273
|
+
var VideoControlsWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n width: 100%;\n"])));
|
|
8274
|
+
var VideoControlsInnerWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$u || (_templateObject3$u = /*#__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);
|
|
8004
8275
|
var LeftWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n"])));
|
|
8005
8276
|
|
|
8006
8277
|
var VideoControlsImpact = function VideoControlsImpact(_ref) {
|
|
@@ -8224,21 +8495,21 @@ var PageHeadingImpact = function PageHeadingImpact(_ref4) {
|
|
|
8224
8495
|
}), isMobile && link && linkText ? (/*#__PURE__*/React__default.createElement(MobileButtonWrapper, null, /*#__PURE__*/React__default.createElement(TitleButton, Object.assign({}, restLink), linkText))) : null));
|
|
8225
8496
|
};
|
|
8226
8497
|
|
|
8227
|
-
var _templateObject$
|
|
8228
|
-
var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8498
|
+
var _templateObject$V, _templateObject2$I, _templateObject3$v, _templateObject4$r, _templateObject5$m;
|
|
8499
|
+
var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$V || (_templateObject$V = /*#__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) {
|
|
8229
8500
|
var color = _ref.color;
|
|
8230
8501
|
return "\n background-color: " + (color ? "var(--base-color-" + color + ")" : 'var(--base-color-core)') + ";\n color: " + (color === Colors.White ? 'var(--base-color-black)' : 'var(--base-color-white)') + ";\n ";
|
|
8231
8502
|
}, devices.mobileAndTablet);
|
|
8232
|
-
var LeftPanel = /*#__PURE__*/styled.div(_templateObject2$
|
|
8503
|
+
var LeftPanel = /*#__PURE__*/styled.div(_templateObject2$I || (_templateObject2$I = /*#__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) {
|
|
8233
8504
|
var hasImage = _ref2.hasImage;
|
|
8234
8505
|
return hasImage ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
|
|
8235
8506
|
}, devices.mobileAndTablet, function (_ref3) {
|
|
8236
8507
|
var hasImage = _ref3.hasImage;
|
|
8237
8508
|
return hasImage ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
|
|
8238
8509
|
});
|
|
8239
|
-
var RightPanel = /*#__PURE__*/styled.div(_templateObject3$
|
|
8510
|
+
var RightPanel = /*#__PURE__*/styled.div(_templateObject3$v || (_templateObject3$v = /*#__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);
|
|
8240
8511
|
var InfoWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$r || (_templateObject4$r = /*#__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);
|
|
8241
|
-
var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8512
|
+
var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject5$m || (_templateObject5$m = /*#__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);
|
|
8242
8513
|
|
|
8243
8514
|
var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
8244
8515
|
var _image$src, _image$alt;
|
|
@@ -8268,12 +8539,12 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
8268
8539
|
})))));
|
|
8269
8540
|
};
|
|
8270
8541
|
|
|
8271
|
-
var _templateObject$
|
|
8272
|
-
var Wrapper$3 = /*#__PURE__*/styled.section(_templateObject$
|
|
8273
|
-
var ImageWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
8274
|
-
var SponsorWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
8542
|
+
var _templateObject$W, _templateObject2$J, _templateObject3$w, _templateObject4$s, _templateObject5$n, _templateObject6$f, _templateObject7$b, _templateObject8$8, _templateObject9$4, _templateObject0$4, _templateObject1$3;
|
|
8543
|
+
var Wrapper$3 = /*#__PURE__*/styled.section(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
8544
|
+
var ImageWrapper = /*#__PURE__*/styled.div(_templateObject2$J || (_templateObject2$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n picture,\n img {\n width: 100%;\n height: 100%;\n }\n"])));
|
|
8545
|
+
var SponsorWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$w || (_templateObject3$w = /*#__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);
|
|
8275
8546
|
var ImageButtonWrapper = /*#__PURE__*/styled.div(_templateObject4$s || (_templateObject4$s = /*#__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);
|
|
8276
|
-
var ContentSection = /*#__PURE__*/styled.div(_templateObject5$
|
|
8547
|
+
var ContentSection = /*#__PURE__*/styled.div(_templateObject5$n || (_templateObject5$n = /*#__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) {
|
|
8277
8548
|
var theme = _ref.theme;
|
|
8278
8549
|
return theme == ThemeType.Cinema ? '2px solid var(--color-base-light-grey)' : 'none';
|
|
8279
8550
|
}, function (_ref2) {
|
|
@@ -8482,7 +8753,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
8482
8753
|
})))))))))));
|
|
8483
8754
|
};
|
|
8484
8755
|
|
|
8485
|
-
var _templateObject$
|
|
8756
|
+
var _templateObject$X, _templateObject2$K, _templateObject3$x, _templateObject4$t;
|
|
8486
8757
|
var GRID = {
|
|
8487
8758
|
desktop: {
|
|
8488
8759
|
leftWithImage: '1 / 1 / 3 / 7',
|
|
@@ -8495,18 +8766,18 @@ var GRID = {
|
|
|
8495
8766
|
right: '2 / 1 / 3 / 15'
|
|
8496
8767
|
}
|
|
8497
8768
|
};
|
|
8498
|
-
var HighlightPanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8769
|
+
var HighlightPanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n background-color: ", ";\n color: var(--color-base-white);\n"])), function (_ref) {
|
|
8499
8770
|
var $background = _ref.$background;
|
|
8500
8771
|
return "var(--color-" + $background + ")";
|
|
8501
8772
|
});
|
|
8502
|
-
var LeftPanel$1 = /*#__PURE__*/styled.div(_templateObject2$
|
|
8773
|
+
var LeftPanel$1 = /*#__PURE__*/styled.div(_templateObject2$K || (_templateObject2$K = /*#__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) {
|
|
8503
8774
|
var hasImage = _ref2.hasImage;
|
|
8504
8775
|
return hasImage ? GRID.desktop.leftWithImage : GRID.desktop.leftNoImage;
|
|
8505
8776
|
}, devices.mobileAndTablet, function (_ref3) {
|
|
8506
8777
|
var hasImage = _ref3.hasImage;
|
|
8507
8778
|
return hasImage ? GRID.mobile.leftWithImage : GRID.mobile.leftNoImage;
|
|
8508
8779
|
});
|
|
8509
|
-
var RightPanel$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
8780
|
+
var RightPanel$1 = /*#__PURE__*/styled.div(_templateObject3$x || (_templateObject3$x = /*#__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);
|
|
8510
8781
|
var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject4$t || (_templateObject4$t = /*#__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);
|
|
8511
8782
|
|
|
8512
8783
|
var PageHeadingHighlight = function PageHeadingHighlight(_ref) {
|
|
@@ -8530,11 +8801,11 @@ var PageHeadingHighlight = function PageHeadingHighlight(_ref) {
|
|
|
8530
8801
|
})))));
|
|
8531
8802
|
};
|
|
8532
8803
|
|
|
8533
|
-
var _templateObject$
|
|
8534
|
-
var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$
|
|
8535
|
-
var BrandingTextBody = /*#__PURE__*/styled.div(_templateObject2$
|
|
8536
|
-
var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
8537
|
-
var CompactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8804
|
+
var _templateObject$Y, _templateObject2$L, _templateObject3$y, _templateObject5$o, _templateObject6$g, _templateObject7$c, _templateObject8$9, _templateObject9$5, _templateObject0$5;
|
|
8805
|
+
var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$Y || (_templateObject$Y = /*#__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);
|
|
8806
|
+
var BrandingTextBody = /*#__PURE__*/styled.div(_templateObject2$L || (_templateObject2$L = /*#__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"])));
|
|
8807
|
+
var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$y || (_templateObject3$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
|
|
8808
|
+
var CompactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject5$o || (_templateObject5$o = /*#__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);
|
|
8538
8809
|
var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$g || (_templateObject6$g = /*#__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) {
|
|
8539
8810
|
var invert = _ref.invert,
|
|
8540
8811
|
theme = _ref.theme;
|
|
@@ -8784,10 +9055,10 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
8784
9055
|
}), linkText))))));
|
|
8785
9056
|
};
|
|
8786
9057
|
|
|
8787
|
-
var _templateObject$
|
|
8788
|
-
var HighlightsGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8789
|
-
var HighlightTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
8790
|
-
var HighlightTextWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
9058
|
+
var _templateObject$Z, _templateObject2$M, _templateObject3$z, _templateObject4$u, _templateObject5$p, _templateObject6$h, _templateObject7$d;
|
|
9059
|
+
var HighlightsGrid = /*#__PURE__*/styled(Grid)(_templateObject$Z || (_templateObject$Z = /*#__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);
|
|
9060
|
+
var HighlightTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$M || (_templateObject2$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n h1 {\n margin: 0 0 8px 0;\n }\n p {\n text-transform: uppercase;\n }\n"])));
|
|
9061
|
+
var HighlightTextWrapper = /*#__PURE__*/styled.div(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobile);
|
|
8791
9062
|
var HighlightsInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__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) {
|
|
8792
9063
|
var hasImages = _ref.hasImages;
|
|
8793
9064
|
return hasImages ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
|
|
@@ -8795,12 +9066,12 @@ var HighlightsInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$u || (_temp
|
|
|
8795
9066
|
var hasImages = _ref2.hasImages;
|
|
8796
9067
|
return hasImages ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
|
|
8797
9068
|
});
|
|
8798
|
-
var HighlightsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
9069
|
+
var HighlightsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject5$p || (_templateObject5$p = /*#__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) {
|
|
8799
9070
|
var hasMultipleImages = _ref3.hasMultipleImages;
|
|
8800
9071
|
return hasMultipleImages ? 'width: calc(100% - 50px - var(--rotator-button-width)); -webkit-transform: translate3d(0, 0, 0);' : 'width: 100%';
|
|
8801
9072
|
}, devices.mobile);
|
|
8802
9073
|
var RotatorButtonsWrapperMobile = /*#__PURE__*/styled.div(_templateObject6$h || (_templateObject6$h = /*#__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);
|
|
8803
|
-
var RotatorButtonsWrapper$
|
|
9074
|
+
var RotatorButtonsWrapper$2 = /*#__PURE__*/styled.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);
|
|
8804
9075
|
|
|
8805
9076
|
/* eslint-disable react/no-danger */
|
|
8806
9077
|
var PageHeadingHighlightCarousel = function PageHeadingHighlightCarousel(_ref) {
|
|
@@ -8843,7 +9114,7 @@ var PageHeadingHighlightCarousel = function PageHeadingHighlightCarousel(_ref) {
|
|
|
8843
9114
|
}
|
|
8844
9115
|
})))) : null), hasImages && (/*#__PURE__*/React__default.createElement(HighlightsCarouselWrapper, {
|
|
8845
9116
|
hasMultipleImages: hasMultipleImages
|
|
8846
|
-
}, hasMultipleImages && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$
|
|
9117
|
+
}, hasMultipleImages && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$2, {
|
|
8847
9118
|
"data-testid": "rotator-buttons"
|
|
8848
9119
|
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
8849
9120
|
onClickNext: onNext,
|
|
@@ -8863,11 +9134,11 @@ var PageHeadingHighlightCarousel = function PageHeadingHighlightCarousel(_ref) {
|
|
|
8863
9134
|
}))))));
|
|
8864
9135
|
};
|
|
8865
9136
|
|
|
8866
|
-
var _templateObject$
|
|
8867
|
-
var linkButtonStyles = /*#__PURE__*/css(_templateObject$
|
|
8868
|
-
var PageNav = /*#__PURE__*/styled.a(_templateObject2$
|
|
8869
|
-
var PaginationLink = /*#__PURE__*/styled.a(_templateObject3$
|
|
8870
|
-
var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject5$
|
|
9137
|
+
var _templateObject$_, _templateObject2$N, _templateObject3$A, _templateObject5$q, _templateObject6$i, _templateObject7$e, _templateObject8$a;
|
|
9138
|
+
var linkButtonStyles = /*#__PURE__*/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"])));
|
|
9139
|
+
var PageNav = /*#__PURE__*/styled.a(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
|
|
9140
|
+
var PaginationLink = /*#__PURE__*/styled.a(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
|
|
9141
|
+
var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject5$q || (_templateObject5$q = /*#__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"])));
|
|
8871
9142
|
var LastPageItem = /*#__PURE__*/styled.li(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
|
|
8872
9143
|
var PreviousPageItem = /*#__PURE__*/styled.li(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
|
|
8873
9144
|
var TextLinkPagination = /*#__PURE__*/styled(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) {
|
|
@@ -9022,15 +9293,15 @@ var Pagination = function Pagination(_ref) {
|
|
|
9022
9293
|
}))))));
|
|
9023
9294
|
};
|
|
9024
9295
|
|
|
9025
|
-
var _templateObject
|
|
9026
|
-
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject
|
|
9296
|
+
var _templateObject$$;
|
|
9297
|
+
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$$ || (_templateObject$$ = /*#__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) {
|
|
9027
9298
|
var $largeDesktopColumns = _ref.$largeDesktopColumns;
|
|
9028
9299
|
return "repeat(" + ($largeDesktopColumns != null ? $largeDesktopColumns : 4) + ", 1fr)";
|
|
9029
9300
|
});
|
|
9030
9301
|
|
|
9031
|
-
var _templateObject
|
|
9032
|
-
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject
|
|
9033
|
-
var RoleContent = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject2$
|
|
9302
|
+
var _templateObject$10, _templateObject2$O;
|
|
9303
|
+
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-primary-black);\n }\n grid-area: role-person;\n break-inside: avoid;\n"])));
|
|
9304
|
+
var RoleContent = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: var(--color-base-dark-grey);\n }\n overflow-wrap: break-word;\n padding-bottom: 4px;\n"])));
|
|
9034
9305
|
|
|
9035
9306
|
var PersonDetails = function PersonDetails(_ref) {
|
|
9036
9307
|
var _role$people;
|
|
@@ -9052,9 +9323,9 @@ var PersonDetails = function PersonDetails(_ref) {
|
|
|
9052
9323
|
})));
|
|
9053
9324
|
};
|
|
9054
9325
|
|
|
9055
|
-
var _templateObject$
|
|
9056
|
-
var PersonWrapper$
|
|
9057
|
-
var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
9326
|
+
var _templateObject$11, _templateObject2$P;
|
|
9327
|
+
var PersonWrapper$2 = /*#__PURE__*/styled.div(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 82px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 16px;\n"])));
|
|
9328
|
+
var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 82px;\n height: 82px;\n filter: ", ";\n }\n"])), function (_ref) {
|
|
9058
9329
|
var greyscale = _ref.greyscale;
|
|
9059
9330
|
return greyscale ? 'grayscale(100%)' : 'none';
|
|
9060
9331
|
});
|
|
@@ -9068,7 +9339,7 @@ var PersonCard = function PersonCard(_ref) {
|
|
|
9068
9339
|
var firstPerson = (_role$people = role.people) == null ? void 0 : _role$people[0];
|
|
9069
9340
|
return Boolean((firstPerson == null ? void 0 : firstPerson.headshot) && firstPerson.useHeadshot);
|
|
9070
9341
|
}, [role]);
|
|
9071
|
-
if (hasHeadshot) return /*#__PURE__*/React__default.createElement(PersonWrapper$
|
|
9342
|
+
if (hasHeadshot) return /*#__PURE__*/React__default.createElement(PersonWrapper$2, {
|
|
9072
9343
|
className: className
|
|
9073
9344
|
}, /*#__PURE__*/React__default.createElement(HeadshotWrapper, {
|
|
9074
9345
|
greyscale: greyscale
|
|
@@ -9103,13 +9374,13 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
9103
9374
|
}));
|
|
9104
9375
|
};
|
|
9105
9376
|
|
|
9106
|
-
var _templateObject$
|
|
9107
|
-
var ReplacementWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
9108
|
-
var CreditListingWrapper = /*#__PURE__*/styled(PeopleListingGrid)(_templateObject2$
|
|
9377
|
+
var _templateObject$12, _templateObject2$Q, _templateObject3$B;
|
|
9378
|
+
var ReplacementWrapper = /*#__PURE__*/styled.div(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
|
|
9379
|
+
var CreditListingWrapper = /*#__PURE__*/styled(PeopleListingGrid)(_templateObject2$Q || (_templateObject2$Q = /*#__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) {
|
|
9109
9380
|
var columnCount = _ref.columnCount;
|
|
9110
9381
|
return "repeat(" + columnCount + ", 1fr)";
|
|
9111
9382
|
}, devices.mobile, devices.tablet);
|
|
9112
|
-
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
9383
|
+
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n min-height: 1.5em;\n"])));
|
|
9113
9384
|
|
|
9114
9385
|
// Get the total character length of a property in an array of objects
|
|
9115
9386
|
var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
|
|
@@ -9235,8 +9506,8 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
9235
9506
|
}, creditEntries);
|
|
9236
9507
|
};
|
|
9237
9508
|
|
|
9238
|
-
var _templateObject$
|
|
9239
|
-
var PolicyLinksTextLinkWrapper = /*#__PURE__*/styled(TextLink)(_templateObject$
|
|
9509
|
+
var _templateObject$13;
|
|
9510
|
+
var PolicyLinksTextLinkWrapper = /*#__PURE__*/styled(TextLink)(_templateObject$13 || (_templateObject$13 = /*#__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"])));
|
|
9240
9511
|
|
|
9241
9512
|
var PolicyLinks = function PolicyLinks(_ref) {
|
|
9242
9513
|
var items = _ref.items;
|
|
@@ -9254,14 +9525,14 @@ var PolicyLinks = function PolicyLinks(_ref) {
|
|
|
9254
9525
|
}));
|
|
9255
9526
|
};
|
|
9256
9527
|
|
|
9257
|
-
var _templateObject$
|
|
9528
|
+
var _templateObject$14, _templateObject3$C, _templateObject4$v, _templateObject5$r, _templateObject6$j, _templateObject7$f, _templateObject8$b, _templateObject9$6, _templateObject0$6, _templateObject1$4, _templateObject10$3, _templateObject11$2, _templateObject12$2, _templateObject13$1, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
|
|
9258
9529
|
var LENGTH_TEXT = 28;
|
|
9259
9530
|
var LENGTH_TEXT_TABLET$1 = 12;
|
|
9260
9531
|
var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
|
|
9261
9532
|
var GridTemplateImageToRight = "'. . left left left left left . right right right right right right right right'";
|
|
9262
9533
|
var GridTemplateAsCard = "'. . left left left left left right right right right right right right . . '";
|
|
9263
9534
|
var GridTemplateAsCardTablet = "'. . left left left left left left left right right right right right . . '";
|
|
9264
|
-
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
9535
|
+
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$14 || (_templateObject$14 = /*#__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) {
|
|
9265
9536
|
var imageToLeft = _ref.imageToLeft;
|
|
9266
9537
|
return imageToLeft ? GridTemplateImageToLeft : GridTemplateImageToRight;
|
|
9267
9538
|
}, devices.tablet, function (_ref2) {
|
|
@@ -9271,7 +9542,7 @@ var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$13 || (_templa
|
|
|
9271
9542
|
var asCard = _ref3.asCard;
|
|
9272
9543
|
return asCard ? "\n grid-template-areas: " + GridTemplateAsCard + ";\n @media " + devices.tablet + " {\n grid-template-areas: " + GridTemplateAsCardTablet + ";\n }\n " : "";
|
|
9273
9544
|
});
|
|
9274
|
-
var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject3$
|
|
9545
|
+
var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject3$C || (_templateObject3$C = /*#__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) {
|
|
9275
9546
|
var hasTextLinks = _ref4.hasTextLinks;
|
|
9276
9547
|
return "margin-top: " + (hasTextLinks ? '0' : '24px') + ";";
|
|
9277
9548
|
}, function (_ref5) {
|
|
@@ -9302,7 +9573,7 @@ var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject4$v || (_te
|
|
|
9302
9573
|
var mobileMarginBottom = _ref8.mobileMarginBottom;
|
|
9303
9574
|
return mobileMarginBottom && "\n @media " + devices.mobile + " {\n margin-bottom: " + mobileMarginBottom + "px;\n }\n ";
|
|
9304
9575
|
});
|
|
9305
|
-
var TextLinksContainer = /*#__PURE__*/styled.div(_templateObject5$
|
|
9576
|
+
var TextLinksContainer = /*#__PURE__*/styled.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
|
|
9306
9577
|
var TextLinkWrapper$2 = /*#__PURE__*/styled.div(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
|
|
9307
9578
|
var ExtraContentWrapper = /*#__PURE__*/styled.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);
|
|
9308
9579
|
var IconWrapper$2 = /*#__PURE__*/styled.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);
|
|
@@ -9526,26 +9797,26 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
9526
9797
|
}))));
|
|
9527
9798
|
};
|
|
9528
9799
|
|
|
9529
|
-
var _templateObject$
|
|
9800
|
+
var _templateObject$15, _templateObject2$R, _templateObject3$D, _templateObject4$w, _templateObject5$s, _templateObject6$k, _templateObject7$g;
|
|
9530
9801
|
var LENGTH_TEXT$2 = 28;
|
|
9531
9802
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
9532
|
-
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
9803
|
+
var PromoWithTitleGrid = /*#__PURE__*/styled(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"])), function (_ref) {
|
|
9533
9804
|
var imageToLeft = _ref.imageToLeft;
|
|
9534
9805
|
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'";
|
|
9535
9806
|
}, devices.tablet, function (_ref2) {
|
|
9536
9807
|
var imageToLeft = _ref2.imageToLeft;
|
|
9537
9808
|
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'";
|
|
9538
9809
|
}, devices.mobile);
|
|
9539
|
-
var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
9810
|
+
var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref3) {
|
|
9540
9811
|
var imageToLeft = _ref3.imageToLeft;
|
|
9541
9812
|
return imageToLeft ? 'left' : 'right';
|
|
9542
9813
|
}, devices.mobile);
|
|
9543
|
-
var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
9814
|
+
var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$D || (_templateObject3$D = /*#__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) {
|
|
9544
9815
|
var imageToLeft = _ref4.imageToLeft;
|
|
9545
9816
|
return imageToLeft ? 'right' : 'left';
|
|
9546
9817
|
}, devices.mobile);
|
|
9547
9818
|
var HarmonicHeaderWithWrapper$1 = /*#__PURE__*/styled(HarmonicHeader)(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 32px;\n\n @media ", " {\n padding-bottom: 24px;\n }\n"])), devices.mobile);
|
|
9548
|
-
var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject5$
|
|
9819
|
+
var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
|
|
9549
9820
|
var BodyCopyHarmonicWithWrapper$2 = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject6$k || (_templateObject6$k = /*#__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);
|
|
9550
9821
|
var ButtonsContainer$3 = /*#__PURE__*/styled.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) {
|
|
9551
9822
|
var _ref5$primaryButtonTe = _ref5.primaryButtonTextLength,
|
|
@@ -9569,8 +9840,8 @@ var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$g || (_templat
|
|
|
9569
9840
|
return '';
|
|
9570
9841
|
});
|
|
9571
9842
|
|
|
9572
|
-
var _templateObject$
|
|
9573
|
-
var VideoContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
9843
|
+
var _templateObject$16;
|
|
9844
|
+
var VideoContainer = /*#__PURE__*/styled.div(_templateObject$16 || (_templateObject$16 = /*#__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) {
|
|
9574
9845
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
9575
9846
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
9576
9847
|
return aspectRatio;
|
|
@@ -9752,10 +10023,10 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
9752
10023
|
}, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? (/*#__PURE__*/React__default.createElement(TertiaryButton, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate)) : null)) : null));
|
|
9753
10024
|
};
|
|
9754
10025
|
|
|
9755
|
-
var _templateObject$
|
|
9756
|
-
var FigureBlock = /*#__PURE__*/styled.figure(_templateObject$
|
|
9757
|
-
var BlockquoteBlock = /*#__PURE__*/styled.blockquote(_templateObject2$
|
|
9758
|
-
var AttributionBlock = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject3$
|
|
10026
|
+
var _templateObject$17, _templateObject2$S, _templateObject3$E;
|
|
10027
|
+
var FigureBlock = /*#__PURE__*/styled.figure(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
|
|
10028
|
+
var BlockquoteBlock = /*#__PURE__*/styled.blockquote(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n"])));
|
|
10029
|
+
var AttributionBlock = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject3$E || (_templateObject3$E = /*#__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);
|
|
9759
10030
|
|
|
9760
10031
|
/* eslint-disable react/no-danger */
|
|
9761
10032
|
var Quote = function Quote(_ref) {
|
|
@@ -9785,9 +10056,9 @@ var Quote = function Quote(_ref) {
|
|
|
9785
10056
|
}, /*#__PURE__*/React__default.createElement("cite", null, attribution))))));
|
|
9786
10057
|
};
|
|
9787
10058
|
|
|
9788
|
-
var _templateObject$
|
|
9789
|
-
var Container$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
9790
|
-
var RadioGroup = /*#__PURE__*/styled.div(_templateObject2$
|
|
10059
|
+
var _templateObject$18, _templateObject2$T, _templateObject3$F;
|
|
10060
|
+
var Container$3 = /*#__PURE__*/styled.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
10061
|
+
var RadioGroup = /*#__PURE__*/styled.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
|
|
9791
10062
|
var horizontalMode = _ref.horizontalMode;
|
|
9792
10063
|
if (horizontalMode) return 'row';
|
|
9793
10064
|
return 'column';
|
|
@@ -9795,7 +10066,7 @@ var RadioGroup = /*#__PURE__*/styled.div(_templateObject2$S || (_templateObject2
|
|
|
9795
10066
|
var gap = _ref2.gap;
|
|
9796
10067
|
return gap + "px";
|
|
9797
10068
|
});
|
|
9798
|
-
var ErrorLabel$4 = /*#__PURE__*/styled.div(_templateObject3$
|
|
10069
|
+
var ErrorLabel$4 = /*#__PURE__*/styled.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref3) {
|
|
9799
10070
|
var darkMode = _ref3.darkMode;
|
|
9800
10071
|
if (darkMode) return 'var(--base-color-white)';
|
|
9801
10072
|
return 'var(--base-color-errorstate)';
|
|
@@ -9872,10 +10143,10 @@ var RadioGroup2 = function RadioGroup2(_ref) {
|
|
|
9872
10143
|
}, error))));
|
|
9873
10144
|
};
|
|
9874
10145
|
|
|
9875
|
-
var _templateObject$
|
|
9876
|
-
var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
9877
|
-
var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$
|
|
9878
|
-
var SvgContainer$3 = /*#__PURE__*/styled.div(_templateObject3$
|
|
10146
|
+
var _templateObject$19, _templateObject2$U, _templateObject3$G;
|
|
10147
|
+
var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$19 || (_templateObject$19 = /*#__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);
|
|
10148
|
+
var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$U || (_templateObject2$U = /*#__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"])));
|
|
10149
|
+
var SvgContainer$3 = /*#__PURE__*/styled.div(_templateObject3$G || (_templateObject3$G = /*#__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);
|
|
9879
10150
|
|
|
9880
10151
|
/* eslint-disable react/no-danger */
|
|
9881
10152
|
var StatusBanner = function StatusBanner(_ref) {
|
|
@@ -9931,11 +10202,11 @@ var StatusBanner = function StatusBanner(_ref) {
|
|
|
9931
10202
|
return null;
|
|
9932
10203
|
};
|
|
9933
10204
|
|
|
9934
|
-
var _templateObject$
|
|
9935
|
-
var SearchBarContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
9936
|
-
var SvgContainerSearch = /*#__PURE__*/styled.div(_templateObject2$
|
|
9937
|
-
var SvgContainerClose = /*#__PURE__*/styled.button(_templateObject3$
|
|
9938
|
-
var InputContainer = /*#__PURE__*/styled.div(_templateObject5$
|
|
10205
|
+
var _templateObject$1a, _templateObject2$V, _templateObject3$H, _templateObject5$t, _templateObject6$l, _templateObject7$h;
|
|
10206
|
+
var SearchBarContainer = /*#__PURE__*/styled.div(_templateObject$1a || (_templateObject$1a = /*#__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);
|
|
10207
|
+
var SvgContainerSearch = /*#__PURE__*/styled.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-xlarge-gap);\n height: var(--navigation-xlarge-gap);\n }\n"])));
|
|
10208
|
+
var SvgContainerClose = /*#__PURE__*/styled.button(_templateObject3$H || (_templateObject3$H = /*#__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"])));
|
|
10209
|
+
var InputContainer = /*#__PURE__*/styled.div(_templateObject5$t || (_templateObject5$t = /*#__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);
|
|
9939
10210
|
var TextLinkWrapper$3 = /*#__PURE__*/styled(TextLink)(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-primary-red);\n"])));
|
|
9940
10211
|
var SearchArrowContainer = /*#__PURE__*/styled.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"])));
|
|
9941
10212
|
|
|
@@ -10075,8 +10346,8 @@ var SearchBar = function SearchBar(_ref) {
|
|
|
10075
10346
|
})));
|
|
10076
10347
|
};
|
|
10077
10348
|
|
|
10078
|
-
var _templateObject$
|
|
10079
|
-
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
10349
|
+
var _templateObject$1b;
|
|
10350
|
+
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__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);
|
|
10080
10351
|
|
|
10081
10352
|
/* ~~~~~~~ new harmonic types ~~~~~~~ */
|
|
10082
10353
|
var HarmonicSize = {
|
|
@@ -10118,9 +10389,9 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
10118
10389
|
}, description)))));
|
|
10119
10390
|
};
|
|
10120
10391
|
|
|
10121
|
-
var _templateObject$
|
|
10122
|
-
var Container$4 = /*#__PURE__*/styled.div(_templateObject$
|
|
10123
|
-
var SelectWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
10392
|
+
var _templateObject$1c, _templateObject2$W, _templateObject3$I, _templateObject4$x;
|
|
10393
|
+
var Container$4 = /*#__PURE__*/styled.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
10394
|
+
var SelectWrapper = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObject2$W = /*#__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) {
|
|
10124
10395
|
var width = _ref.width;
|
|
10125
10396
|
if (!width) return 'none';
|
|
10126
10397
|
return width + "px";
|
|
@@ -10137,7 +10408,7 @@ var SelectWrapper = /*#__PURE__*/styled.div(_templateObject2$V || (_templateObje
|
|
|
10137
10408
|
if (darkMode) return "0 0 0 1px var(--color-state-medium)";
|
|
10138
10409
|
return "0 0 0 3px var(--base-color-lapislazuli)";
|
|
10139
10410
|
}, devices.mobile, devices.mobile);
|
|
10140
|
-
var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$
|
|
10411
|
+
var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0 20px;\n color: ", ";\n\n @media ", " {\n margin: 0 0 12px;\n }\n"])), function (_ref5) {
|
|
10141
10412
|
var darkMode = _ref5.darkMode;
|
|
10142
10413
|
if (darkMode) return "var(--color-base-white)";
|
|
10143
10414
|
return "var(--color-primary-black)";
|
|
@@ -10261,15 +10532,15 @@ var SelectComponent$1 = function SelectComponent(_ref) {
|
|
|
10261
10532
|
})));
|
|
10262
10533
|
};
|
|
10263
10534
|
|
|
10264
|
-
var _templateObject$
|
|
10265
|
-
var TabsContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
10266
|
-
var ItemsContainer = /*#__PURE__*/styled.div(_templateObject2$
|
|
10535
|
+
var _templateObject$1d, _templateObject2$X, _templateObject3$J, _templateObject4$y;
|
|
10536
|
+
var TabsContainer = /*#__PURE__*/styled.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
|
|
10537
|
+
var ItemsContainer = /*#__PURE__*/styled.div(_templateObject2$X || (_templateObject2$X = /*#__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) {
|
|
10267
10538
|
if (props.showMenu) {
|
|
10268
10539
|
return "\n display: flex;\n flex-direction: column;\n row-gap: 28px;\n ";
|
|
10269
10540
|
}
|
|
10270
10541
|
return "display: none;";
|
|
10271
10542
|
});
|
|
10272
|
-
var MenuContainer$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
10543
|
+
var MenuContainer$1 = /*#__PURE__*/styled.div(_templateObject3$J || (_templateObject3$J = /*#__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);
|
|
10273
10544
|
var MenuItem = /*#__PURE__*/styled.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n a {\n margin-left: 0;\n }\n }\n"])), devices.mobileAndTablet);
|
|
10274
10545
|
|
|
10275
10546
|
/* eslint-disable jsx-a11y/no-static-element-interactions */
|
|
@@ -10396,9 +10667,9 @@ var Tabs = function Tabs(_ref) {
|
|
|
10396
10667
|
}, "Menu"))))));
|
|
10397
10668
|
};
|
|
10398
10669
|
|
|
10399
|
-
var _templateObject$
|
|
10400
|
-
var Wrapper$5 = /*#__PURE__*/styled.div(_templateObject$
|
|
10401
|
-
var PromoLabel = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject3$
|
|
10670
|
+
var _templateObject$1e, _templateObject3$K, _templateObject4$z, _templateObject5$u, _templateObject6$m, _templateObject7$i, _templateObject8$c, _templateObject9$7;
|
|
10671
|
+
var Wrapper$5 = /*#__PURE__*/styled.div(_templateObject$1e || (_templateObject$1e = /*#__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"])));
|
|
10672
|
+
var PromoLabel = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject3$K || (_templateObject3$K = /*#__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"])));
|
|
10402
10673
|
var ButtonContainer = /*#__PURE__*/styled.div(_templateObject4$z || (_templateObject4$z = /*#__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) {
|
|
10403
10674
|
var stackCtasEarly = _ref.stackCtasEarly;
|
|
10404
10675
|
return stackCtasEarly ? devices.smallDesktop + ", " + devices.mobileAndTablet : devices.mobile;
|
|
@@ -10406,7 +10677,7 @@ var ButtonContainer = /*#__PURE__*/styled.div(_templateObject4$z || (_templateOb
|
|
|
10406
10677
|
var stackCtasEarly = _ref2.stackCtasEarly;
|
|
10407
10678
|
return stackCtasEarly && "\n @media " + devices.smallDesktop + ", " + devices.mobileAndTablet + " {\n * {\n width: 100%;\n }\n }\n ";
|
|
10408
10679
|
}, devices.smallDesktop, devices.mobileAndTablet);
|
|
10409
|
-
var TitleContainer$3 = /*#__PURE__*/styled.div(_templateObject5$
|
|
10680
|
+
var TitleContainer$3 = /*#__PURE__*/styled.div(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--color-primary-black);\n display: flex;\n flex-direction: column;\n gap: ", ";\n align-items: stretch;\n"])), function (_ref3) {
|
|
10410
10681
|
var singleChild = _ref3.singleChild;
|
|
10411
10682
|
return singleChild ? '0' : '10px';
|
|
10412
10683
|
});
|
|
@@ -10504,8 +10775,8 @@ var UpsellCard = function UpsellCard(_ref) {
|
|
|
10504
10775
|
}, /*#__PURE__*/React__default.createElement(SecondaryButton, Object.assign({}, secondaryLink), truncate(secondaryLink.text, LENGTH_SMALL_TEXT$2))))))));
|
|
10505
10776
|
};
|
|
10506
10777
|
|
|
10507
|
-
var _templateObject$
|
|
10508
|
-
var Wrapper$6 = /*#__PURE__*/styled.figure(_templateObject$
|
|
10778
|
+
var _templateObject$1f, _templateObject2$Y, _templateObject3$L;
|
|
10779
|
+
var Wrapper$6 = /*#__PURE__*/styled.figure(_templateObject$1f || (_templateObject$1f = /*#__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) {
|
|
10509
10780
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
10510
10781
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
10511
10782
|
return aspectRatio;
|
|
@@ -10515,8 +10786,8 @@ var Wrapper$6 = /*#__PURE__*/styled.figure(_templateObject$1e || (_templateObjec
|
|
|
10515
10786
|
height = _ref2.height;
|
|
10516
10787
|
return height ? "calc(" + height + "px * " + AspectRatioWidth[aspectRatio] + ")" : 'auto';
|
|
10517
10788
|
});
|
|
10518
|
-
var CaptionWrapper = /*#__PURE__*/styled.figcaption(_templateObject2$
|
|
10519
|
-
var CaptionContext = /*#__PURE__*/styled(Caption)(_templateObject3$
|
|
10789
|
+
var CaptionWrapper = /*#__PURE__*/styled.figcaption(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: table-caption;\n caption-side: bottom;\n margin-top: var(--carousel-image-caption-margin);\n"])));
|
|
10790
|
+
var CaptionContext = /*#__PURE__*/styled(Caption)(_templateObject3$L || (_templateObject3$L = /*#__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"])));
|
|
10520
10791
|
|
|
10521
10792
|
var _excluded$q = ["caption", "altText", "src", "srcSet", "sizes", "loading", "aspectRatio", "className"];
|
|
10522
10793
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
@@ -10549,12 +10820,12 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
10549
10820
|
}, caption))));
|
|
10550
10821
|
};
|
|
10551
10822
|
|
|
10552
|
-
var _templateObject$
|
|
10553
|
-
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
10554
|
-
var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$
|
|
10555
|
-
var StyledImage = /*#__PURE__*/styled.img(_templateObject3$
|
|
10823
|
+
var _templateObject$1g, _templateObject2$Z, _templateObject3$M, _templateObject4$A, _templateObject5$v, _templateObject6$n;
|
|
10824
|
+
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$1g || (_templateObject$1g = /*#__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"])));
|
|
10825
|
+
var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
10826
|
+
var StyledImage = /*#__PURE__*/styled.img(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
10556
10827
|
var ImageWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
10557
|
-
var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$
|
|
10828
|
+
var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$v || (_templateObject5$v = /*#__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);
|
|
10558
10829
|
var TitleWrapper$4 = /*#__PURE__*/styled.div(_templateObject6$n || (_templateObject6$n = /*#__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);
|
|
10559
10830
|
|
|
10560
10831
|
var MiniCard = function MiniCard(_ref) {
|
|
@@ -10593,8 +10864,8 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
10593
10864
|
}, title)))));
|
|
10594
10865
|
};
|
|
10595
10866
|
|
|
10596
|
-
var _templateObject$
|
|
10597
|
-
var NavTopContainer$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
10867
|
+
var _templateObject$1h;
|
|
10868
|
+
var NavTopContainer$1 = /*#__PURE__*/styled.div(_templateObject$1h || (_templateObject$1h = /*#__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);
|
|
10598
10869
|
|
|
10599
10870
|
var NavTop = function NavTop(_ref) {
|
|
10600
10871
|
var accountText = _ref.accountText,
|
|
@@ -10634,10 +10905,10 @@ var NavTop = function NavTop(_ref) {
|
|
|
10634
10905
|
}));
|
|
10635
10906
|
};
|
|
10636
10907
|
|
|
10637
|
-
var _templateObject$
|
|
10638
|
-
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
10639
|
-
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$
|
|
10640
|
-
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$
|
|
10908
|
+
var _templateObject$1i, _templateObject2$_, _templateObject3$N, _templateObject4$B, _templateObject5$w;
|
|
10909
|
+
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3 {\n margin: 0px 0px 12px 0px !important;\n }\n\n p {\n font-size: 17px !important;\n }\n"])));
|
|
10910
|
+
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 12px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n\n @media print {\n visibility: hidden;\n }\n"])));
|
|
10911
|
+
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n margin-bottom: 12px;\n p {\n font-size: 17px !important;\n }\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
|
|
10641
10912
|
var isVisible = _ref.isVisible;
|
|
10642
10913
|
return isVisible ? 'visible' : 'hidden';
|
|
10643
10914
|
});
|
|
@@ -10645,14 +10916,14 @@ var IntroTextContainer = /*#__PURE__*/styled.div(_templateObject4$B || (_templat
|
|
|
10645
10916
|
var isVisible = _ref2.isVisible;
|
|
10646
10917
|
return isVisible ? 'visible' : 'hidden';
|
|
10647
10918
|
});
|
|
10648
|
-
var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject5$
|
|
10919
|
+
var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-family: var(--font-family-sans);\n\n & h1 {\n font-family: var(--font-family-sans);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-family: var(--font-family-sans);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em,\n i {\n font-style: italic;\n }\n\n & strong,\n b {\n font-weight: 500;\n letter-spacing: -0.5px;\n }\n\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
|
|
10649
10920
|
|
|
10650
|
-
var _templateObject$
|
|
10651
|
-
var TextLinkWrapper$4 = /*#__PURE__*/styled.a(_templateObject$
|
|
10921
|
+
var _templateObject$1j, _templateObject2$$;
|
|
10922
|
+
var TextLinkWrapper$4 = /*#__PURE__*/styled.a(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid;\n font-family: var(--font-family-sans);\n font-size: 17px;\n line-height: 28px;\n color: var(--color-", ");\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n"])), function (_ref) {
|
|
10652
10923
|
var color = _ref.color;
|
|
10653
10924
|
return color;
|
|
10654
10925
|
});
|
|
10655
|
-
var TextLinkIconWrapper$1 = /*#__PURE__*/styled.span(_templateObject2
|
|
10926
|
+
var TextLinkIconWrapper$1 = /*#__PURE__*/styled.span(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-left: var(--button-icon-margin);\n"])));
|
|
10656
10927
|
|
|
10657
10928
|
var _excluded$r = ["children", "iconName", "iconDirection", "textColor", "disableTruncation"];
|
|
10658
10929
|
var ReadMoreTextLink = function ReadMoreTextLink(_ref) {
|
|
@@ -10757,15 +11028,15 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10757
11028
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText))));
|
|
10758
11029
|
};
|
|
10759
11030
|
|
|
10760
|
-
var _templateObject$
|
|
10761
|
-
var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$
|
|
10762
|
-
var MenuList = /*#__PURE__*/styled.ul(_templateObject2
|
|
10763
|
-
var MobileButton = /*#__PURE__*/styled.button(_templateObject3$
|
|
11031
|
+
var _templateObject$1k, _templateObject2$10, _templateObject3$O, _templateObject4$C, _templateObject5$x;
|
|
11032
|
+
var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
11033
|
+
var MenuList = /*#__PURE__*/styled.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"])), Colors.LightGrey);
|
|
11034
|
+
var MobileButton = /*#__PURE__*/styled.button(_templateObject3$O || (_templateObject3$O = /*#__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"])), Colors.Black, Colors.White, Colors.DarkGrey);
|
|
10764
11035
|
var MenuItem$1 = /*#__PURE__*/styled.a(_templateObject4$C || (_templateObject4$C = /*#__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"])), Colors.Black, function (_ref) {
|
|
10765
11036
|
var isActive = _ref.isActive;
|
|
10766
11037
|
return isActive ? "var(--base-color-" + Colors.MidGrey + ")" : 'none';
|
|
10767
11038
|
}, Colors.MidGrey);
|
|
10768
|
-
var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$
|
|
11039
|
+
var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$x || (_templateObject5$x = /*#__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) {
|
|
10769
11040
|
var isOpen = _ref2.isOpen;
|
|
10770
11041
|
return isOpen ? 'block' : 'none';
|
|
10771
11042
|
}, Colors.White, Colors.DarkGrey, MenuItem$1);
|
|
@@ -10921,15 +11192,15 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
|
|
|
10921
11192
|
});
|
|
10922
11193
|
};
|
|
10923
11194
|
|
|
10924
|
-
var _templateObject$
|
|
10925
|
-
var Container$5 = /*#__PURE__*/styled.div(_templateObject$
|
|
10926
|
-
var Sections = /*#__PURE__*/styled.div(_templateObject2$
|
|
10927
|
-
var Section = /*#__PURE__*/styled.div(_templateObject3$
|
|
11195
|
+
var _templateObject$1l, _templateObject2$11, _templateObject3$P, _templateObject4$D, _templateObject5$y, _templateObject6$o;
|
|
11196
|
+
var Container$5 = /*#__PURE__*/styled.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
11197
|
+
var Sections = /*#__PURE__*/styled.div(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
11198
|
+
var Section = /*#__PURE__*/styled.div(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
10928
11199
|
var color = _ref.color;
|
|
10929
11200
|
return "var(--base-color-" + color + ")";
|
|
10930
11201
|
});
|
|
10931
11202
|
var BottomLine = /*#__PURE__*/styled.div(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
10932
|
-
var Text = /*#__PURE__*/styled.div(_templateObject5$
|
|
11203
|
+
var Text = /*#__PURE__*/styled.div(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
10933
11204
|
var color = _ref2.color;
|
|
10934
11205
|
return "var(--base-color-" + color + ")";
|
|
10935
11206
|
});
|
|
@@ -11015,14 +11286,14 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
11015
11286
|
}, strengthLabel))));
|
|
11016
11287
|
};
|
|
11017
11288
|
|
|
11018
|
-
var _templateObject$
|
|
11019
|
-
var TableContainer = /*#__PURE__*/styled.table(_templateObject$
|
|
11020
|
-
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$
|
|
11021
|
-
var Wrapper$7 = /*#__PURE__*/styled.div(_templateObject3$
|
|
11289
|
+
var _templateObject$1m, _templateObject2$12, _templateObject3$Q, _templateObject4$E, _templateObject5$z, _templateObject6$p, _templateObject7$j, _templateObject8$d;
|
|
11290
|
+
var TableContainer = /*#__PURE__*/styled.table(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
11291
|
+
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
11292
|
+
var Wrapper$7 = /*#__PURE__*/styled.div(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
11022
11293
|
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$E || (_templateObject4$E = /*#__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) {
|
|
11023
11294
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
11024
11295
|
}, devices.tablet, devices.mobile);
|
|
11025
|
-
var TableCell = /*#__PURE__*/styled.td(_templateObject5$
|
|
11296
|
+
var TableCell = /*#__PURE__*/styled.td(_templateObject5$z || (_templateObject5$z = /*#__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) {
|
|
11026
11297
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
11027
11298
|
}, devices.mobile);
|
|
11028
11299
|
var PaginationWrapper = /*#__PURE__*/styled(Pagination)(_templateObject6$p || (_templateObject6$p = /*#__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);
|
|
@@ -11230,18 +11501,18 @@ var Table = function Table(_ref) {
|
|
|
11230
11501
|
}))));
|
|
11231
11502
|
};
|
|
11232
11503
|
|
|
11233
|
-
var _templateObject$
|
|
11234
|
-
var Wrapper$8 = /*#__PURE__*/styled('div')(_templateObject$
|
|
11504
|
+
var _templateObject$1n, _templateObject2$13, _templateObject3$R, _templateObject4$F, _templateObject5$A, _templateObject6$q, _templateObject7$k, _templateObject8$e, _templateObject9$8, _templateObject0$7, _templateObject1$5, _templateObject10$4, _templateObject11$3, _templateObject12$3, _templateObject13$2;
|
|
11505
|
+
var Wrapper$8 = /*#__PURE__*/styled('div')(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
|
|
11235
11506
|
var theme = _ref.theme;
|
|
11236
11507
|
return "var(--color-" + theme + ")";
|
|
11237
11508
|
}, function (_ref2) {
|
|
11238
11509
|
var theme = _ref2.theme;
|
|
11239
11510
|
return "var(--color-" + theme + ")";
|
|
11240
11511
|
});
|
|
11241
|
-
var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
11242
|
-
var SignUpTitleWrapper = /*#__PURE__*/styled('div')(_templateObject3$
|
|
11512
|
+
var SignUpFormWrapper = /*#__PURE__*/styled(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);
|
|
11513
|
+
var SignUpTitleWrapper = /*#__PURE__*/styled('div')(_templateObject3$R || (_templateObject3$R = /*#__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);
|
|
11243
11514
|
var Error = /*#__PURE__*/styled.div(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--color-base-errorstate);\n\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
|
|
11244
|
-
var Form = /*#__PURE__*/styled.form(_templateObject5$
|
|
11515
|
+
var Form = /*#__PURE__*/styled.form(_templateObject5$A || (_templateObject5$A = /*#__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);
|
|
11245
11516
|
var FormFooterWrapper = /*#__PURE__*/styled.div(_templateObject6$q || (_templateObject6$q = /*#__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);
|
|
11246
11517
|
var ServerError = /*#__PURE__*/styled.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
|
|
11247
11518
|
var CTALinkWrapper = /*#__PURE__*/styled.a(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n\n @media ", " {\n text-decoration: underline;\n }\n"])), devices.mobile);
|
|
@@ -11657,13 +11928,13 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
|
|
|
11657
11928
|
}))))));
|
|
11658
11929
|
};
|
|
11659
11930
|
|
|
11660
|
-
var _templateObject$
|
|
11661
|
-
var AnchorBarContainer = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
11931
|
+
var _templateObject$1o, _templateObject2$14, _templateObject4$G, _templateObject5$B;
|
|
11932
|
+
var AnchorBarContainer = /*#__PURE__*/styled(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) {
|
|
11662
11933
|
var withShadow = _ref.withShadow;
|
|
11663
|
-
return withShadow && css(_templateObject2$
|
|
11934
|
+
return withShadow && css(_templateObject2$14 || (_templateObject2$14 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
|
|
11664
11935
|
}, devices.mobile);
|
|
11665
11936
|
var CloseButtonWrapper = /*#__PURE__*/styled.a(_templateObject4$G || (_templateObject4$G = /*#__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);
|
|
11666
|
-
var ContentWrapper$2 = /*#__PURE__*/styled.a(_templateObject5$
|
|
11937
|
+
var ContentWrapper$2 = /*#__PURE__*/styled.a(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
11667
11938
|
|
|
11668
11939
|
var defaultGrid = {
|
|
11669
11940
|
columnStartDesktop: 2,
|
|
@@ -11721,12 +11992,12 @@ var AnchorBar = function AnchorBar(_ref) {
|
|
|
11721
11992
|
return null;
|
|
11722
11993
|
};
|
|
11723
11994
|
|
|
11724
|
-
var _templateObject$
|
|
11725
|
-
var FocusableTab = /*#__PURE__*/styled(Tab)(_templateObject$
|
|
11995
|
+
var _templateObject$1p, _templateObject2$15;
|
|
11996
|
+
var FocusableTab = /*#__PURE__*/styled(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) {
|
|
11726
11997
|
var hide = _ref.hide;
|
|
11727
11998
|
return hide && "display: none;";
|
|
11728
11999
|
}, devices.mobileAndTablet);
|
|
11729
|
-
var HiddenBlock = /*#__PURE__*/styled.div(_templateObject2$
|
|
12000
|
+
var HiddenBlock = /*#__PURE__*/styled.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);
|
|
11730
12001
|
|
|
11731
12002
|
/**
|
|
11732
12003
|
* An accessible component which allows Assistive Technology users to move the focus
|
|
@@ -11818,23 +12089,23 @@ var SkipToMain = function SkipToMain(_ref) {
|
|
|
11818
12089
|
}));
|
|
11819
12090
|
};
|
|
11820
12091
|
|
|
11821
|
-
var _templateObject$
|
|
12092
|
+
var _templateObject$1q, _templateObject2$16, _templateObject3$S, _templateObject4$H, _templateObject5$C, _templateObject6$r, _templateObject7$l;
|
|
11822
12093
|
var color = 'primary-black';
|
|
11823
12094
|
var Button$2 = /*#__PURE__*/styled(SecondaryButton).attrs({
|
|
11824
12095
|
borderColor: color,
|
|
11825
12096
|
hoveredColor: color,
|
|
11826
12097
|
pressedColor: color,
|
|
11827
12098
|
textColor: color
|
|
11828
|
-
})(_templateObject$
|
|
11829
|
-
var Container$7 = /*#__PURE__*/styled.div(_templateObject2$
|
|
11830
|
-
var Description = /*#__PURE__*/styled(BodyContentTextContainer)(_templateObject3$
|
|
12099
|
+
})(_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);
|
|
12100
|
+
var Container$7 = /*#__PURE__*/styled.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);
|
|
12101
|
+
var Description = /*#__PURE__*/styled(BodyContentTextContainer)(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n margin: 27px 0;\n\n @media ", " {\n margin: 20px 0;\n }\n }\n"])), devices.mobile);
|
|
11831
12102
|
var Heading = /*#__PURE__*/styled(HarmonicHeader).attrs({
|
|
11832
12103
|
serif: true,
|
|
11833
12104
|
size: 'medium'
|
|
11834
12105
|
})(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n letter-spacing: -0.5px;\n margin-bottom: 27px;\n\n @media ", " {\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
11835
12106
|
var Intro = /*#__PURE__*/styled(HarmonicSubtitle).attrs({
|
|
11836
12107
|
size: 'large'
|
|
11837
|
-
})(_templateObject5$
|
|
12108
|
+
})(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-bottom: 27px;\n\n @media ", " {\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
11838
12109
|
var SignInLink = /*#__PURE__*/styled.a(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--primary-black);\n cursor: pointer;\n text-decoration: underline;\n text-decoration-skip: none;\n"])));
|
|
11839
12110
|
var SignInPrompt = /*#__PURE__*/styled(BodyCopyHarmonic).attrs({
|
|
11840
12111
|
size: 'large'
|
|
@@ -11865,8 +12136,8 @@ var Paywall = function Paywall(_ref) {
|
|
|
11865
12136
|
}, "Sign in"))));
|
|
11866
12137
|
};
|
|
11867
12138
|
|
|
11868
|
-
var _templateObject$
|
|
11869
|
-
var Wrapper$9 = /*#__PURE__*/styled.div(_templateObject$
|
|
12139
|
+
var _templateObject$1r;
|
|
12140
|
+
var Wrapper$9 = /*#__PURE__*/styled.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);
|
|
11870
12141
|
|
|
11871
12142
|
var UpsellCards = function UpsellCards(_ref) {
|
|
11872
12143
|
var upsellCards = _ref.upsellCards,
|
|
@@ -12057,12 +12328,12 @@ var Navigation = function Navigation(_ref) {
|
|
|
12057
12328
|
})))))));
|
|
12058
12329
|
};
|
|
12059
12330
|
|
|
12060
|
-
var _templateObject$
|
|
12061
|
-
var FooterSection = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
12062
|
-
var PolicyLinksSection = /*#__PURE__*/styled(GridItem)(_templateObject2$
|
|
12063
|
-
var SocialAndNewsletterSection = /*#__PURE__*/styled(GridItem)(_templateObject3$
|
|
12331
|
+
var _templateObject$1s, _templateObject2$17, _templateObject3$T, _templateObject4$I, _templateObject5$D, _templateObject6$s, _templateObject7$m;
|
|
12332
|
+
var FooterSection = /*#__PURE__*/styled(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);
|
|
12333
|
+
var PolicyLinksSection = /*#__PURE__*/styled(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);
|
|
12334
|
+
var SocialAndNewsletterSection = /*#__PURE__*/styled(GridItem)(_templateObject3$T || (_templateObject3$T = /*#__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);
|
|
12064
12335
|
var SectionWrapper = /*#__PURE__*/styled.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 20px;\n\n @media ", " {\n gap: 24px;\n }\n"])), devices.mobile);
|
|
12065
|
-
var LogoAndDescriptionSection = /*#__PURE__*/styled(GridItem)(_templateObject5$
|
|
12336
|
+
var LogoAndDescriptionSection = /*#__PURE__*/styled(GridItem)(_templateObject5$D || (_templateObject5$D = /*#__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);
|
|
12066
12337
|
var SponsorLogoContainer = /*#__PURE__*/styled.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 290px;\n\n @media ", " {\n max-width: unset;\n }\n"])), devices.mobile);
|
|
12067
12338
|
var TextLinkWrapper$5 = /*#__PURE__*/styled(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"])));
|
|
12068
12339
|
|
|
@@ -12122,18 +12393,18 @@ var Footer = function Footer(_ref) {
|
|
|
12122
12393
|
}, additionalInfo))));
|
|
12123
12394
|
};
|
|
12124
12395
|
|
|
12125
|
-
var _templateObject$
|
|
12396
|
+
var _templateObject$1t, _templateObject2$18, _templateObject3$U, _templateObject4$J, _templateObject5$E, _templateObject8$f, _templateObject9$9, _templateObject0$8;
|
|
12126
12397
|
var LIST_ITEM_GAP = 32;
|
|
12127
|
-
var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
12398
|
+
var AnchorTabbarWrapper = /*#__PURE__*/styled.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) {
|
|
12128
12399
|
var bottomBorder = _ref.bottomBorder;
|
|
12129
12400
|
return bottomBorder ? '1px solid var(--color-base-light-grey)' : 'none';
|
|
12130
12401
|
}, zIndexes.anchor, function (_ref2) {
|
|
12131
12402
|
var withShadow = _ref2.withShadow;
|
|
12132
|
-
return withShadow && css(_templateObject2$
|
|
12403
|
+
return withShadow && css(_templateObject2$18 || (_templateObject2$18 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
|
|
12133
12404
|
});
|
|
12134
|
-
var TabsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$
|
|
12405
|
+
var TabsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
|
|
12135
12406
|
var TabsWrapper = /*#__PURE__*/styled.div(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
12136
|
-
var TabsList = /*#__PURE__*/styled.ul(_templateObject5$
|
|
12407
|
+
var TabsList = /*#__PURE__*/styled.ul(_templateObject5$E || (_templateObject5$E = /*#__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) {
|
|
12137
12408
|
var tabsOverflow = _ref3.tabsOverflow;
|
|
12138
12409
|
return tabsOverflow ? 'calc(100% - 74px)' : '100%';
|
|
12139
12410
|
}, LIST_ITEM_GAP, function (_ref4) {
|
|
@@ -12403,13 +12674,13 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
12403
12674
|
})))) : null))));
|
|
12404
12675
|
};
|
|
12405
12676
|
|
|
12406
|
-
var _templateObject$
|
|
12407
|
-
var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
12677
|
+
var _templateObject$1u, _templateObject2$19, _templateObject3$V, _templateObject4$K, _templateObject6$t, _templateObject7$n, _templateObject8$g, _templateObject9$a, _templateObject0$9;
|
|
12678
|
+
var TitleCTAGridWrapper = /*#__PURE__*/styled.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) {
|
|
12408
12679
|
var sticky = _ref.sticky;
|
|
12409
12680
|
return sticky ? 'sticky' : 'initial';
|
|
12410
12681
|
}, zIndexes.anchor);
|
|
12411
|
-
var TitleCTAGrid = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
12412
|
-
var TitleCTAGridItem = /*#__PURE__*/styled.div(_templateObject3$
|
|
12682
|
+
var TitleCTAGrid = /*#__PURE__*/styled(Grid)(_templateObject2$19 || (_templateObject2$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: solid 2px var(--base-color-light-grey);\n"])));
|
|
12683
|
+
var TitleCTAGridItem = /*#__PURE__*/styled.div(_templateObject3$V || (_templateObject3$V = /*#__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) {
|
|
12413
12684
|
var title = _ref2.title;
|
|
12414
12685
|
return title ? 'row' : 'row-reverse';
|
|
12415
12686
|
}, devices.tablet, devices.mobile);
|
|
@@ -12463,10 +12734,10 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
|
12463
12734
|
}, message))));
|
|
12464
12735
|
};
|
|
12465
12736
|
|
|
12466
|
-
var _templateObject$
|
|
12467
|
-
var UpsellBorderBox = /*#__PURE__*/styled.div(_templateObject$
|
|
12468
|
-
var TitleContent = /*#__PURE__*/styled(HarmonicHeader)(_templateObject2$
|
|
12469
|
-
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject3$
|
|
12737
|
+
var _templateObject$1v, _templateObject2$1a, _templateObject3$W, _templateObject4$L;
|
|
12738
|
+
var UpsellBorderBox = /*#__PURE__*/styled.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);
|
|
12739
|
+
var TitleContent = /*#__PURE__*/styled(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);
|
|
12740
|
+
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject3$W || (_templateObject3$W = /*#__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);
|
|
12470
12741
|
var TextContent = /*#__PURE__*/styled(BodyContent)(_templateObject4$L || (_templateObject4$L = /*#__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);
|
|
12471
12742
|
|
|
12472
12743
|
var UpsellSection = function UpsellSection(_ref) {
|
|
@@ -12512,9 +12783,9 @@ var UpsellSection = function UpsellSection(_ref) {
|
|
|
12512
12783
|
})))));
|
|
12513
12784
|
};
|
|
12514
12785
|
|
|
12515
|
-
var _templateObject$
|
|
12516
|
-
var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
12517
|
-
var StickyBarGrid = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
12786
|
+
var _templateObject$1w, _templateObject2$1b;
|
|
12787
|
+
var StickyBarWrapper = /*#__PURE__*/styled.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);
|
|
12788
|
+
var StickyBarGrid = /*#__PURE__*/styled(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) {
|
|
12518
12789
|
var bottomBorder = _ref.bottomBorder;
|
|
12519
12790
|
return bottomBorder && 'border-bottom: 1px solid var(--color-base-light-grey);';
|
|
12520
12791
|
}, devices.mobileAndTablet, devices.mobile);
|
|
@@ -12545,10 +12816,10 @@ var StickyBar = function StickyBar(_ref) {
|
|
|
12545
12816
|
}, children)));
|
|
12546
12817
|
};
|
|
12547
12818
|
|
|
12548
|
-
var _templateObject$
|
|
12549
|
-
var InnerModal = /*#__PURE__*/styled.div(_templateObject$
|
|
12550
|
-
var CloseButton = /*#__PURE__*/styled.button(_templateObject2$
|
|
12551
|
-
var ContentWrapper$3 = /*#__PURE__*/styled.div(_templateObject3$
|
|
12819
|
+
var _templateObject$1x, _templateObject2$1c, _templateObject3$X, _templateObject4$M;
|
|
12820
|
+
var InnerModal = /*#__PURE__*/styled.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);
|
|
12821
|
+
var CloseButton = /*#__PURE__*/styled.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);
|
|
12822
|
+
var ContentWrapper$3 = /*#__PURE__*/styled.div(_templateObject3$X || (_templateObject3$X = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
12552
12823
|
var Overlay = /*#__PURE__*/styled(Grid)(_templateObject4$M || (_templateObject4$M = /*#__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"])));
|
|
12553
12824
|
|
|
12554
12825
|
var _excluded$u = ["isOpen", "setIsOpen", "children", "appElementId", "closeButtonAriaLabel"];
|
|
@@ -12756,22 +13027,22 @@ var getCardSlideMobileStyles = function getCardSlideMobileStyles(type) {
|
|
|
12756
13027
|
return "\n width: " + ("calc((" + columnsPerSlide + " * " + gridColumnWidth + ") + (" + gapsPerSlide + " * " + GRID_COLUMN_GAP + "))") + ";\n margin-right: " + ("calc(" + gridColumnWidth + " + (" + GRID_COLUMN_GAP + " * 2))") + ";\n ";
|
|
12757
13028
|
};
|
|
12758
13029
|
|
|
12759
|
-
var _templateObject$
|
|
12760
|
-
var ImageCarouselWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
13030
|
+
var _templateObject$1y, _templateObject2$1d, _templateObject3$Y, _templateObject4$N, _templateObject5$F, _templateObject6$u, _templateObject7$o, _templateObject8$h, _templateObject9$b;
|
|
13031
|
+
var ImageCarouselWrapper = /*#__PURE__*/styled.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) {
|
|
12761
13032
|
var imagesHeightDesktop = _ref.imagesHeightDesktop;
|
|
12762
13033
|
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 }";
|
|
12763
13034
|
}, devices.mobile, function (_ref2) {
|
|
12764
13035
|
var imagesHeightDevice = _ref2.imagesHeightDevice;
|
|
12765
13036
|
return "&&& {\n .swipe-slide > figure {\n > div {\n height: " + imagesHeightDevice + "px;\n }\n }\n }";
|
|
12766
13037
|
});
|
|
12767
|
-
var CardsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
13038
|
+
var CardsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject2$1d || (_templateObject2$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n}"])), function (_ref3) {
|
|
12768
13039
|
var type = _ref3.type,
|
|
12769
13040
|
isActive = _ref3.isActive;
|
|
12770
13041
|
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 ";
|
|
12771
13042
|
});
|
|
12772
|
-
var TitleButtonsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$
|
|
13043
|
+
var TitleButtonsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$Y || (_templateObject3$Y = /*#__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);
|
|
12773
13044
|
var CarouselInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$N || (_templateObject4$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n user-select: text;\n"])));
|
|
12774
|
-
var TitleWrapper$5 = /*#__PURE__*/styled.div(_templateObject5$
|
|
13045
|
+
var TitleWrapper$5 = /*#__PURE__*/styled.div(_templateObject5$F || (_templateObject5$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref4) {
|
|
12775
13046
|
var isDescriptionPresent = _ref4.isDescriptionPresent;
|
|
12776
13047
|
return isDescriptionPresent && 'margin: 20px 0';
|
|
12777
13048
|
});
|
|
@@ -13048,17 +13319,17 @@ var Carousel = function Carousel(_ref) {
|
|
|
13048
13319
|
}, children))));
|
|
13049
13320
|
};
|
|
13050
13321
|
|
|
13051
|
-
var _templateObject$
|
|
13052
|
-
var HighlightsGrid$1 = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
13053
|
-
var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
13054
|
-
var HeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
13322
|
+
var _templateObject$1z, _templateObject2$1e, _templateObject3$Z, _templateObject4$O, _templateObject5$G, _templateObject6$v, _templateObject7$p, _templateObject8$i, _templateObject9$c, _templateObject0$a, _templateObject1$6, _templateObject10$5, _templateObject11$4, _templateObject12$4, _templateObject13$3, _templateObject14$1, _templateObject15$1, _templateObject16$1;
|
|
13323
|
+
var HighlightsGrid$1 = /*#__PURE__*/styled(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);
|
|
13324
|
+
var CarouselTitleWrapper = /*#__PURE__*/styled.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);
|
|
13325
|
+
var HeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$Z || (_templateObject3$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
|
|
13055
13326
|
var InfoWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$O || (_templateObject4$O = /*#__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);
|
|
13056
|
-
var InfoLogoWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
13327
|
+
var InfoLogoWrapper = /*#__PURE__*/styled.div(_templateObject5$G || (_templateObject5$G = /*#__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);
|
|
13057
13328
|
var InfoTitleWrapper = /*#__PURE__*/styled.div(_templateObject6$v || (_templateObject6$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n\n h1,\n h2,\n h3 {\n margin-bottom: 8px;\n }\n"])));
|
|
13058
13329
|
var InfoTextWrapper = /*#__PURE__*/styled.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);
|
|
13059
13330
|
var InfoLinkWrapper = /*#__PURE__*/styled.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);
|
|
13060
13331
|
var CarouselWrapper = /*#__PURE__*/styled.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);
|
|
13061
|
-
var RotatorButtonsWrapper$
|
|
13332
|
+
var RotatorButtonsWrapper$3 = /*#__PURE__*/styled.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);
|
|
13062
13333
|
var RotatorButtonsWrapperMobile$1 = /*#__PURE__*/styled.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);
|
|
13063
13334
|
var HtmlBodyText = /*#__PURE__*/styled.p(_templateObject10$5 || (_templateObject10$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n"])));
|
|
13064
13335
|
var FirstButtonComponentWrapper = /*#__PURE__*/styled.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);
|
|
@@ -13308,7 +13579,7 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
|
|
|
13308
13579
|
auxiliaryCTA: auxiliaryCTA
|
|
13309
13580
|
})), /*#__PURE__*/React__default.createElement(CarouselWrapper, {
|
|
13310
13581
|
"data-testid": "carousel-wrapper"
|
|
13311
|
-
}, hasMultipleSlides && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$
|
|
13582
|
+
}, hasMultipleSlides && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper$3, {
|
|
13312
13583
|
"data-testid": "rotator-buttons"
|
|
13313
13584
|
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
13314
13585
|
onClickNext: onNext,
|
|
@@ -13384,9 +13655,9 @@ var HighlightsStream = function HighlightsStream(_ref) {
|
|
|
13384
13655
|
})));
|
|
13385
13656
|
};
|
|
13386
13657
|
|
|
13387
|
-
var _templateObject$
|
|
13388
|
-
var CarouselWrapper$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
13389
|
-
var ButtonsWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
13658
|
+
var _templateObject$1A, _templateObject3$_;
|
|
13659
|
+
var CarouselWrapper$1 = /*#__PURE__*/styled.div(_templateObject$1A || (_templateObject$1A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n\n .swipe-slide {\n width: 100%;\n }\n"])));
|
|
13660
|
+
var ButtonsWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$_ || (_templateObject3$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
|
|
13390
13661
|
|
|
13391
13662
|
var MinimalCarousel = function MinimalCarousel(_ref) {
|
|
13392
13663
|
var children = _ref.children;
|
|
@@ -13981,8 +14252,8 @@ var Theme = function Theme(_ref) {
|
|
|
13981
14252
|
}, children);
|
|
13982
14253
|
};
|
|
13983
14254
|
|
|
13984
|
-
var _templateObject$
|
|
13985
|
-
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1A || (_templateObject$1A = /*#__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) {
|
|
14255
|
+
var _templateObject$1B;
|
|
14256
|
+
var GlobalStyles = /*#__PURE__*/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) {
|
|
13986
14257
|
var theme = _ref.theme;
|
|
13987
14258
|
return theme.colors.primary;
|
|
13988
14259
|
}, function (_ref2) {
|
|
@@ -14929,5 +15200,5 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1A || (_templa
|
|
|
14929
15200
|
return theme.footer.tablet.paddingBottom;
|
|
14930
15201
|
}, devices.desktop, devices.largeDesktop);
|
|
14931
15202
|
|
|
14932
|
-
export { Accordion, Accordions, Account, AltHeader, AnchorBar, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, Basket$1 as Basket, BodyContent, BodyCopyHarmonic, BodyText, ButtonText, ButtonType, Caption, Card, Cards, Carousel, CarouselType, CastFilters as CastFilter, CinemaBadge, Colors, ContactCard, ContactNewsletter, ContentSummary, ControlledDropdown, CreditListing, CustomStrategyTabsFilter, DisplayHeader, Dropdown, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicHeader, HarmonicOverline, HarmonicSize, HarmonicSubtitle, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, Logo, MiniCard, MinimalCarousel, ModalWindow, NavTop, Navigation, NavigationText, Overline, PageHeading, PageHeadingCompact, PageHeadingHighlight, PageHeadingHighlightCarousel, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, Pagination, PasswordStrength, Paywall, PeopleListing, Person, PersonCard, PersonDetails, PolicyLinks, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio2, RadioGroup2, ReadMore, RotatorButtons, Search$1 as Search, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, SocialLinks, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Swipe, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellCards, UpsellSection, VideoControls, VideoWithControls$2 as VideoWithControls, breakpoints, devices, useHarmonicTheme, zIndexes };
|
|
15203
|
+
export { Accordion, Accordions, Account, AltHeader, AnchorBar, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, Basket$1 as Basket, BodyContent, BodyCopyHarmonic, BodyText, ButtonText, ButtonType, Caption, Card, Cards, Carousel, CarouselType, CastFilters as CastFilter, CastFiltersVariant as CastFilterVariant, CinemaBadge, Colors, ContactCard, ContactNewsletter, ContentSummary, ControlledDropdown, CreditListing, CustomStrategyTabsFilter, DisplayHeader, Dropdown, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicHeader, HarmonicOverline, HarmonicSize, HarmonicSubtitle, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, Logo, MiniCard, MinimalCarousel, ModalWindow, NavTop, Navigation, NavigationText, Overline, PageHeading, PageHeadingCompact, PageHeadingHighlight, PageHeadingHighlightCarousel, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, Pagination, PasswordStrength, Paywall, PeopleListing, Person, PersonCard, PersonDetails, PolicyLinks, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio2, RadioGroup2, ReadMore, RotatorButtons, Search$1 as Search, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, SocialLinks, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Swipe, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellCards, UpsellSection, VideoControls, VideoWithControls$2 as VideoWithControls, breakpoints, devices, useHarmonicTheme, zIndexes };
|
|
14933
15204
|
//# sourceMappingURL=harmonic.esm.js.map
|