@royaloperahouse/harmonic 1.0.7 → 1.0.8-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 +19 -3
- package/README.md +267 -43
- package/dist/components/atoms/Dropdown/Dropdown.d.ts +1 -1
- package/dist/components/atoms/Tab/Tab.d.ts +1 -1
- package/dist/components/molecules/Accordion/Accordion.style.d.ts +3 -1
- package/dist/components/molecules/CustomStrategyTabsFilter/CustomStrategyTabsFilter.d.ts +31 -27
- package/dist/components/molecules/PeopleListing/CreditListing/CreditListing.d.ts +1 -1
- package/dist/components/molecules/PeopleListing/CreditListing/CreditListing.style.d.ts +0 -1
- package/dist/components/molecules/ReadMore/ReadMoreTextLink.d.ts +4 -0
- package/dist/components/molecules/ReadMore/ReadMoreTextLink.style.d.ts +3 -0
- package/dist/components/molecules/SkipToMain/SkipToMain.style.d.ts +1 -1
- package/dist/harmonic.cjs.development.css +319 -0
- package/dist/harmonic.cjs.development.js +287 -200
- 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 +298 -209
- package/dist/harmonic.esm.js.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/styles/HarmonicThemeProvider/HarmonicThemeProvider.d.ts +1 -0
- package/dist/types/creditListing.d.ts +7 -6
- package/dist/types/types.d.ts +29 -6
- package/package.json +1 -1
- package/README.GIT +0 -293
package/dist/harmonic.esm.js
CHANGED
|
@@ -228,6 +228,26 @@ styleInject(css_248z);
|
|
|
228
228
|
var _excluded = ["children", "size", "em", "color", "serif", "hierarchy", "tag", "className"],
|
|
229
229
|
_excluded2 = ["children", "size", "color", "className", "bold", "tag"],
|
|
230
230
|
_excluded3 = ["children", "size", "color", "className"];
|
|
231
|
+
/* ~~~ Display - (use case) ~~~ */
|
|
232
|
+
var DisplayHeader = function DisplayHeader(_ref) {
|
|
233
|
+
var children = _ref.children,
|
|
234
|
+
size = _ref.size,
|
|
235
|
+
em = _ref.em,
|
|
236
|
+
_ref$color = _ref.color,
|
|
237
|
+
color = _ref$color === void 0 ? 'inherit' : _ref$color,
|
|
238
|
+
serif = _ref.serif,
|
|
239
|
+
className = _ref.className;
|
|
240
|
+
var classNames = createClassNames('display', {
|
|
241
|
+
size: size,
|
|
242
|
+
color: color,
|
|
243
|
+
serif: serif,
|
|
244
|
+
em: em,
|
|
245
|
+
className: className
|
|
246
|
+
}, typographyStyles);
|
|
247
|
+
return /*#__PURE__*/React__default.createElement("h1", {
|
|
248
|
+
className: classNames
|
|
249
|
+
}, children);
|
|
250
|
+
};
|
|
231
251
|
/* ~~~ Headers - size and hierarchy set separately ~~~ */
|
|
232
252
|
var HarmonicHeader = function HarmonicHeader(_ref2) {
|
|
233
253
|
var _ref3;
|
|
@@ -2715,6 +2735,7 @@ var Tab = function Tab(_ref) {
|
|
|
2715
2735
|
className = _ref.className,
|
|
2716
2736
|
role = _ref.role,
|
|
2717
2737
|
ariaLabel = _ref.ariaLabel,
|
|
2738
|
+
tabLinkId = _ref.tabLinkId,
|
|
2718
2739
|
color = _ref.color,
|
|
2719
2740
|
dataTestId = _ref.dataTestId,
|
|
2720
2741
|
isOpen = _ref.isOpen;
|
|
@@ -2749,8 +2770,9 @@ var Tab = function Tab(_ref) {
|
|
|
2749
2770
|
className: className,
|
|
2750
2771
|
"data-testid": dataTestId
|
|
2751
2772
|
}, /*#__PURE__*/React__default.createElement(TabText, {
|
|
2752
|
-
|
|
2773
|
+
id: tabLinkId,
|
|
2753
2774
|
trimText: trimText,
|
|
2775
|
+
color: color,
|
|
2754
2776
|
withTextInMobile: withTextInMobile,
|
|
2755
2777
|
"aria-hidden": "true"
|
|
2756
2778
|
}, title), withIcon !== 'none' && /*#__PURE__*/React__default.createElement(Icon, {
|
|
@@ -2780,6 +2802,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
2780
2802
|
className = _ref.className,
|
|
2781
2803
|
role = _ref.role,
|
|
2782
2804
|
ariaLabel = _ref.ariaLabel,
|
|
2805
|
+
tabLinkId = _ref.tabLinkId,
|
|
2783
2806
|
trimTabText = _ref.trimTabText;
|
|
2784
2807
|
var node = useRef();
|
|
2785
2808
|
var _useState = useState(false),
|
|
@@ -2876,6 +2899,7 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
2876
2899
|
};
|
|
2877
2900
|
var renderTab = function renderTab() {
|
|
2878
2901
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Tab, {
|
|
2902
|
+
tabLinkId: tabLinkId,
|
|
2879
2903
|
trimText: trimTabText,
|
|
2880
2904
|
title: title,
|
|
2881
2905
|
titleLink: titleLink,
|
|
@@ -2955,7 +2979,8 @@ var Account = function Account(_ref) {
|
|
|
2955
2979
|
iconName: iconName,
|
|
2956
2980
|
withOptionsInMobile: false,
|
|
2957
2981
|
withIcon: "left",
|
|
2958
|
-
className: className
|
|
2982
|
+
className: className,
|
|
2983
|
+
tabLinkId: "account-link"
|
|
2959
2984
|
});
|
|
2960
2985
|
};
|
|
2961
2986
|
|
|
@@ -5518,22 +5543,28 @@ var NavTopContainer = /*#__PURE__*/styled.div(_templateObject12 || (_templateObj
|
|
|
5518
5543
|
var NavTopContainerMobile = /*#__PURE__*/styled.div(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n display: flex;\n width: fit-content;\n align-items: center;\n height: 10%;\n margin-left: 20px;\n padding-bottom: 36px;\n }\n"])), devices.mobileAndTablet);
|
|
5519
5544
|
|
|
5520
5545
|
var _templateObject$B, _templateObject2$q, _templateObject3$f, _templateObject4$e, _templateObject5$a, _templateObject6$6, _templateObject7$4;
|
|
5521
|
-
var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n border-top:
|
|
5522
|
-
var
|
|
5523
|
-
return
|
|
5546
|
+
var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n border-top: ", ";\n border-bottom: ", ";\n"])), function (_ref) {
|
|
5547
|
+
var showTopLine = _ref.showTopLine;
|
|
5548
|
+
return showTopLine ? '2px solid var(--color-base-light-grey)' : 'none';
|
|
5549
|
+
}, function (_ref2) {
|
|
5550
|
+
var showBottomLine = _ref2.showBottomLine;
|
|
5551
|
+
return showBottomLine ? '2px solid var(--color-base-light-grey)' : 'none';
|
|
5524
5552
|
});
|
|
5525
|
-
var ChildrenContainer = /*#__PURE__*/styled.div(_templateObject2$q || (_templateObject2$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n opacity: ", ";\n transition: opacity 0.2s ease;\n pointer-events: ", ";\n\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n \n @media print { \n visibility: visible;\n }\n}\n"])), function (
|
|
5526
|
-
var isVisible = _ref2.isVisible;
|
|
5527
|
-
return isVisible ? 1 : 0;
|
|
5528
|
-
}, function (_ref3) {
|
|
5553
|
+
var ChildrenContainer = /*#__PURE__*/styled.div(_templateObject2$q || (_templateObject2$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n opacity: ", ";\n transition: opacity 0.2s ease;\n pointer-events: ", ";\n\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n \n @media print { \n visibility: visible;\n }\n}\n"])), function (_ref3) {
|
|
5529
5554
|
var isVisible = _ref3.isVisible;
|
|
5555
|
+
return isVisible ? 1 : 0;
|
|
5556
|
+
}, function (_ref4) {
|
|
5557
|
+
var isVisible = _ref4.isVisible;
|
|
5530
5558
|
return isVisible ? 'auto' : 'none';
|
|
5531
5559
|
}, devices.mobile);
|
|
5532
|
-
var TitleContainer$1 = /*#__PURE__*/styled.div(_templateObject3$f || (_templateObject3$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n padding-top: 28px;\n padding-bottom: 28px;\n color: var(--color-primary-black);\n\n && svg {\n width: 24px;\n height: 24px;\n }\n\n :hover {\n cursor: ", ";\n pointer-events: ", ";\n }\n\n @media ", " {\n padding-top: 16px;\n padding-bottom: 16px;\n }\n"])), function (
|
|
5533
|
-
var
|
|
5560
|
+
var TitleContainer$1 = /*#__PURE__*/styled.div(_templateObject3$f || (_templateObject3$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n padding-top: 28px;\n padding-bottom: 28px;\n color: var(--color-primary-black);\n margin: ", ";\n\n && svg {\n width: 24px;\n height: 24px;\n }\n\n :hover {\n cursor: ", ";\n pointer-events: ", ";\n }\n\n @media ", " {\n padding-top: 16px;\n padding-bottom: 16px;\n margin: 0;\n }\n"])), function (_ref5) {
|
|
5561
|
+
var titleMargin = _ref5.titleMargin;
|
|
5562
|
+
return titleMargin || '0';
|
|
5563
|
+
}, function (_ref6) {
|
|
5564
|
+
var hasChildren = _ref6.hasChildren;
|
|
5534
5565
|
return hasChildren ? 'pointer' : 'default';
|
|
5535
|
-
}, function (
|
|
5536
|
-
var hasChildren =
|
|
5566
|
+
}, function (_ref7) {
|
|
5567
|
+
var hasChildren = _ref7.hasChildren;
|
|
5537
5568
|
return hasChildren ? 'auto' : 'none';
|
|
5538
5569
|
}, devices.mobile);
|
|
5539
5570
|
var TitleText = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: calc(100% - 32px);\n"])));
|
|
@@ -5542,14 +5573,14 @@ var ContentContainer = /*#__PURE__*/styled(ExtendedBodyCopyHarmonic).withConfig(
|
|
|
5542
5573
|
shouldForwardProp: function shouldForwardProp(prop) {
|
|
5543
5574
|
return prop !== 'textHeight';
|
|
5544
5575
|
}
|
|
5545
|
-
})(_templateObject6$6 || (_templateObject6$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-height: ", ";\n overflow: ", ";\n margin-bottom: ", ";\n\n @media print {\n max-height: max-content;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), function (
|
|
5546
|
-
var textHeight =
|
|
5576
|
+
})(_templateObject6$6 || (_templateObject6$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-height: ", ";\n overflow: ", ";\n margin-bottom: ", ";\n\n @media print {\n max-height: max-content;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), function (_ref8) {
|
|
5577
|
+
var textHeight = _ref8.textHeight;
|
|
5547
5578
|
return textHeight;
|
|
5548
|
-
}, function (
|
|
5549
|
-
var textHeight =
|
|
5579
|
+
}, function (_ref9) {
|
|
5580
|
+
var textHeight = _ref9.textHeight;
|
|
5550
5581
|
return textHeight === '0px' ? 'hidden' : 'visible';
|
|
5551
|
-
}, function (
|
|
5552
|
-
var textHeight =
|
|
5582
|
+
}, function (_ref0) {
|
|
5583
|
+
var textHeight = _ref0.textHeight;
|
|
5553
5584
|
return textHeight === '0px' ? '0px' : '12px';
|
|
5554
5585
|
}, devices.mobile);
|
|
5555
5586
|
var PrintHideWrapper = /*#__PURE__*/styled.div(_templateObject7$4 || (_templateObject7$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media print {\n display: none;\n }\n"])));
|
|
@@ -5571,14 +5602,19 @@ var Accordion = function Accordion(_ref) {
|
|
|
5571
5602
|
var _expandedStateIcon$ic, _collapsedStateIcon$i;
|
|
5572
5603
|
var _ref$title = _ref.title,
|
|
5573
5604
|
title = _ref$title === void 0 ? '' : _ref$title,
|
|
5574
|
-
_ref$
|
|
5575
|
-
|
|
5605
|
+
_ref$showTopLine = _ref.showTopLine,
|
|
5606
|
+
showTopLine = _ref$showTopLine === void 0 ? true : _ref$showTopLine,
|
|
5607
|
+
_ref$showBottomLine = _ref.showBottomLine,
|
|
5608
|
+
showBottomLine = _ref$showBottomLine === void 0 ? true : _ref$showBottomLine,
|
|
5576
5609
|
children = _ref.children,
|
|
5610
|
+
visibleStandfirst = _ref.visibleStandfirst,
|
|
5577
5611
|
_ref$initOpen = _ref.initOpen,
|
|
5578
5612
|
initOpen = _ref$initOpen === void 0 ? false : _ref$initOpen,
|
|
5579
5613
|
className = _ref.className,
|
|
5580
5614
|
expandedStateIcon = _ref.expandedStateIcon,
|
|
5581
|
-
collapsedStateIcon = _ref.collapsedStateIcon
|
|
5615
|
+
collapsedStateIcon = _ref.collapsedStateIcon,
|
|
5616
|
+
childrenContainerStyle = _ref.childrenContainerStyle,
|
|
5617
|
+
titleMargin = _ref.titleMargin;
|
|
5582
5618
|
var _useState = useState(initOpen),
|
|
5583
5619
|
openAccordion = _useState[0],
|
|
5584
5620
|
setOpenAccordion = _useState[1];
|
|
@@ -5689,6 +5725,7 @@ var Accordion = function Accordion(_ref) {
|
|
|
5689
5725
|
var toggleAccordion = function toggleAccordion() {
|
|
5690
5726
|
if (React__default.Children.count(children) === 0) return;
|
|
5691
5727
|
if (openAccordion) {
|
|
5728
|
+
setIcon(collapsedStateIconData);
|
|
5692
5729
|
setOpenAccordion(false);
|
|
5693
5730
|
setTextHeight('0px');
|
|
5694
5731
|
setIcon(collapsedStateIconData);
|
|
@@ -5711,9 +5748,16 @@ var Accordion = function Accordion(_ref) {
|
|
|
5711
5748
|
toggleAccordion();
|
|
5712
5749
|
}
|
|
5713
5750
|
};
|
|
5751
|
+
var Standfirst = function Standfirst() {
|
|
5752
|
+
return visibleStandfirst ? (/*#__PURE__*/React__default.createElement(ContentContainer, null, /*#__PURE__*/React__default.createElement(ChildrenContainer, {
|
|
5753
|
+
style: childrenContainerStyle,
|
|
5754
|
+
isVisible: true
|
|
5755
|
+
}, visibleStandfirst))) : null;
|
|
5756
|
+
};
|
|
5714
5757
|
var contentContainerId = title + "-accordion-content";
|
|
5715
5758
|
return /*#__PURE__*/React__default.createElement(AccordionContainer, {
|
|
5716
|
-
|
|
5759
|
+
showTopLine: showTopLine,
|
|
5760
|
+
showBottomLine: showBottomLine,
|
|
5717
5761
|
className: className
|
|
5718
5762
|
}, /*#__PURE__*/React__default.createElement(TitleContainer$1, {
|
|
5719
5763
|
onClick: toggleAccordion,
|
|
@@ -5723,8 +5767,9 @@ var Accordion = function Accordion(_ref) {
|
|
|
5723
5767
|
"aria-label": title,
|
|
5724
5768
|
"aria-expanded": openAccordion,
|
|
5725
5769
|
"aria-controls": contentContainerId,
|
|
5726
|
-
hasChildren: !!children
|
|
5727
|
-
|
|
5770
|
+
hasChildren: !!children,
|
|
5771
|
+
titleMargin: titleMargin
|
|
5772
|
+
}, /*#__PURE__*/React__default.createElement(TitleText, null, title), children && (/*#__PURE__*/React__default.createElement(PrintHideWrapper, null, /*#__PURE__*/React__default.createElement(Icon, Object.assign({}, icon))))), visibleStandfirst && /*#__PURE__*/React__default.createElement(Standfirst, null), /*#__PURE__*/React__default.createElement(ContentContainer, {
|
|
5728
5773
|
"data-testid": "richcontainer",
|
|
5729
5774
|
ref: content,
|
|
5730
5775
|
textHeight: textHeight,
|
|
@@ -5732,9 +5777,10 @@ var Accordion = function Accordion(_ref) {
|
|
|
5732
5777
|
"aria-live": openAccordion ? 'polite' : 'off',
|
|
5733
5778
|
tag: "div",
|
|
5734
5779
|
size: "large"
|
|
5735
|
-
}, childrenVisibility && /*#__PURE__*/React__default.createElement(ChildrenContainer, {
|
|
5736
|
-
isVisible: childrenVisibility
|
|
5737
|
-
|
|
5780
|
+
}, childrenVisibility && (/*#__PURE__*/React__default.createElement(ChildrenContainer, {
|
|
5781
|
+
isVisible: childrenVisibility,
|
|
5782
|
+
style: childrenContainerStyle
|
|
5783
|
+
}, children))));
|
|
5738
5784
|
};
|
|
5739
5785
|
|
|
5740
5786
|
var _templateObject$C;
|
|
@@ -5753,9 +5799,12 @@ var Accordions = function Accordions(_ref) {
|
|
|
5753
5799
|
return /*#__PURE__*/React__default.createElement(Accordion, {
|
|
5754
5800
|
key: accordion.title + "-" + index,
|
|
5755
5801
|
title: accordion.title,
|
|
5756
|
-
|
|
5802
|
+
showBottomLine: isLastAccordion(index),
|
|
5757
5803
|
expandedStateIcon: accordion.expandedStateIcon,
|
|
5758
|
-
collapsedStateIcon: accordion.collapsedStateIcon
|
|
5804
|
+
collapsedStateIcon: accordion.collapsedStateIcon,
|
|
5805
|
+
visibleStandfirst: accordion.visibleStandfirst,
|
|
5806
|
+
titleMargin: accordion.titleMargin,
|
|
5807
|
+
childrenContainerStyle: accordion.childrenContainerStyle
|
|
5759
5808
|
}, accordion.children);
|
|
5760
5809
|
}));
|
|
5761
5810
|
};
|
|
@@ -6041,14 +6090,9 @@ var BodyContent = function BodyContent(_ref2) {
|
|
|
6041
6090
|
_ref2$renderGridItem = _ref2.renderGridItem,
|
|
6042
6091
|
renderGridItem = _ref2$renderGridItem === void 0 ? true : _ref2$renderGridItem;
|
|
6043
6092
|
var textContainerClassName = !renderGrid && !renderGridItem ? className : undefined;
|
|
6044
|
-
var content = /*#__PURE__*/React__default.createElement(
|
|
6045
|
-
tag: "div",
|
|
6046
|
-
size: "large",
|
|
6047
|
-
"data-testid": "text-container",
|
|
6093
|
+
var content = /*#__PURE__*/React__default.createElement(BodyContentTextContainer, {
|
|
6048
6094
|
className: textContainerClassName,
|
|
6049
|
-
|
|
6050
|
-
__html: addTypographyClasses(text)
|
|
6051
|
-
}
|
|
6095
|
+
html: text
|
|
6052
6096
|
});
|
|
6053
6097
|
var gridItemOrContent = renderGridItem ? (/*#__PURE__*/React__default.createElement(GridItem, {
|
|
6054
6098
|
columnStartDesktop: columnStartDesktop,
|
|
@@ -7034,8 +7078,6 @@ var CastFilters = function CastFilters(_ref) {
|
|
|
7034
7078
|
key: personSelectionId,
|
|
7035
7079
|
"aria-selected": isSelected,
|
|
7036
7080
|
"aria-label": ariaLabel != null ? ariaLabel : name,
|
|
7037
|
-
"aria-posinset": index + 1,
|
|
7038
|
-
"aria-setsize": cast.length,
|
|
7039
7081
|
role: "option",
|
|
7040
7082
|
tabIndex: 0,
|
|
7041
7083
|
onClick: function onClick() {
|
|
@@ -7391,10 +7433,12 @@ var HotFilters = function HotFilters(_ref) {
|
|
|
7391
7433
|
var _templateObject$P, _templateObject2$C, _templateObject3$p;
|
|
7392
7434
|
var ScrollContainer = /*#__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\n @media ", " {\n overflow-x: visible;\n }\n"])), devices.mobile);
|
|
7393
7435
|
var TabsContainerWrapper = /*#__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 width: 100%;\n min-width: 0;\n flex-wrap: wrap;\n justify-content: flex-start;\n gap: 10px;\n }\n"])), devices.mobile);
|
|
7394
|
-
var StyledTab = /*#__PURE__*/styled(PrimaryButton)(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--color-base-black);\n min-width: fit-content;\n\n :hover {\n color: var(--color-base-white);\n }\n\n @media ", " {\n width: auto !important;\n min-width: fit-content;\n flex: 0 0 auto;\n }\n"])), devices.mobile);
|
|
7436
|
+
var StyledTab = /*#__PURE__*/styled(PrimaryButton)(_templateObject3$p || (_templateObject3$p = /*#__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);
|
|
7395
7437
|
|
|
7396
|
-
var _excluded$j = ["text", "id", "isSelected"];
|
|
7438
|
+
var _excluded$j = ["text", "id", "isSelected", "allowedSelectedWith"];
|
|
7397
7439
|
/**
|
|
7440
|
+
* A controlled filter button group that supports single- and multi-select strategies.
|
|
7441
|
+
* The consumer owns the selection state and receives the complete clicked item.
|
|
7398
7442
|
* A horizontally scrollable tabs filter component used to display
|
|
7399
7443
|
* selectable strategy tabs with configurable styling and selection behavior.
|
|
7400
7444
|
*
|
|
@@ -7431,42 +7475,50 @@ var _excluded$j = ["text", "id", "isSelected"];
|
|
|
7431
7475
|
*
|
|
7432
7476
|
* @returns { React.JSX.Element}
|
|
7433
7477
|
*
|
|
7434
|
-
* @example
|
|
7435
|
-
* The component does not manage selection itself. The parent owns `items` (including
|
|
7436
|
-
* `isSelected`) and updates that state in `onClick`. Use `allowedSelectedWith` on each
|
|
7437
|
-
* item to describe which other tab IDs may stay selected when that tab is chosen.
|
|
7438
|
-
*
|
|
7478
|
+
* @example
|
|
7439
7479
|
* ```tsx
|
|
7440
|
-
*
|
|
7441
|
-
*
|
|
7442
|
-
*
|
|
7443
|
-
*
|
|
7444
|
-
*
|
|
7445
|
-
*
|
|
7446
|
-
*
|
|
7447
|
-
*
|
|
7448
|
-
*
|
|
7449
|
-
*
|
|
7450
|
-
*
|
|
7451
|
-
*
|
|
7452
|
-
*
|
|
7453
|
-
*
|
|
7454
|
-
*
|
|
7455
|
-
*
|
|
7456
|
-
*
|
|
7457
|
-
*
|
|
7458
|
-
*
|
|
7459
|
-
*
|
|
7480
|
+
* * @example Controlled selection with custom rules
|
|
7481
|
+
* * The component does not manage selection itself. The parent owns `items` (including
|
|
7482
|
+
* * `isSelected`) and updates that state in `onClick`. Use `allowedSelectedWith` on each
|
|
7483
|
+
* * item to describe which other tab IDs may stay selected when that tab is chosen.
|
|
7484
|
+
* *
|
|
7485
|
+
* * ```tsx
|
|
7486
|
+
* * const [items, setItems] = useState<TCustomStrategyTabsFilterItem[]>([
|
|
7487
|
+
* * { id: 'all', text: 'All events', isSelected: true, allowedSelectedWith: [] },
|
|
7488
|
+
* * { id: 'opera', text: 'Opera', isSelected: false, allowedSelectedWith: ['ballet'] },
|
|
7489
|
+
* * { id: 'ballet', text: 'Ballet', isSelected: false, allowedSelectedWith: ['opera'] },
|
|
7490
|
+
* * ]);
|
|
7491
|
+
* *
|
|
7492
|
+
* * const handleClick = (clickedItem: TCustomStrategyTabsFilterItem) => {
|
|
7493
|
+
* * setItems((current) =>
|
|
7494
|
+
* * current.map((item) => {
|
|
7495
|
+
* * if (item.id === clickedItem.id) {
|
|
7496
|
+
* * return { ...item, isSelected: !item.isSelected };
|
|
7497
|
+
* * }
|
|
7498
|
+
* *
|
|
7499
|
+
* * const mayStaySelected = clickedItem.allowedSelectedWith?.includes(item.id);
|
|
7500
|
+
* * return { ...item, isSelected: mayStaySelected ? !item.isSelected : false };
|
|
7501
|
+
* * })
|
|
7502
|
+
* * );
|
|
7503
|
+
* * };
|
|
7504
|
+
* *
|
|
7505
|
+
* * return <CustomStrategyTabsFilter items={items} onClick={handleClick} />;
|
|
7460
7506
|
*/
|
|
7461
7507
|
var CustomStrategyTabsFilter = function CustomStrategyTabsFilter(_ref) {
|
|
7462
7508
|
var _customViewConfig$bac, _customViewConfig$bac2, _customViewConfig$tex, _customViewConfig$tex2;
|
|
7463
7509
|
var items = _ref.items,
|
|
7464
7510
|
className = _ref.className,
|
|
7511
|
+
ariaLabel = _ref.ariaLabel,
|
|
7465
7512
|
onClick = _ref.onClick,
|
|
7466
7513
|
customViewConfig = _ref.customViewConfig;
|
|
7467
7514
|
var handleClick = React__default.useCallback(function (item) {
|
|
7468
7515
|
onClick(item);
|
|
7469
7516
|
}, [onClick]);
|
|
7517
|
+
var handleKeyDown = React__default.useCallback(function (event, item) {
|
|
7518
|
+
if (event.key !== ' ' && event.key !== 'Spacebar') return;
|
|
7519
|
+
event.preventDefault();
|
|
7520
|
+
if (!event.repeat) handleClick(item);
|
|
7521
|
+
}, [handleClick]);
|
|
7470
7522
|
// in case of any partially passed configuration, config defaults non defined
|
|
7471
7523
|
var config = {
|
|
7472
7524
|
selectIcon: (customViewConfig == null ? void 0 : customViewConfig.selectIcon) || 'Confirm',
|
|
@@ -7482,7 +7534,9 @@ var CustomStrategyTabsFilter = function CustomStrategyTabsFilter(_ref) {
|
|
|
7482
7534
|
pressedColor: (customViewConfig == null ? void 0 : customViewConfig.pressedColor) || 'black-pressed'
|
|
7483
7535
|
};
|
|
7484
7536
|
return /*#__PURE__*/React__default.createElement(ScrollContainer, {
|
|
7485
|
-
|
|
7537
|
+
"aria-label": ariaLabel,
|
|
7538
|
+
className: className,
|
|
7539
|
+
role: "group"
|
|
7486
7540
|
}, /*#__PURE__*/React__default.createElement(TabsContainerWrapper, null, items.map(function (item) {
|
|
7487
7541
|
var text = item.text,
|
|
7488
7542
|
id = item.id,
|
|
@@ -7493,6 +7547,9 @@ var CustomStrategyTabsFilter = function CustomStrategyTabsFilter(_ref) {
|
|
|
7493
7547
|
onClick: function onClick() {
|
|
7494
7548
|
return handleClick(item);
|
|
7495
7549
|
},
|
|
7550
|
+
onKeyDown: function onKeyDown(event) {
|
|
7551
|
+
return handleKeyDown(event, item);
|
|
7552
|
+
},
|
|
7496
7553
|
iconName: isSelected ? config.selectIcon : undefined,
|
|
7497
7554
|
backgroundColor: isSelected ? config.backgroundColor.select : config.backgroundColor.unselect,
|
|
7498
7555
|
textColor: isSelected ? config.textColor.select : config.textColor.unselect,
|
|
@@ -7583,22 +7640,25 @@ var InfoBodyWrapper = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject4$n |
|
|
|
7583
7640
|
var css_248z$1 = "@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Regular.woff2') format('woff2');\n font-weight: 400;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Medium.woff2') format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://static.roh.org.uk/fonts/harmonic/GreyLLTT-Bold.woff2') format('woff2');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://static.roh.org.uk/fonts/harmonic/VictorSerif-Medium.woff2') format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://static.roh.org.uk/fonts/harmonic/VictorSerif-MediumItalic.woff2') format('woff2');\n font-weight: 500;\n font-style: italic;\n font-display: swap;\n}\n";
|
|
7584
7641
|
styleInject(css_248z$1);
|
|
7585
7642
|
|
|
7586
|
-
var css_248z$2 = ".core-theme-module_coreTheme__pWxYB {\n /* RBO Red */\n /* Primary Palette */\n --color-primary: #1a1a1a;\n --color-primary-background: #eb0a0a;\n --color-primary-red: #eb0a0a;\n --color-primary-black: #1a1a1a;\n\n /* Base Colours */\n --color-base-white: #ffffff;\n --color-base-black: #000000;\n --color-base-dark-grey: #4c4f53;\n --color-base-mid-grey: #72767c;\n --color-base-light-grey: #e9e9e9;\n --color-base-transparent: transparent;\n\n /* States */\n --color-state-error: #cc071e;\n --color-state-medium: #ffce45;\n --color-state-good: #2a874a;\n --color-state-focused: #1e1da0;\n --color-state-disabled: #b3b3b3;\n\n /* RBO Red (Core) */\n --color-rbo-red-hovered: #c40808;\n --color-rbo-red-pressed: #9d0707;\n\n /* RBO Black */\n --color-rbo-black-hovered: #575757;\n --color-rbo-black-pressed: #353535;\n\n /* Black */\n --color-black-hovered: #575757;\n --color-black-pressed: #353535;\n\n /* White */\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n /* Secondary Palette */\n --color-secondary-yellow: #ffce45;\n --color-secondary-pink: #ff36d0;\n --color-secondary-orange: #ff6700;\n --color-secondary-blue: #5f9cff;\n\n /* Shadows */\n --shadow-floating: 0px 4px 38px 0px #0000000a;\n\n /* Core theme colors */\n --base-color-primary: #c8102e;\n --base-color-core: #c8102e;\n --base-color-stream: #1866dc;\n --base-color-cinema: #1a1a1a;\n --base-color-white: #ffffff;\n --base-color-black: #000000;\n --base-color-dark-grey: #4c4f53;\n --base-color-mid-grey: #72767c;\n --base-color-light-grey: #e9e9e9;\n --base-color-transparent: transparent;\n --base-color-errorstate: #eb0a0a;\n --base-color-mediumstate: #ffce45;\n --base-color-goodstate: #2a874a;\n --base-color-progress: #1866dc;\n --base-color-navigation: #c8102e;\n --base-color-lapislazuli: #0060a0;\n --base-color-lemonchiffon: #fffbbe;\n\n --button-height: 48px;\n --button-line-height: 20px;\n --button-padding-x: 20px;\n --button-padding-y: 14px;\n --button-padding-y-icon: 12px;\n --button-icon-margin: 12px;\n --button-icon-width: 20px;\n --button-icon-height: 20px;\n --button-font-size: 14px;\n --button-font-weight: 400;\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-red);\n --button-hover-color: var(--color-rbo-red-hovered);\n --button-pressed-color: var(--color-rbo-red-pressed);\n --button-secondary-color: var(--color-primary-red);\n --button-secondary-hover-color: var(--color-rbo-red-hovered);\n --button-secondary-pressed-color: var(--color-rbo-red-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-auxiliary-color: var(--color-primary-black);\n --button-auxiliary-bg-color: var(--color-base-transparent);\n --button-anchor-tab-color: var(--color-primary-red);\n\n /* ----- Variables already used in Harmonic START ----- */\n --grid-column-gap: 36px;\n --grid-margin: 10%;\n\n --rotator-button-width: 60px;\n --rotator-button-icon-width: 36px;\n --rotator-button-small-width: 44px;\n --rotator-button-small-icon-width: 28px;\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-red);\n\n --carousel-image-caption-margin: 12px;\n\n --line-height-listing: 36px;\n\n --upsell-border-color: var(--color-primary-red);\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n\n @media (max-width: 699px) {\n --grid-column-gap: 12px;\n --grid-margin: 20px;\n --rotator-button-width: 40px;\n --rotator-button-icon-width: 24px;\n\n --line-height-listing: 34px;\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-column-gap: 20px;\n --grid-margin: 32px;\n --rotator-button-width: 44px;\n --rotator-button-icon-width: 24px;\n }\n\n /* ----- Variables already used in Harmonic END ----- */\n\n --font-size-header-1: 96px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 2px;\n --line-height-header-1: 110px;\n --margin-header-1: 0.67em 0;\n\n --font-size-header-2: 68px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 72px;\n --margin-header-2: 0.83em 0;\n\n --font-size-header-3: 44px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 48px;\n --margin-header-3: 1em 0;\n\n --font-size-header-4: 34px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 40px;\n --margin-header-4: 1.33em 0;\n\n --font-size-header-5: 24px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 30px;\n --margin-header-5: 1.67em 0;\n\n --font-size-header-6: 20px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 28px;\n --margin-header-6: 2.33em 0;\n\n --font-size-altHeader-3: 44px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 48px;\n\n --font-size-altHeader-4: 34px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 44px;\n\n --font-size-altHeader-5: 24px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 30px;\n\n --font-size-altHeader-6: 20px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 28px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-overline-3: 10px;\n --font-weight-overline-3: 500;\n --letter-spacing-overline-3: 1px;\n --line-height-overline-3: 12px;\n\n --font-size-overline-4: 8px;\n --font-weight-overline-4: 500;\n --letter-spacing-overline-4: 1px;\n --line-height-overline-4: 10px;\n\n --font-size-body-1: 19px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 26px;\n\n --font-size-body-2: 16px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 22px;\n\n --font-size-body-3: 14px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 20px;\n\n --font-size-subtitle-1: 18px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 22px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 22px;\n\n --font-size-title-description: 20px;\n --line-height-title-description: 28px;\n\n --font-size-individual-listing-name: 19px;\n --line-height-individual-listing-name: 24px;\n --line-height-people-listing-gap: 24px;\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-subtitle: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --font-family-navigation: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-size-navigation: 13px;\n --font-weight-navigation: 500;\n --line-height-navigation: 16px;\n --text-transform-navigation: uppercase;\n --letter-spacing-navigation: 1px;\n\n --navigation-small-gap: 16px;\n --navigation-middle-gap: 20px;\n --navigation-large-gap: 24px;\n --navigation-xlarge-gap: 36px;\n --navigation-large-margin: 60px;\n\n --font-size-search: 24px;\n --font-family-search: 'adobe-garamond-pro';\n\n --grid-outer-margin: 50px;\n --grid-template-columns: 14px calc(10% - 86px) repeat(12, minmax(0, 1fr)) calc(10% - 86px) 14px;\n\n --footer-height: 380px;\n --footer-padding-top: 44px;\n --footer-padding-bottom: 44px;\n --footer-items-gap: 32px;\n --footer-media-gap: 32px;\n --footer-media-icon-width: 24px;\n --footer-media-icon-height: 24px;\n --footer-vertical-spacing-lg: 58px;\n --footer-vertical-spacing-sm: 16px;\n\n --text-link-underline-offset: 8px;\n --cards-spacing-stack: 40px;\n\n --editorial-subtitle-margin-bottom: 16px;\n --editorial-margin-between: 24px;\n --editorial-spacing-hover: 4px;\n --anchor-tabs-height: 70px;\n\n --font-family-sans: 'GreyLLTT', 'Roboto', sans-serif;\n --font-family-serif: 'VictorSerif', 'Inria Serif Regular', serif;\n\n --harmonic-text-link-underline-offset: 4px;\n --harmonic-font-size-navigation: 19px;\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-red);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-red);\n --information-panel-button-color: var(--color-primary-black);\n --information-panel-button-bg-color: var(--color-base-white);\n --information-panel-button-hover-color: var(--color-white-hovered);\n --information-panel-button-pressed-color: var(--color-white-pressed);\n\n --heading-promo-bg-color: var(--color-primary-red);\n --page-header-bg-color: var(--color-primary-red);\n\n @media (max-width: 699px) {\n --font-size-header-1: 38px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 1px;\n --line-height-header-1: 42px;\n\n --font-size-header-2: 30px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 34px;\n\n --font-size-header-3: 26px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 30px;\n\n --font-size-header-4: 24px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 28px;\n\n --font-size-header-5: 20px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 28px;\n\n --font-size-header-6: 17px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 24px;\n\n --font-size-altHeader-3: 26px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 30px;\n\n --font-size-altHeader-4: 24px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 28px;\n\n --font-size-altHeader-5: 20px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 28px;\n\n --font-size-altHeader-6: 17px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 24px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-body-1: 17px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 24px;\n\n --font-size-body-2: 12px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 18px;\n\n --font-size-body-3: 11px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 16px;\n\n --font-size-subtitle-1: 16px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 24px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 18px;\n\n --font-size-title-description: 17px;\n --line-height-title-description: 24px;\n --line-height-people-listing-gap: 16px;\n\n --font-size-search: 20px;\n --font-family-search: 'adobe-garamond-pro';\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm Medium', sans-serif;\n --font-family-subtitle: 'Gotham SSm Medium', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --grid-template-columns: calc(20px - 12px) repeat(12, minmax(0, 1fr)) calc(20px - 12px);\n\n --footer-height: auto;\n --footer-padding-top: 20px;\n --footer-padding-bottom: 20px;\n --footer-items-gap: 12px;\n --footer-media-icon-width: 28px;\n --footer-media-icon-height: 28px;\n --footer-vertical-spacing-lg: 24px;\n --footer-vertical-spacing-sm: 24px;\n\n --anchor-tabs-height: 60px;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-template-columns: calc(32px - 20px) repeat(12, minmax(0, 1fr)) calc(32px - 20px);\n --font-size-header-6: 17px;\n --font-size-altHeader-4: 24px;\n --font-size-body-1: 17px;\n\n --footer-media-gap: 24px;\n --footer-padding-top: 40px;\n --footer-padding-bottom: 40px;\n }\n}\n";
|
|
7587
|
-
var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
|
|
7643
|
+
var css_248z$2 = "/* ~~~~~ General Styling Classes ~~~~~ */\n.typography_color-primary__LOfDi {\n color: var(--color-primary);\n}\n\n.typography_color-black__6MHRL {\n color: var(--color-base-black);\n}\n\n.typography_color-white__PfW5s {\n color: var(--color-base-white);\n}\n\n.typography_color-red__iPlbG {\n color: var(--color-primary-red);\n}\n\n.typography_color-grey__GA1c2 {\n color: var(--color-base-dark-grey);\n}\n\n.typography_color-inherit__RDd0Y {\n color: inherit;\n}\n\n.typography_em__E6tX- {\n font-style: italic;\n}\n/* ~~~ */\n\n/* Display Headers */\n.typography_display__-F3p4 {\n margin: 0;\n font-family: var(--font-family-sans);\n line-height: 100%;\n\n &.typography_large__uq0zC {\n font-size: 96px;\n font-weight: 700;\n letter-spacing: -5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 68px;\n font-weight: 500;\n letter-spacing: -3px;\n }\n\n /* Serif and Italic styles */\n &.typography_serif__VSO38,\n &.typography_em__E6tX- {\n font-family: var(--font-family-serif);\n font-weight: 500;\n }\n\n /* Serif and Italic adjustments */\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX- {\n letter-spacing: -3px;\n }\n\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -2px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 38px;\n letter-spacing: -1.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 32px;\n letter-spacing: -1.5px;\n }\n\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX-,\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n }\n}\n\n/* Headers */\n.typography_header__BexiD {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n\n &.typography_large__uq0zC {\n font-size: 44px;\n line-height: 48px;\n letter-spacing: -1.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 34px;\n line-height: 40px;\n letter-spacing: -1px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 26px;\n line-height: 32px;\n letter-spacing: -0.5px;\n }\n\n /* Serif and Italic styles */\n &.typography_serif__VSO38,\n &.typography_em__E6tX- {\n font-family: var(--font-family-serif);\n }\n\n /* Serif and Italic letter-spacing overrides */\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n\n &.typography_medium__K0uZD.typography_serif__VSO38,\n &.typography_medium__K0uZD.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 28px;\n line-height: 34px;\n letter-spacing: -1.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 24px;\n line-height: 28px;\n letter-spacing: -1px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 20px;\n line-height: 26px;\n letter-spacing: -0.75px;\n }\n\n /* Mobile overrides for serif/italic letter-spacing */\n &.typography_large__uq0zC.typography_serif__VSO38,\n &.typography_large__uq0zC.typography_em__E6tX-,\n &.typography_medium__K0uZD.typography_serif__VSO38,\n &.typography_medium__K0uZD.typography_em__E6tX-,\n &.typography_small__wfQ0K.typography_serif__VSO38,\n &.typography_small__wfQ0K.typography_em__E6tX- {\n letter-spacing: -0.5px;\n }\n }\n}\n\n/* Subtitle */\n.typography_subtitle__aoFTV {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n\n &.typography_large__uq0zC {\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n }\n}\n\n/* Body Copy */\n.typography_bodycopy__vYtQ8 {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n\n &.typography_large__uq0zC {\n font-size: 19px;\n line-height: 26px;\n letter-spacing: -0.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.5px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n }\n\n &.typography_medium__K0uZD {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 11px;\n line-height: 16px;\n letter-spacing: -0.2px;\n }\n }\n}\n\n/* Overline */\n.typography_overline__EnUK3 {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 500;\n text-transform: uppercase;\n\n &.typography_large__uq0zC {\n font-size: 14px;\n line-height: 18px;\n letter-spacing: 0.3px;\n }\n\n &.typography_small__wfQ0K {\n font-size: 12px;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n @media (max-width: 699px) {\n &.typography_large__uq0zC {\n line-height: 17px;\n letter-spacing: 0.3px; /* Added to ensure it stays */\n }\n\n &.typography_small__wfQ0K {\n line-height: 14px;\n letter-spacing: 0.3px;\n }\n }\n}\n\n/* Button Text */\n.typography_buttontext__vcxNi {\n margin: 0;\n font-family: var(--font-family-sans);\n font-size: 17px;\n line-height: 20px;\n letter-spacing: -0.5px;\n font-weight: 400;\n\n @media (max-width: 699px) {\n font-weight: 500;\n line-height: 17px;\n }\n}\n\n/* Caption Text */\n.typography_captiontext__91UFb {\n margin: 0;\n font-family: var(--font-family-sans);\n font-weight: 400;\n font-size: 17px;\n line-height: 24px;\n letter-spacing: -0.5px;\n\n @media (max-width: 699px) {\n font-size: 14px;\n line-height: 20px;\n letter-spacing: -0.2px;\n }\n}\n\n/* Navigation Text */\n.typography_navigationtext__YfGf7 {\n margin: 0;\n font-family: var(--font-family-sans);\n font-size: 19px;\n line-height: 19px;\n letter-spacing: 0.4px;\n font-weight: 500;\n\n @media (max-width: 699px) {\n font-size: 17px;\n line-height: 17px;\n }\n}\n";
|
|
7588
7644
|
styleInject(css_248z$2);
|
|
7589
7645
|
|
|
7590
|
-
var css_248z$3 = ".stream-theme-module_streamTheme__lTfqQ {\n /* Stream theme overrides */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-background: #1a1a1a;\n --color-primary-button: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n\n --color-border-basic: #DDDDDD;\n --color-input-basic: #727272;\n --color-border-secondary: #F0F0F0;\n --color-container-backgroud: #F6F6F6;\n --color-rbo-error: #CC071E;\n\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-black);\n --button-hover-color: var(--color-black-hovered);\n --button-pressed-color: var(--color-black-pressed);\n --button-secondary-color: var(--color-primary-black);\n --button-secondary-hover-color: var(--color-black-hovered);\n --button-secondary-pressed-color: var(--color-black-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-anchor-tab-color: var(--color-primary-black);\n\n --rotator-button-color: var(--color-base-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-black);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-black);\n\n --heading-promo-bg-color: var(--color-base-black);\n --page-header-bg-color: var(--color-primary-black);\n\n --upsell-border-color: var(--color-primary-black);\n}\n";
|
|
7591
|
-
var
|
|
7646
|
+
var css_248z$3 = ".core-theme-module_coreTheme__pWxYB {\n /* RBO Red */\n /* Primary Palette */\n --color-primary: #1a1a1a;\n --color-primary-background: #eb0a0a;\n --color-primary-red: #eb0a0a;\n --color-primary-black: #1a1a1a;\n\n /* Base Colours */\n --color-base-white: #ffffff;\n --color-base-black: #000000;\n --color-base-dark-grey: #4c4f53;\n --color-base-mid-grey: #72767c;\n --color-base-light-grey: #e9e9e9;\n --color-base-transparent: transparent;\n\n /* States */\n --color-state-error: #cc071e;\n --color-state-medium: #ffce45;\n --color-state-good: #2a874a;\n --color-state-focused: #1e1da0;\n --color-state-disabled: #b3b3b3;\n\n /* RBO Red (Core) */\n --color-rbo-red-hovered: #c40808;\n --color-rbo-red-pressed: #9d0707;\n\n /* RBO Black */\n --color-rbo-black-hovered: #575757;\n --color-rbo-black-pressed: #353535;\n\n /* Black */\n --color-black-hovered: #575757;\n --color-black-pressed: #353535;\n\n /* White */\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n /* Secondary Palette */\n --color-secondary-yellow: #ffce45;\n --color-secondary-pink: #ff36d0;\n --color-secondary-orange: #ff6700;\n --color-secondary-blue: #5f9cff;\n\n /* Shadows */\n --shadow-floating: 0px 4px 38px 0px #0000000a;\n\n /* Core theme colors */\n --base-color-primary: #c8102e;\n --base-color-core: #c8102e;\n --base-color-stream: #1866dc;\n --base-color-cinema: #1a1a1a;\n --base-color-white: #ffffff;\n --base-color-black: #000000;\n --base-color-dark-grey: #4c4f53;\n --base-color-mid-grey: #72767c;\n --base-color-light-grey: #e9e9e9;\n --base-color-transparent: transparent;\n --base-color-errorstate: #eb0a0a;\n --base-color-mediumstate: #ffce45;\n --base-color-goodstate: #2a874a;\n --base-color-progress: #1866dc;\n --base-color-navigation: #c8102e;\n --base-color-lapislazuli: #0060a0;\n --base-color-lemonchiffon: #fffbbe;\n\n --button-height: 48px;\n --button-line-height: 20px;\n --button-padding-x: 20px;\n --button-padding-y: 14px;\n --button-padding-y-icon: 12px;\n --button-icon-margin: 12px;\n --button-icon-width: 20px;\n --button-icon-height: 20px;\n --button-font-size: 14px;\n --button-font-weight: 400;\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-red);\n --button-hover-color: var(--color-rbo-red-hovered);\n --button-pressed-color: var(--color-rbo-red-pressed);\n --button-secondary-color: var(--color-primary-red);\n --button-secondary-hover-color: var(--color-rbo-red-hovered);\n --button-secondary-pressed-color: var(--color-rbo-red-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-auxiliary-color: var(--color-primary-black);\n --button-auxiliary-bg-color: var(--color-base-transparent);\n --button-anchor-tab-color: var(--color-primary-red);\n\n /* ----- Variables already used in Harmonic START ----- */\n --grid-column-gap: 36px;\n --grid-margin: 10%;\n\n --rotator-button-width: 60px;\n --rotator-button-icon-width: 36px;\n --rotator-button-small-width: 44px;\n --rotator-button-small-icon-width: 28px;\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-red);\n\n --carousel-image-caption-margin: 12px;\n\n --line-height-listing: 36px;\n\n --upsell-border-color: var(--color-primary-red);\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n\n @media (max-width: 699px) {\n --grid-column-gap: 12px;\n --grid-margin: 20px;\n --rotator-button-width: 40px;\n --rotator-button-icon-width: 24px;\n\n --line-height-listing: 34px;\n\n --font-feature-settings-body: 'pnum' on, 'onum' on, 'liga' off;\n --font-feature-settings-header: 'tnum' on, 'lnum' on;\n --font-feature-settings-subtitle: 'tnum' on, 'lnum' on;\n\n --text-transform-body: none;\n --text-transform-header: uppercase;\n --text-transform-subtitle: uppercase;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-column-gap: 20px;\n --grid-margin: 32px;\n --rotator-button-width: 44px;\n --rotator-button-icon-width: 24px;\n }\n\n /* ----- Variables already used in Harmonic END ----- */\n\n --font-size-header-1: 96px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 2px;\n --line-height-header-1: 110px;\n --margin-header-1: 0.67em 0;\n\n --font-size-header-2: 68px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 72px;\n --margin-header-2: 0.83em 0;\n\n --font-size-header-3: 44px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 48px;\n --margin-header-3: 1em 0;\n\n --font-size-header-4: 34px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 40px;\n --margin-header-4: 1.33em 0;\n\n --font-size-header-5: 24px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 30px;\n --margin-header-5: 1.67em 0;\n\n --font-size-header-6: 20px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 28px;\n --margin-header-6: 2.33em 0;\n\n --font-size-altHeader-3: 44px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 48px;\n\n --font-size-altHeader-4: 34px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 44px;\n\n --font-size-altHeader-5: 24px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 30px;\n\n --font-size-altHeader-6: 20px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 28px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-overline-3: 10px;\n --font-weight-overline-3: 500;\n --letter-spacing-overline-3: 1px;\n --line-height-overline-3: 12px;\n\n --font-size-overline-4: 8px;\n --font-weight-overline-4: 500;\n --letter-spacing-overline-4: 1px;\n --line-height-overline-4: 10px;\n\n --font-size-body-1: 19px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 26px;\n\n --font-size-body-2: 16px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 22px;\n\n --font-size-body-3: 14px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 20px;\n\n --font-size-subtitle-1: 18px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 22px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 22px;\n\n --font-size-title-description: 20px;\n --line-height-title-description: 28px;\n\n --font-size-individual-listing-name: 19px;\n --line-height-individual-listing-name: 24px;\n --line-height-people-listing-gap: 24px;\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-subtitle: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --font-family-navigation: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-size-navigation: 13px;\n --font-weight-navigation: 500;\n --line-height-navigation: 16px;\n --text-transform-navigation: uppercase;\n --letter-spacing-navigation: 1px;\n\n --navigation-small-gap: 16px;\n --navigation-middle-gap: 20px;\n --navigation-large-gap: 24px;\n --navigation-xlarge-gap: 36px;\n --navigation-large-margin: 60px;\n\n --font-size-search: 24px;\n --font-family-search: 'adobe-garamond-pro';\n\n --grid-outer-margin: 50px;\n --grid-template-columns: 14px calc(10% - 86px) repeat(12, minmax(0, 1fr)) calc(10% - 86px) 14px;\n\n --footer-height: 380px;\n --footer-padding-top: 44px;\n --footer-padding-bottom: 44px;\n --footer-items-gap: 32px;\n --footer-media-gap: 32px;\n --footer-media-icon-width: 24px;\n --footer-media-icon-height: 24px;\n --footer-vertical-spacing-lg: 58px;\n --footer-vertical-spacing-sm: 16px;\n\n --text-link-underline-offset: 8px;\n --cards-spacing-stack: 40px;\n\n --editorial-subtitle-margin-bottom: 16px;\n --editorial-margin-between: 24px;\n --editorial-spacing-hover: 4px;\n --anchor-tabs-height: 70px;\n\n --font-family-sans: 'GreyLLTT', 'Roboto', sans-serif;\n --font-family-serif: 'VictorSerif', 'Inria Serif Regular', serif;\n\n --harmonic-text-link-underline-offset: 4px;\n --harmonic-font-size-navigation: 19px;\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-red);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-red);\n --information-panel-button-color: var(--color-primary-black);\n --information-panel-button-bg-color: var(--color-base-white);\n --information-panel-button-hover-color: var(--color-white-hovered);\n --information-panel-button-pressed-color: var(--color-white-pressed);\n\n --heading-promo-bg-color: var(--color-primary-red);\n --page-header-bg-color: var(--color-primary-red);\n\n @media (max-width: 699px) {\n --font-size-header-1: 38px;\n --font-weight-header-1: 500;\n --letter-spacing-header-1: 1px;\n --line-height-header-1: 42px;\n\n --font-size-header-2: 30px;\n --font-weight-header-2: 500;\n --letter-spacing-header-2: 1px;\n --line-height-header-2: 34px;\n\n --font-size-header-3: 26px;\n --font-weight-header-3: 500;\n --letter-spacing-header-3: 1px;\n --line-height-header-3: 30px;\n\n --font-size-header-4: 24px;\n --font-weight-header-4: 500;\n --letter-spacing-header-4: 1px;\n --line-height-header-4: 28px;\n\n --font-size-header-5: 20px;\n --font-weight-header-5: 500;\n --letter-spacing-header-5: 1px;\n --line-height-header-5: 28px;\n\n --font-size-header-6: 17px;\n --font-weight-header-6: 500;\n --letter-spacing-header-6: 1px;\n --line-height-header-6: 24px;\n\n --font-size-altHeader-3: 26px;\n --font-weight-altHeader-3: normal;\n --letter-spacing-altHeader-3: normal;\n --line-height-altHeader-3: 30px;\n\n --font-size-altHeader-4: 24px;\n --font-weight-altHeader-4: normal;\n --letter-spacing-altHeader-4: normal;\n --line-height-altHeader-4: 28px;\n\n --font-size-altHeader-5: 20px;\n --font-weight-altHeader-5: normal;\n --letter-spacing-altHeader-5: normal;\n --line-height-altHeader-5: 28px;\n\n --font-size-altHeader-6: 17px;\n --font-weight-altHeader-6: normal;\n --letter-spacing-altHeader-6: normal;\n --line-height-altHeader-6: 24px;\n\n --font-size-overline-1: 14px;\n --font-weight-overline-1: 500;\n --letter-spacing-overline-1: 1px;\n --line-height-overline-1: 16px;\n\n --font-size-overline-2: 12px;\n --font-weight-overline-2: 500;\n --letter-spacing-overline-2: 1px;\n --line-height-overline-2: 14px;\n\n --font-size-body-1: 17px;\n --font-weight-body-1: 400;\n --letter-spacing-body-1: normal;\n --line-height-body-1: 24px;\n\n --font-size-body-2: 12px;\n --font-weight-body-2: 400;\n --letter-spacing-body-2: normal;\n --line-height-body-2: 18px;\n\n --font-size-body-3: 11px;\n --font-weight-body-3: 400;\n --letter-spacing-body-3: normal;\n --line-height-body-3: 16px;\n\n --font-size-subtitle-1: 16px;\n --font-weight-subtitle-1: 500;\n --letter-spacing-subtitle-1: 1px;\n --line-height-subtitle-1: 24px;\n\n --font-size-subtitle-2: 14px;\n --font-weight-subtitle-2: 500;\n --letter-spacing-subtitle-2: 1px;\n --line-height-subtitle-2: 18px;\n\n --font-size-title-description: 17px;\n --line-height-title-description: 24px;\n --line-height-people-listing-gap: 16px;\n\n --font-size-search: 20px;\n --font-family-search: 'adobe-garamond-pro';\n\n --font-family-header: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-altHeader: 'adobe-garamond-pro';\n --font-family-body: 'adobe-garamond-pro';\n --font-family-body-italics: 'adobe-garamond-pro';\n --font-family-buttons: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-overline: 'Gotham SSm Medium', sans-serif;\n --font-family-subtitle: 'Gotham SSm Medium', 'Montserrat', sans-serif;\n --font-family-people-listing-role: 'Gotham SSm A', 'Gotham SSm B', 'Montserrat', sans-serif;\n --font-family-people-listing-name: 'adobe-garamond-pro';\n\n --font-feature-settings-altHeader: 'pnum' on, 'onum' on;\n --font-feature-settings-overline: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n --font-feature-settings-navigation: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n\n --text-transform-altHeader: none;\n --text-transform-overline: uppercase;\n\n --word-break-header: break-word;\n --word-break-altHeader: break-word;\n --word-break-body: break-word;\n --word-break-overline: break-word;\n --word-break-subtitle: break-word;\n\n --grid-template-columns: calc(20px - 12px) repeat(12, minmax(0, 1fr)) calc(20px - 12px);\n\n --footer-height: auto;\n --footer-padding-top: 20px;\n --footer-padding-bottom: 20px;\n --footer-items-gap: 12px;\n --footer-media-icon-width: 28px;\n --footer-media-icon-height: 28px;\n --footer-vertical-spacing-lg: 24px;\n --footer-vertical-spacing-sm: 24px;\n\n --anchor-tabs-height: 60px;\n }\n\n @media (min-width: 700px) and (max-width: 1139px) {\n --grid-template-columns: calc(32px - 20px) repeat(12, minmax(0, 1fr)) calc(32px - 20px);\n --font-size-header-6: 17px;\n --font-size-altHeader-4: 24px;\n --font-size-body-1: 17px;\n\n --footer-media-gap: 24px;\n --footer-padding-top: 40px;\n --footer-padding-bottom: 40px;\n }\n}\n";
|
|
7647
|
+
var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
|
|
7592
7648
|
styleInject(css_248z$3);
|
|
7593
7649
|
|
|
7594
|
-
var css_248z$4 = ".
|
|
7595
|
-
var
|
|
7650
|
+
var css_248z$4 = ".stream-theme-module_streamTheme__lTfqQ {\n /* Stream theme overrides */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-background: #1a1a1a;\n --color-primary-button: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n\n --color-border-basic: #DDDDDD;\n --color-input-basic: #727272;\n --color-border-secondary: #F0F0F0;\n --color-container-backgroud: #F6F6F6;\n --color-rbo-error: #CC071E;\n\n --button-color: var(--color-base-white);\n --button-bg-color: var(--color-primary-black);\n --button-hover-color: var(--color-black-hovered);\n --button-pressed-color: var(--color-black-pressed);\n --button-secondary-color: var(--color-primary-black);\n --button-secondary-hover-color: var(--color-black-hovered);\n --button-secondary-pressed-color: var(--color-black-pressed);\n --button-tertiary-color: var(--color-primary-black);\n --button-tertiary-hover-color: var(--color-rbo-black-hovered);\n --button-tertiary-pressed-color: var(--color-rbo-black-pressed);\n --button-anchor-tab-color: var(--color-primary-black);\n\n --rotator-button-color: var(--color-base-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-base-white);\n --announcement-banner-bg-color: var(--color-primary-black);\n --announcement-banner-hover-color: var(--color-white-hovered);\n --announcement-banner-pressed-color: var(--color-white-pressed);\n\n --information-panel-color: var(--color-base-white);\n --information-panel-bg-color: var(--color-primary-black);\n\n --heading-promo-bg-color: var(--color-base-black);\n --page-header-bg-color: var(--color-primary-black);\n\n --upsell-border-color: var(--color-primary-black);\n}\n";
|
|
7651
|
+
var streamThemeStyles = {"streamTheme":"stream-theme-module_streamTheme__lTfqQ"};
|
|
7596
7652
|
styleInject(css_248z$4);
|
|
7597
7653
|
|
|
7598
|
-
var css_248z$5 = ".
|
|
7599
|
-
var
|
|
7654
|
+
var css_248z$5 = ".cinema-theme-module_cinemaTheme__f5QFs {\n /* White */\n --base-color-primary: #1a1a1a;\n --color-primary: #1a1a1a;\n --color-primary-button: #ffffff;\n --color-primary-background: #1a1a1a;\n --color-primary-button-reverse-bg: #ffffff;\n --color-primary-button-reverse: #1a1a1a;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n --color-white-hovered: #fafafa;\n --color-white-pressed: #f2f2f2;\n\n --button-color: var(--color-primary-black);\n --button-bg-color: var(--color-base-white);\n --button-hover-color: var(--color-white-hovered);\n --button-pressed-color: var(--color-white-pressed);\n --button-secondary-color: var(--color-base-white);\n --button-secondary-hover-color: var(--color-white-hovered);\n --button-secondary-pressed-color: var(--color-white-pressed);\n --button-tertiary-color: var(--color-base-white);\n --button-tertiary-hover-color: var(--color-white-hovered);\n --button-tertiary-pressed-color: var(--color-white-pressed);\n --button-anchor-tab-color: var(--color-primary-black);\n\n --rotator-button-color: var(--color-primary-black);\n --rotator-button-bg-color: var(--color-base-light-grey);\n --rotator-button-hover-color: var(--color-base-white);\n --rotator-button-hover-bg-color: var(--color-primary-black);\n\n --announcement-banner-color: var(--color-primary-red);\n --announcement-banner-bg-color: var(--color-base-white);\n --announcement-banner-hover-color: var(--color-rbo-red-hovered);\n --announcement-banner-pressed-color: var(--color-rbo-red-pressed);\n\n --information-panel-color: var(--color-primary-black);\n --information-panel-bg-color: var(--color-base-white);\n --information-panel-button-color: var(--color-base-white);\n --information-panel-button-bg-color: var(--color-primary-red);\n --information-panel-button-hover-color: var(--color-rbo-red-hovered);\n --information-panel-button-pressed-color: var(--color-rbo-red-pressed);\n\n --heading-promo-bg-color: var(--color-base-white);\n --page-header-bg-color: var(--color-primary-black);\n\n --upsell-border-color: var(--color-primary-black);\n}\n";
|
|
7655
|
+
var cinemaThemeStyles = {"cinemaTheme":"cinema-theme-module_cinemaTheme__f5QFs"};
|
|
7600
7656
|
styleInject(css_248z$5);
|
|
7601
7657
|
|
|
7658
|
+
var css_248z$6 = ".schools-theme-module_schoolsTheme__CWHba {\n /* Schools theme overrides */\n --base-color-primary: #c8102e;\n --color-primary: #c8102e;\n --color-primary-button: #c8102e;\n --color-primary-button-reverse-bg: #1a1a1a;\n --color-primary-button-reverse: #ffffff;\n --color-secondary-button: #ffffff;\n --color-tertiary-button: transparent;\n --color-auxiliary-button: transparent;\n\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n\n @media only screen and (max-width: calc(var(--breakpoint-sm) - 1px)) {\n --text-transform-header: none;\n --text-transform-altHeader: none;\n --text-transform-body: none;\n --text-transform-overline: none;\n --text-transform-subtitle: none;\n --text-transform-navigation: uppercase;\n }\n}\n";
|
|
7659
|
+
var schoolsThemeStyles = {"schoolsTheme":"schools-theme-module_schoolsTheme__CWHba"};
|
|
7660
|
+
styleInject(css_248z$6);
|
|
7661
|
+
|
|
7602
7662
|
/* eslint-disable react/jsx-no-useless-fragment */
|
|
7603
7663
|
var DEFAULT_THEME = ThemeType.Core;
|
|
7604
7664
|
var getThemeClass = function getThemeClass(theme) {
|
|
@@ -9007,14 +9067,13 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
9007
9067
|
}));
|
|
9008
9068
|
};
|
|
9009
9069
|
|
|
9010
|
-
var _templateObject$11, _templateObject2$P, _templateObject3$A
|
|
9070
|
+
var _templateObject$11, _templateObject2$P, _templateObject3$A;
|
|
9011
9071
|
var ReplacementWrapper = /*#__PURE__*/styled.div(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
|
|
9012
9072
|
var CreditListingWrapper = /*#__PURE__*/styled(PeopleListingGrid)(_templateObject2$P || (_templateObject2$P = /*#__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) {
|
|
9013
9073
|
var columnCount = _ref.columnCount;
|
|
9014
9074
|
return "repeat(" + columnCount + ", 1fr)";
|
|
9015
9075
|
}, devices.mobile, devices.tablet);
|
|
9016
|
-
var
|
|
9017
|
-
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n min-height: 1.5em;\n"])));
|
|
9076
|
+
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n min-height: 1.5em;\n"])));
|
|
9018
9077
|
|
|
9019
9078
|
// Get the total character length of a property in an array of objects
|
|
9020
9079
|
var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
|
|
@@ -9062,7 +9121,8 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
9062
9121
|
_ref$largeColumnSpan = _ref.largeColumnSpan,
|
|
9063
9122
|
largeColumnSpan = _ref$largeColumnSpan === void 0 ? DEFAULT_LARGE_COLUMN_SPAN : _ref$largeColumnSpan,
|
|
9064
9123
|
_ref$characterThresho = _ref.characterThreshold,
|
|
9065
|
-
characterThreshold = _ref$characterThresho === void 0 ? DEFAULT_CHARACTER_THRESHOLD : _ref$characterThresho
|
|
9124
|
+
characterThreshold = _ref$characterThresho === void 0 ? DEFAULT_CHARACTER_THRESHOLD : _ref$characterThresho,
|
|
9125
|
+
className = _ref.className;
|
|
9066
9126
|
var creditEntries = [];
|
|
9067
9127
|
var nextColumnStart = 1;
|
|
9068
9128
|
roles.forEach(function (_ref2, index) {
|
|
@@ -9103,20 +9163,21 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
9103
9163
|
columnSpanSmallDevice: 1,
|
|
9104
9164
|
key: "credit-entry-" + name + "-" + index,
|
|
9105
9165
|
"data-testid": "credit-entry"
|
|
9106
|
-
}, /*#__PURE__*/React__default.createElement(TextWrapper$1,
|
|
9166
|
+
}, /*#__PURE__*/React__default.createElement(TextWrapper$1, {
|
|
9167
|
+
className: className
|
|
9168
|
+
}, /*#__PURE__*/React__default.createElement(RoleWrapper, {
|
|
9107
9169
|
title: "role",
|
|
9108
9170
|
"data-roh": dataROH
|
|
9109
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
9110
|
-
|
|
9111
|
-
|
|
9112
|
-
}, name)), description && (/*#__PURE__*/React__default.createElement(
|
|
9113
|
-
|
|
9114
|
-
|
|
9115
|
-
}, description))
|
|
9116
|
-
return /*#__PURE__*/React__default.createElement(
|
|
9171
|
+
}, /*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
|
|
9172
|
+
size: "small",
|
|
9173
|
+
color: "grey"
|
|
9174
|
+
}, name)), description && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
9175
|
+
size: "small",
|
|
9176
|
+
color: "grey"
|
|
9177
|
+
}, description)), personArrays.map(function (personArray, arrayIndex) {
|
|
9178
|
+
return /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
9117
9179
|
key: "personArray" + arrayIndex,
|
|
9118
|
-
|
|
9119
|
-
tag: "p"
|
|
9180
|
+
size: "medium"
|
|
9120
9181
|
}, personArray.map(function (person, personIndex) {
|
|
9121
9182
|
return /*#__PURE__*/React__default.createElement(Person, {
|
|
9122
9183
|
key: "" + person.name + personIndex,
|
|
@@ -9124,17 +9185,14 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
9124
9185
|
withSeparator: personArray.length !== personIndex + 1
|
|
9125
9186
|
});
|
|
9126
9187
|
}));
|
|
9127
|
-
}), replacement && (/*#__PURE__*/React__default.createElement(ReplacementWrapper, null, /*#__PURE__*/React__default.createElement(
|
|
9128
|
-
|
|
9129
|
-
|
|
9130
|
-
|
|
9131
|
-
level: 1,
|
|
9132
|
-
tag: "p",
|
|
9188
|
+
}), replacement && (/*#__PURE__*/React__default.createElement(ReplacementWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
9189
|
+
size: "medium"
|
|
9190
|
+
}, replacement))), musicTitle && musicTitle.length > 0 && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
9191
|
+
size: "small",
|
|
9133
9192
|
key: "music-" + musicTitle + "-text"
|
|
9134
|
-
}, concatenateMusicTitle(musicTitle, index))), additionalInfo &&
|
|
9135
|
-
|
|
9136
|
-
|
|
9137
|
-
}, additionalInfo)))));
|
|
9193
|
+
}, concatenateMusicTitle(musicTitle, index))), additionalInfo && /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
9194
|
+
size: "medium"
|
|
9195
|
+
}, additionalInfo))));
|
|
9138
9196
|
});
|
|
9139
9197
|
return /*#__PURE__*/React__default.createElement(CreditListingWrapper, {
|
|
9140
9198
|
columnCount: columnCount
|
|
@@ -9160,7 +9218,7 @@ var PolicyLinks = function PolicyLinks(_ref) {
|
|
|
9160
9218
|
}));
|
|
9161
9219
|
};
|
|
9162
9220
|
|
|
9163
|
-
var _templateObject$13, _templateObject3$B, _templateObject4$
|
|
9221
|
+
var _templateObject$13, _templateObject3$B, _templateObject4$v, _templateObject5$q, _templateObject6$j, _templateObject7$f, _templateObject8$b, _templateObject9$6, _templateObject0$6, _templateObject1$4, _templateObject10$3, _templateObject11$2, _templateObject12$2, _templateObject13$1, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
|
|
9164
9222
|
var LENGTH_TEXT = 28;
|
|
9165
9223
|
var LENGTH_TEXT_TABLET$1 = 12;
|
|
9166
9224
|
var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
|
|
@@ -9201,7 +9259,7 @@ var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject3$B || (_templat
|
|
|
9201
9259
|
}
|
|
9202
9260
|
return '';
|
|
9203
9261
|
});
|
|
9204
|
-
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
9262
|
+
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n\n ", "\n"])), function (_ref7) {
|
|
9205
9263
|
var marginBottom = _ref7.marginBottom;
|
|
9206
9264
|
return marginBottom + "px";
|
|
9207
9265
|
}, function (_ref8) {
|
|
@@ -9241,7 +9299,7 @@ var _excluded$m = ["text"],
|
|
|
9241
9299
|
_excluded3$1 = ["text"];
|
|
9242
9300
|
var _buttonTypeToButton$1;
|
|
9243
9301
|
var LENGTH_TEXT$1 = 28;
|
|
9244
|
-
var LENGTH_TEXT_PARAGRAPH =
|
|
9302
|
+
var LENGTH_TEXT_PARAGRAPH = 185;
|
|
9245
9303
|
var buttonTypeToButton$1 = (_buttonTypeToButton$1 = {}, _buttonTypeToButton$1[ButtonType.Primary] = PrimaryButton, _buttonTypeToButton$1[ButtonType.Secondary] = SecondaryButton, _buttonTypeToButton$1[ButtonType.Tertiary] = TertiaryButton, _buttonTypeToButton$1);
|
|
9246
9304
|
var PromoWithTags = function PromoWithTags(_ref) {
|
|
9247
9305
|
var _ref$imagePosition = _ref.imagePosition,
|
|
@@ -9432,7 +9490,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
9432
9490
|
}))));
|
|
9433
9491
|
};
|
|
9434
9492
|
|
|
9435
|
-
var _templateObject$14, _templateObject2$Q, _templateObject3$C, _templateObject4$
|
|
9493
|
+
var _templateObject$14, _templateObject2$Q, _templateObject3$C, _templateObject4$w, _templateObject5$r, _templateObject6$k, _templateObject7$g;
|
|
9436
9494
|
var LENGTH_TEXT$2 = 28;
|
|
9437
9495
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
9438
9496
|
var PromoWithTitleGrid = /*#__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"])), function (_ref) {
|
|
@@ -9450,7 +9508,7 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$C ||
|
|
|
9450
9508
|
var imageToLeft = _ref4.imageToLeft;
|
|
9451
9509
|
return imageToLeft ? 'right' : 'left';
|
|
9452
9510
|
}, devices.mobile);
|
|
9453
|
-
var HarmonicHeaderWithWrapper$1 = /*#__PURE__*/styled(HarmonicHeader)(_templateObject4$
|
|
9511
|
+
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);
|
|
9454
9512
|
var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-wrap: break-word;\n margin-bottom: 16px;\n"])));
|
|
9455
9513
|
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);
|
|
9456
9514
|
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) {
|
|
@@ -10024,7 +10082,7 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
10024
10082
|
}, description)))));
|
|
10025
10083
|
};
|
|
10026
10084
|
|
|
10027
|
-
var _templateObject$1b, _templateObject2$V, _templateObject3$H, _templateObject4$
|
|
10085
|
+
var _templateObject$1b, _templateObject2$V, _templateObject3$H, _templateObject4$x;
|
|
10028
10086
|
var Container$4 = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
10029
10087
|
var SelectWrapper = /*#__PURE__*/styled.div(_templateObject2$V || (_templateObject2$V = /*#__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) {
|
|
10030
10088
|
var width = _ref.width;
|
|
@@ -10048,7 +10106,7 @@ var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$H || (_templateObject
|
|
|
10048
10106
|
if (darkMode) return "var(--color-base-white)";
|
|
10049
10107
|
return "var(--color-primary-black)";
|
|
10050
10108
|
}, devices.mobile);
|
|
10051
|
-
var ErrorLabel$5 = /*#__PURE__*/styled.div(_templateObject4$
|
|
10109
|
+
var ErrorLabel$5 = /*#__PURE__*/styled.div(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 20px 0 0;\n color: ", ";\n"])), function (_ref6) {
|
|
10052
10110
|
var darkMode = _ref6.darkMode;
|
|
10053
10111
|
if (darkMode) return "var(--color-base-white)";
|
|
10054
10112
|
return "var(--color-state-error)";
|
|
@@ -10167,7 +10225,7 @@ var SelectComponent$1 = function SelectComponent(_ref) {
|
|
|
10167
10225
|
})));
|
|
10168
10226
|
};
|
|
10169
10227
|
|
|
10170
|
-
var _templateObject$1c, _templateObject2$W, _templateObject3$I, _templateObject4$
|
|
10228
|
+
var _templateObject$1c, _templateObject2$W, _templateObject3$I, _templateObject4$y;
|
|
10171
10229
|
var TabsContainer = /*#__PURE__*/styled.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
|
|
10172
10230
|
var ItemsContainer = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObject2$W = /*#__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) {
|
|
10173
10231
|
if (props.showMenu) {
|
|
@@ -10176,7 +10234,7 @@ var ItemsContainer = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObj
|
|
|
10176
10234
|
return "display: none;";
|
|
10177
10235
|
});
|
|
10178
10236
|
var MenuContainer$1 = /*#__PURE__*/styled.div(_templateObject3$I || (_templateObject3$I = /*#__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);
|
|
10179
|
-
var MenuItem = /*#__PURE__*/styled.div(_templateObject4$
|
|
10237
|
+
var MenuItem = /*#__PURE__*/styled.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n a {\n margin-left: 0;\n }\n }\n"])), devices.mobileAndTablet);
|
|
10180
10238
|
|
|
10181
10239
|
/* eslint-disable jsx-a11y/no-static-element-interactions */
|
|
10182
10240
|
var Tabs = function Tabs(_ref) {
|
|
@@ -10302,10 +10360,10 @@ var Tabs = function Tabs(_ref) {
|
|
|
10302
10360
|
}, "Menu"))))));
|
|
10303
10361
|
};
|
|
10304
10362
|
|
|
10305
|
-
var _templateObject$1d, _templateObject3$J, _templateObject4$
|
|
10363
|
+
var _templateObject$1d, _templateObject3$J, _templateObject4$z, _templateObject5$t, _templateObject6$m, _templateObject7$i, _templateObject8$c, _templateObject9$7;
|
|
10306
10364
|
var Wrapper$5 = /*#__PURE__*/styled.div(_templateObject$1d || (_templateObject$1d = /*#__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"])));
|
|
10307
10365
|
var PromoLabel = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject3$J || (_templateObject3$J = /*#__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"])));
|
|
10308
|
-
var ButtonContainer = /*#__PURE__*/styled.div(_templateObject4$
|
|
10366
|
+
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) {
|
|
10309
10367
|
var stackCtasEarly = _ref.stackCtasEarly;
|
|
10310
10368
|
return stackCtasEarly ? devices.smallDesktop + ", " + devices.mobileAndTablet : devices.mobile;
|
|
10311
10369
|
}, function (_ref2) {
|
|
@@ -10316,7 +10374,7 @@ var TitleContainer$3 = /*#__PURE__*/styled.div(_templateObject5$t || (_templateO
|
|
|
10316
10374
|
var singleChild = _ref3.singleChild;
|
|
10317
10375
|
return singleChild ? '0' : '10px';
|
|
10318
10376
|
});
|
|
10319
|
-
var DescriptionWrapper
|
|
10377
|
+
var DescriptionWrapper = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && p {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
10320
10378
|
var PriceRow = /*#__PURE__*/styled.div(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n gap: 6px 12px;\n"])));
|
|
10321
10379
|
var LineThrough = /*#__PURE__*/styled(HarmonicHeader)(_templateObject8$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration-line: line-through;\n color: var(--color-base-dark-grey);\n"])));
|
|
10322
10380
|
var VisuallyHidden = /*#__PURE__*/styled.span(_templateObject9$7 || (_templateObject9$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 0 !important;\n clip: rect(1px, 1px, 1px, 1px) !important;\n -webkit-clip-path: inset(50%) !important;\n clip-path: inset(50%) !important;\n height: 1px !important;\n margin: -1px !important;\n overflow: hidden !important;\n padding: 0 !important;\n position: absolute !important;\n width: 1px !important;\n white-space: nowrap !important;\n"])));
|
|
@@ -10338,7 +10396,7 @@ var capitalizeFirstLetter = function capitalizeFirstLetter(string) {
|
|
|
10338
10396
|
var OfferText = function OfferText(_ref) {
|
|
10339
10397
|
var title = _ref.title,
|
|
10340
10398
|
description = _ref.description;
|
|
10341
|
-
return /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(HarmonicSubtitle, null, title), description && /*#__PURE__*/React__default.createElement(DescriptionWrapper
|
|
10399
|
+
return /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(HarmonicSubtitle, null, title), description && /*#__PURE__*/React__default.createElement(DescriptionWrapper, {
|
|
10342
10400
|
tag: "div",
|
|
10343
10401
|
size: "large",
|
|
10344
10402
|
dangerouslySetInnerHTML: {
|
|
@@ -10455,11 +10513,11 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
10455
10513
|
}, caption))));
|
|
10456
10514
|
};
|
|
10457
10515
|
|
|
10458
|
-
var _templateObject$1f, _templateObject2$Y, _templateObject3$L, _templateObject4$
|
|
10516
|
+
var _templateObject$1f, _templateObject2$Y, _templateObject3$L, _templateObject4$A, _templateObject5$u, _templateObject6$n;
|
|
10459
10517
|
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$1f || (_templateObject$1f = /*#__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"])));
|
|
10460
10518
|
var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
10461
10519
|
var StyledImage = /*#__PURE__*/styled.img(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
10462
|
-
var ImageWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$
|
|
10520
|
+
var ImageWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
10463
10521
|
var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$u || (_templateObject5$u = /*#__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);
|
|
10464
10522
|
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);
|
|
10465
10523
|
|
|
@@ -10540,18 +10598,47 @@ var NavTop = function NavTop(_ref) {
|
|
|
10540
10598
|
}));
|
|
10541
10599
|
};
|
|
10542
10600
|
|
|
10543
|
-
var _templateObject$1h, _templateObject2$Z, _templateObject3$M, _templateObject4$
|
|
10544
|
-
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3
|
|
10545
|
-
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top:
|
|
10546
|
-
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
|
|
10601
|
+
var _templateObject$1h, _templateObject2$Z, _templateObject3$M, _templateObject4$B, _templateObject5$v;
|
|
10602
|
+
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1h || (_templateObject$1h = /*#__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"])));
|
|
10603
|
+
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$Z || (_templateObject2$Z = /*#__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"])));
|
|
10604
|
+
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$M || (_templateObject3$M = /*#__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) {
|
|
10547
10605
|
var isVisible = _ref.isVisible;
|
|
10548
10606
|
return isVisible ? 'visible' : 'hidden';
|
|
10549
10607
|
});
|
|
10550
|
-
var IntroTextContainer = /*#__PURE__*/styled.div(_templateObject4$
|
|
10608
|
+
var IntroTextContainer = /*#__PURE__*/styled.div(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n line-height: 24px;\n font-size: 17px;\n\n @media print {\n visibility: hidden;\n }\n"])), function (_ref2) {
|
|
10551
10609
|
var isVisible = _ref2.isVisible;
|
|
10552
10610
|
return isVisible ? 'visible' : 'hidden';
|
|
10553
10611
|
});
|
|
10554
|
-
var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-
|
|
10612
|
+
var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject5$v || (_templateObject5$v = /*#__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"])));
|
|
10613
|
+
|
|
10614
|
+
var _templateObject$1i, _templateObject2$_;
|
|
10615
|
+
var TextLinkWrapper$4 = /*#__PURE__*/styled.a(_templateObject$1i || (_templateObject$1i = /*#__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) {
|
|
10616
|
+
var color = _ref.color;
|
|
10617
|
+
return color;
|
|
10618
|
+
});
|
|
10619
|
+
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"])));
|
|
10620
|
+
|
|
10621
|
+
var _excluded$r = ["children", "iconName", "iconDirection", "textColor", "disableTruncation"];
|
|
10622
|
+
var ReadMoreTextLink = function ReadMoreTextLink(_ref) {
|
|
10623
|
+
var children = _ref.children,
|
|
10624
|
+
iconName = _ref.iconName,
|
|
10625
|
+
iconDirection = _ref.iconDirection,
|
|
10626
|
+
textColor = _ref.textColor,
|
|
10627
|
+
_ref$disableTruncatio = _ref.disableTruncation,
|
|
10628
|
+
disableTruncation = _ref$disableTruncatio === void 0 ? false : _ref$disableTruncatio,
|
|
10629
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$r);
|
|
10630
|
+
var truncatedString = disableTruncation ? children : children.substring(0, 30);
|
|
10631
|
+
return /*#__PURE__*/React__default.createElement(TextLinkWrapper$4, Object.assign({
|
|
10632
|
+
color: textColor,
|
|
10633
|
+
iconName: iconName
|
|
10634
|
+
}, rest), truncatedString, iconName ? (/*#__PURE__*/React__default.createElement(TextLinkIconWrapper$1, {
|
|
10635
|
+
"data-testid": "text-link-icon"
|
|
10636
|
+
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
10637
|
+
iconName: iconName,
|
|
10638
|
+
direction: iconDirection,
|
|
10639
|
+
color: textColor
|
|
10640
|
+
}))) : null);
|
|
10641
|
+
};
|
|
10555
10642
|
|
|
10556
10643
|
var keyDown = function keyDown(e, toggleFunction) {
|
|
10557
10644
|
if (e.key === 'Enter' || e.key === 'Space') {
|
|
@@ -10570,7 +10657,8 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10570
10657
|
hideText = _ref.hideText,
|
|
10571
10658
|
characterLimit = _ref.characterLimit,
|
|
10572
10659
|
_ref$truncate = _ref.truncate,
|
|
10573
|
-
truncate = _ref$truncate === void 0 ? true : _ref$truncate
|
|
10660
|
+
truncate = _ref$truncate === void 0 ? true : _ref$truncate,
|
|
10661
|
+
className = _ref.className;
|
|
10574
10662
|
var _useState = useState(initOpen),
|
|
10575
10663
|
isFullTextOpen = _useState[0],
|
|
10576
10664
|
setIsFullTextOpen = _useState[1];
|
|
@@ -10607,14 +10695,15 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10607
10695
|
var contentContainerId = title + "-read-more-content";
|
|
10608
10696
|
return /*#__PURE__*/React__default.createElement(AccordionContainer, {
|
|
10609
10697
|
tabIndex: 0,
|
|
10610
|
-
onKeyDown: handleKeyDown
|
|
10698
|
+
onKeyDown: handleKeyDown,
|
|
10699
|
+
className: className,
|
|
10700
|
+
showTopLine: false
|
|
10611
10701
|
}, /*#__PURE__*/React__default.createElement(ReadMoreContainer, {
|
|
10612
10702
|
"aria-label": title,
|
|
10613
10703
|
"aria-expanded": isFullTextOpen,
|
|
10614
10704
|
"aria-controls": contentContainerId
|
|
10615
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
10616
|
-
|
|
10617
|
-
semanticLevel: 3
|
|
10705
|
+
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
10706
|
+
size: "small"
|
|
10618
10707
|
}, title)), !isFullTextOpen && /*#__PURE__*/React__default.createElement(IntroText, null), /*#__PURE__*/React__default.createElement(ContentContainer$5, {
|
|
10619
10708
|
"data-testid": "richcontainer",
|
|
10620
10709
|
ref: readMoreContent,
|
|
@@ -10625,18 +10714,18 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10625
10714
|
}
|
|
10626
10715
|
}, /*#__PURE__*/React__default.createElement(FullTextContainer, {
|
|
10627
10716
|
isVisible: isFullTextOpen
|
|
10628
|
-
}, fullText)), /*#__PURE__*/React__default.createElement(LinkContainer, null, (fullText || isFullTextOpen) && (/*#__PURE__*/React__default.createElement(
|
|
10717
|
+
}, fullText)), /*#__PURE__*/React__default.createElement(LinkContainer, null, (fullText || isFullTextOpen) && (/*#__PURE__*/React__default.createElement(ReadMoreTextLink, {
|
|
10629
10718
|
tabIndex: 0,
|
|
10630
10719
|
role: "button",
|
|
10631
10720
|
onClick: toggleFullText
|
|
10632
10721
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText))));
|
|
10633
10722
|
};
|
|
10634
10723
|
|
|
10635
|
-
var _templateObject$
|
|
10636
|
-
var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$
|
|
10637
|
-
var MenuList = /*#__PURE__*/styled.ul(_templateObject2
|
|
10724
|
+
var _templateObject$1j, _templateObject2$$, _templateObject3$N, _templateObject4$C, _templateObject5$w;
|
|
10725
|
+
var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
10726
|
+
var MenuList = /*#__PURE__*/styled.ul(_templateObject2$$ || (_templateObject2$$ = /*#__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);
|
|
10638
10727
|
var MobileButton = /*#__PURE__*/styled.button(_templateObject3$N || (_templateObject3$N = /*#__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);
|
|
10639
|
-
var MenuItem$1 = /*#__PURE__*/styled.a(_templateObject4$
|
|
10728
|
+
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) {
|
|
10640
10729
|
var isActive = _ref.isActive;
|
|
10641
10730
|
return isActive ? "var(--base-color-" + Colors.MidGrey + ")" : 'none';
|
|
10642
10731
|
}, Colors.MidGrey);
|
|
@@ -10796,14 +10885,14 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
|
|
|
10796
10885
|
});
|
|
10797
10886
|
};
|
|
10798
10887
|
|
|
10799
|
-
var _templateObject$
|
|
10800
|
-
var Container$5 = /*#__PURE__*/styled.div(_templateObject$
|
|
10801
|
-
var Sections = /*#__PURE__*/styled.div(_templateObject2
|
|
10888
|
+
var _templateObject$1k, _templateObject2$10, _templateObject3$O, _templateObject4$D, _templateObject5$x, _templateObject6$o;
|
|
10889
|
+
var Container$5 = /*#__PURE__*/styled.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
10890
|
+
var Sections = /*#__PURE__*/styled.div(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
10802
10891
|
var Section = /*#__PURE__*/styled.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
10803
10892
|
var color = _ref.color;
|
|
10804
10893
|
return "var(--base-color-" + color + ")";
|
|
10805
10894
|
});
|
|
10806
|
-
var BottomLine = /*#__PURE__*/styled.div(_templateObject4$
|
|
10895
|
+
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"])));
|
|
10807
10896
|
var Text = /*#__PURE__*/styled.div(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
10808
10897
|
var color = _ref2.color;
|
|
10809
10898
|
return "var(--base-color-" + color + ")";
|
|
@@ -10890,11 +10979,11 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
10890
10979
|
}, strengthLabel))));
|
|
10891
10980
|
};
|
|
10892
10981
|
|
|
10893
|
-
var _templateObject$
|
|
10894
|
-
var TableContainer = /*#__PURE__*/styled.table(_templateObject$
|
|
10895
|
-
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$
|
|
10982
|
+
var _templateObject$1l, _templateObject2$11, _templateObject3$P, _templateObject4$E, _templateObject5$y, _templateObject6$p, _templateObject7$j, _templateObject8$d;
|
|
10983
|
+
var TableContainer = /*#__PURE__*/styled.table(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
10984
|
+
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
10896
10985
|
var Wrapper$7 = /*#__PURE__*/styled.div(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
10897
|
-
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$
|
|
10986
|
+
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) {
|
|
10898
10987
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
10899
10988
|
}, devices.tablet, devices.mobile);
|
|
10900
10989
|
var TableCell = /*#__PURE__*/styled.td(_templateObject5$y || (_templateObject5$y = /*#__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) {
|
|
@@ -11105,17 +11194,17 @@ var Table = function Table(_ref) {
|
|
|
11105
11194
|
}))));
|
|
11106
11195
|
};
|
|
11107
11196
|
|
|
11108
|
-
var _templateObject$
|
|
11109
|
-
var Wrapper$8 = /*#__PURE__*/styled('div')(_templateObject$
|
|
11197
|
+
var _templateObject$1m, _templateObject2$12, _templateObject3$Q, _templateObject4$F, _templateObject5$z, _templateObject6$q, _templateObject7$k, _templateObject8$e, _templateObject9$8, _templateObject0$7, _templateObject1$5, _templateObject10$4, _templateObject11$3, _templateObject12$3, _templateObject13$2;
|
|
11198
|
+
var Wrapper$8 = /*#__PURE__*/styled('div')(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
|
|
11110
11199
|
var theme = _ref.theme;
|
|
11111
11200
|
return "var(--color-" + theme + ")";
|
|
11112
11201
|
}, function (_ref2) {
|
|
11113
11202
|
var theme = _ref2.theme;
|
|
11114
11203
|
return "var(--color-" + theme + ")";
|
|
11115
11204
|
});
|
|
11116
|
-
var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
11205
|
+
var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
|
|
11117
11206
|
var SignUpTitleWrapper = /*#__PURE__*/styled('div')(_templateObject3$Q || (_templateObject3$Q = /*#__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);
|
|
11118
|
-
var Error = /*#__PURE__*/styled.div(_templateObject4$
|
|
11207
|
+
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"])));
|
|
11119
11208
|
var Form = /*#__PURE__*/styled.form(_templateObject5$z || (_templateObject5$z = /*#__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);
|
|
11120
11209
|
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);
|
|
11121
11210
|
var ServerError = /*#__PURE__*/styled.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--color-base-errorstate);\n"])));
|
|
@@ -11532,12 +11621,12 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
|
|
|
11532
11621
|
}))))));
|
|
11533
11622
|
};
|
|
11534
11623
|
|
|
11535
|
-
var _templateObject$
|
|
11536
|
-
var AnchorBarContainer = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
11624
|
+
var _templateObject$1n, _templateObject2$13, _templateObject4$G, _templateObject5$A;
|
|
11625
|
+
var AnchorBarContainer = /*#__PURE__*/styled(Grid)(_templateObject$1n || (_templateObject$1n = /*#__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) {
|
|
11537
11626
|
var withShadow = _ref.withShadow;
|
|
11538
|
-
return withShadow && css(_templateObject2$
|
|
11627
|
+
return withShadow && css(_templateObject2$13 || (_templateObject2$13 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
|
|
11539
11628
|
}, devices.mobile);
|
|
11540
|
-
var CloseButtonWrapper = /*#__PURE__*/styled.a(_templateObject4$
|
|
11629
|
+
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);
|
|
11541
11630
|
var ContentWrapper$2 = /*#__PURE__*/styled.a(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
11542
11631
|
|
|
11543
11632
|
var defaultGrid = {
|
|
@@ -11596,12 +11685,12 @@ var AnchorBar = function AnchorBar(_ref) {
|
|
|
11596
11685
|
return null;
|
|
11597
11686
|
};
|
|
11598
11687
|
|
|
11599
|
-
var _templateObject$
|
|
11600
|
-
var FocusableTab = /*#__PURE__*/styled(Tab)(_templateObject$
|
|
11688
|
+
var _templateObject$1o, _templateObject2$14;
|
|
11689
|
+
var FocusableTab = /*#__PURE__*/styled(Tab)(_templateObject$1o || (_templateObject$1o = /*#__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) {
|
|
11601
11690
|
var hide = _ref.hide;
|
|
11602
11691
|
return hide && "display: none;";
|
|
11603
11692
|
}, devices.mobileAndTablet);
|
|
11604
|
-
var HiddenBlock = /*#__PURE__*/styled.div(_templateObject2$
|
|
11693
|
+
var HiddenBlock = /*#__PURE__*/styled.div(_templateObject2$14 || (_templateObject2$14 = /*#__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);
|
|
11605
11694
|
|
|
11606
11695
|
/**
|
|
11607
11696
|
* An accessible component which allows Assistive Technology users to move the focus
|
|
@@ -11693,20 +11782,20 @@ var SkipToMain = function SkipToMain(_ref) {
|
|
|
11693
11782
|
}));
|
|
11694
11783
|
};
|
|
11695
11784
|
|
|
11696
|
-
var _templateObject$
|
|
11785
|
+
var _templateObject$1p, _templateObject2$15, _templateObject3$R, _templateObject4$H, _templateObject5$B, _templateObject6$r, _templateObject7$l;
|
|
11697
11786
|
var color = 'primary-black';
|
|
11698
11787
|
var Button$2 = /*#__PURE__*/styled(SecondaryButton).attrs({
|
|
11699
11788
|
borderColor: color,
|
|
11700
11789
|
hoveredColor: color,
|
|
11701
11790
|
pressedColor: color,
|
|
11702
11791
|
textColor: color
|
|
11703
|
-
})(_templateObject$
|
|
11704
|
-
var Container$7 = /*#__PURE__*/styled.div(_templateObject2$
|
|
11792
|
+
})(_templateObject$1p || (_templateObject$1p = /*#__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);
|
|
11793
|
+
var Container$7 = /*#__PURE__*/styled.div(_templateObject2$15 || (_templateObject2$15 = /*#__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);
|
|
11705
11794
|
var Description = /*#__PURE__*/styled(BodyContentTextContainer)(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n margin: 27px 0;\n\n @media ", " {\n margin: 20px 0;\n }\n }\n"])), devices.mobile);
|
|
11706
11795
|
var Heading = /*#__PURE__*/styled(HarmonicHeader).attrs({
|
|
11707
11796
|
serif: true,
|
|
11708
11797
|
size: 'medium'
|
|
11709
|
-
})(_templateObject4$
|
|
11798
|
+
})(_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);
|
|
11710
11799
|
var Intro = /*#__PURE__*/styled(HarmonicSubtitle).attrs({
|
|
11711
11800
|
size: 'large'
|
|
11712
11801
|
})(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-bottom: 27px;\n\n @media ", " {\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
@@ -11740,8 +11829,8 @@ var Paywall = function Paywall(_ref) {
|
|
|
11740
11829
|
}, "Sign in"))));
|
|
11741
11830
|
};
|
|
11742
11831
|
|
|
11743
|
-
var _templateObject$
|
|
11744
|
-
var Wrapper$9 = /*#__PURE__*/styled.div(_templateObject$
|
|
11832
|
+
var _templateObject$1q;
|
|
11833
|
+
var Wrapper$9 = /*#__PURE__*/styled.div(_templateObject$1q || (_templateObject$1q = /*#__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);
|
|
11745
11834
|
|
|
11746
11835
|
var UpsellCards = function UpsellCards(_ref) {
|
|
11747
11836
|
var upsellCards = _ref.upsellCards,
|
|
@@ -11932,14 +12021,14 @@ var Navigation = function Navigation(_ref) {
|
|
|
11932
12021
|
})))))));
|
|
11933
12022
|
};
|
|
11934
12023
|
|
|
11935
|
-
var _templateObject$
|
|
11936
|
-
var FooterSection = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
11937
|
-
var PolicyLinksSection = /*#__PURE__*/styled(GridItem)(_templateObject2$
|
|
12024
|
+
var _templateObject$1r, _templateObject2$16, _templateObject3$S, _templateObject4$I, _templateObject5$C, _templateObject6$s, _templateObject7$m;
|
|
12025
|
+
var FooterSection = /*#__PURE__*/styled(Grid)(_templateObject$1r || (_templateObject$1r = /*#__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);
|
|
12026
|
+
var PolicyLinksSection = /*#__PURE__*/styled(GridItem)(_templateObject2$16 || (_templateObject2$16 = /*#__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);
|
|
11938
12027
|
var SocialAndNewsletterSection = /*#__PURE__*/styled(GridItem)(_templateObject3$S || (_templateObject3$S = /*#__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);
|
|
11939
|
-
var SectionWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
12028
|
+
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);
|
|
11940
12029
|
var LogoAndDescriptionSection = /*#__PURE__*/styled(GridItem)(_templateObject5$C || (_templateObject5$C = /*#__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);
|
|
11941
12030
|
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);
|
|
11942
|
-
var TextLinkWrapper$
|
|
12031
|
+
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"])));
|
|
11943
12032
|
|
|
11944
12033
|
var SPONSOR_IMAGE_SOURCE = 'https://s3.eu-west-1.amazonaws.com/static.roh.org.uk/sponsorlogos/arts-council-england-invert.svg';
|
|
11945
12034
|
var Footer = function Footer(_ref) {
|
|
@@ -11968,14 +12057,14 @@ var Footer = function Footer(_ref) {
|
|
|
11968
12057
|
"data-testid": "contact-newsletter"
|
|
11969
12058
|
}, /*#__PURE__*/React__default.createElement(SectionWrapper, null, /*#__PURE__*/React__default.createElement(SocialLinks, {
|
|
11970
12059
|
items: rawSocialMediaLinks
|
|
11971
|
-
}), /*#__PURE__*/React__default.createElement(TextLinkWrapper$
|
|
12060
|
+
}), /*#__PURE__*/React__default.createElement(TextLinkWrapper$5, {
|
|
11972
12061
|
href: contact.href,
|
|
11973
12062
|
"aria-label": contact.title,
|
|
11974
12063
|
tabIndex: isMobile ? 2 : 0
|
|
11975
12064
|
}, contact.title)), /*#__PURE__*/React__default.createElement(SectionWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
11976
12065
|
size: "large",
|
|
11977
12066
|
color: "white"
|
|
11978
|
-
}, newsletter.text), /*#__PURE__*/React__default.createElement(TextLinkWrapper$
|
|
12067
|
+
}, newsletter.text), /*#__PURE__*/React__default.createElement(TextLinkWrapper$5, {
|
|
11979
12068
|
href: newsletter.link.href,
|
|
11980
12069
|
"data-roh": newsletter.link.dataRoh,
|
|
11981
12070
|
"aria-label": newsletter.link.title,
|
|
@@ -11997,17 +12086,17 @@ var Footer = function Footer(_ref) {
|
|
|
11997
12086
|
}, additionalInfo))));
|
|
11998
12087
|
};
|
|
11999
12088
|
|
|
12000
|
-
var _templateObject$
|
|
12089
|
+
var _templateObject$1s, _templateObject2$17, _templateObject3$T, _templateObject4$J, _templateObject5$D, _templateObject8$f, _templateObject9$9, _templateObject0$8;
|
|
12001
12090
|
var LIST_ITEM_GAP = 32;
|
|
12002
|
-
var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
12091
|
+
var AnchorTabbarWrapper = /*#__PURE__*/styled.div(_templateObject$1s || (_templateObject$1s = /*#__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) {
|
|
12003
12092
|
var bottomBorder = _ref.bottomBorder;
|
|
12004
12093
|
return bottomBorder ? '1px solid var(--color-base-light-grey)' : 'none';
|
|
12005
12094
|
}, zIndexes.anchor, function (_ref2) {
|
|
12006
12095
|
var withShadow = _ref2.withShadow;
|
|
12007
|
-
return withShadow && css(_templateObject2$
|
|
12096
|
+
return withShadow && css(_templateObject2$17 || (_templateObject2$17 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
|
|
12008
12097
|
});
|
|
12009
12098
|
var TabsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
|
|
12010
|
-
var TabsWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
12099
|
+
var TabsWrapper = /*#__PURE__*/styled.div(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
12011
12100
|
var TabsList = /*#__PURE__*/styled.ul(_templateObject5$D || (_templateObject5$D = /*#__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) {
|
|
12012
12101
|
var tabsOverflow = _ref3.tabsOverflow;
|
|
12013
12102
|
return tabsOverflow ? 'calc(100% - 74px)' : '100%';
|
|
@@ -12034,7 +12123,7 @@ var ArrowWrapper = /*#__PURE__*/styled.div(_templateObject0$8 || (_templateObjec
|
|
|
12034
12123
|
return disabled ? 'var(--color-state-disabled)' : 'var(--button-anchor-tab-color)';
|
|
12035
12124
|
});
|
|
12036
12125
|
|
|
12037
|
-
var _excluded$
|
|
12126
|
+
var _excluded$s = ["id", "text"];
|
|
12038
12127
|
var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
12039
12128
|
var tabs = _ref.tabs,
|
|
12040
12129
|
onTabClick = _ref.onTabClick,
|
|
@@ -12245,7 +12334,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
12245
12334
|
}, tabs.map(function (_ref4) {
|
|
12246
12335
|
var id = _ref4.id,
|
|
12247
12336
|
text = _ref4.text,
|
|
12248
|
-
rest = _objectWithoutPropertiesLoose(_ref4, _excluded$
|
|
12337
|
+
rest = _objectWithoutPropertiesLoose(_ref4, _excluded$s);
|
|
12249
12338
|
return /*#__PURE__*/React__default.createElement("li", {
|
|
12250
12339
|
key: id
|
|
12251
12340
|
}, /*#__PURE__*/React__default.createElement(TabLink, Object.assign({
|
|
@@ -12278,17 +12367,17 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
12278
12367
|
})))) : null))));
|
|
12279
12368
|
};
|
|
12280
12369
|
|
|
12281
|
-
var _templateObject$
|
|
12282
|
-
var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
12370
|
+
var _templateObject$1t, _templateObject2$18, _templateObject3$U, _templateObject4$K, _templateObject6$t, _templateObject7$n, _templateObject8$g, _templateObject9$a, _templateObject0$9;
|
|
12371
|
+
var TitleCTAGridWrapper = /*#__PURE__*/styled.div(_templateObject$1t || (_templateObject$1t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
12283
12372
|
var sticky = _ref.sticky;
|
|
12284
12373
|
return sticky ? 'sticky' : 'initial';
|
|
12285
12374
|
}, zIndexes.anchor);
|
|
12286
|
-
var TitleCTAGrid = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
12375
|
+
var TitleCTAGrid = /*#__PURE__*/styled(Grid)(_templateObject2$18 || (_templateObject2$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: solid 2px var(--base-color-light-grey);\n"])));
|
|
12287
12376
|
var TitleCTAGridItem = /*#__PURE__*/styled.div(_templateObject3$U || (_templateObject3$U = /*#__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) {
|
|
12288
12377
|
var title = _ref2.title;
|
|
12289
12378
|
return title ? 'row' : 'row-reverse';
|
|
12290
12379
|
}, devices.tablet, devices.mobile);
|
|
12291
|
-
var AnchorTitle = /*#__PURE__*/styled.div(_templateObject4$
|
|
12380
|
+
var AnchorTitle = /*#__PURE__*/styled.div(_templateObject4$K || (_templateObject4$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n min-height: var(--button-height);\n\n h5 {\n padding: 0;\n margin: 0;\n }\n\n @media ", " {\n & {\n min-height: 50px;\n }\n }\n"])), devices.mobile);
|
|
12292
12381
|
var ButtonsDesktopWrapper = /*#__PURE__*/styled.div(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n\n @media ", " {\n display: none;\n }\n\n a {\n width: max-content;\n }\n"])), devices.mobile);
|
|
12293
12382
|
var ButtonsMobileWrapper = /*#__PURE__*/styled.div(_templateObject7$n || (_templateObject7$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: block;\n }\n }\n"])), devices.mobile);
|
|
12294
12383
|
var PrimaryButtonReverse = /*#__PURE__*/styled(PrimaryButton)(_templateObject8$g || (_templateObject8$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n"])), function (_ref3) {
|
|
@@ -12307,7 +12396,7 @@ var PrimaryButtonReverse = /*#__PURE__*/styled(PrimaryButton)(_templateObject8$g
|
|
|
12307
12396
|
var MessageWrapper$1 = /*#__PURE__*/styled.div(_templateObject9$a || (_templateObject9$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-right: var(--grid-outer-margin);\n height: var(--button-height);\n\n h6 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n margin-right: var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
12308
12397
|
var MessageWrapperMobile = /*#__PURE__*/styled.div(_templateObject0$9 || (_templateObject0$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h6 {\n margin: 0;\n padding: 0;\n }\n display: none;\n\n @media ", " {\n & {\n display: flex;\n align-items: center;\n margin-left: var(--grid-margin);\n padding: 12px 0;\n }\n }\n"])), devices.mobile);
|
|
12309
12398
|
|
|
12310
|
-
var _excluded$
|
|
12399
|
+
var _excluded$t = ["text"],
|
|
12311
12400
|
_excluded2$4 = ["text"];
|
|
12312
12401
|
var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
12313
12402
|
var title = _ref.title,
|
|
@@ -12317,7 +12406,7 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
|
12317
12406
|
message = _ref.message;
|
|
12318
12407
|
var _ref2 = (links == null ? void 0 : links[0]) || {},
|
|
12319
12408
|
primaryButtonText = _ref2.text,
|
|
12320
|
-
primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
12409
|
+
primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, _excluded$t);
|
|
12321
12410
|
var _ref3 = (links == null ? void 0 : links[1]) || {},
|
|
12322
12411
|
secondaryButtonText = _ref3.text,
|
|
12323
12412
|
secondaryButtonProps = _objectWithoutPropertiesLoose(_ref3, _excluded2$4);
|
|
@@ -12338,11 +12427,11 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
|
12338
12427
|
}, message))));
|
|
12339
12428
|
};
|
|
12340
12429
|
|
|
12341
|
-
var _templateObject$
|
|
12342
|
-
var UpsellBorderBox = /*#__PURE__*/styled.div(_templateObject$
|
|
12343
|
-
var TitleContent = /*#__PURE__*/styled(HarmonicHeader)(_templateObject2$
|
|
12430
|
+
var _templateObject$1u, _templateObject2$19, _templateObject3$V, _templateObject4$L;
|
|
12431
|
+
var UpsellBorderBox = /*#__PURE__*/styled.div(_templateObject$1u || (_templateObject$1u = /*#__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);
|
|
12432
|
+
var TitleContent = /*#__PURE__*/styled(HarmonicHeader)(_templateObject2$19 || (_templateObject2$19 = /*#__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);
|
|
12344
12433
|
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject3$V || (_templateObject3$V = /*#__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);
|
|
12345
|
-
var TextContent = /*#__PURE__*/styled(BodyContent)(_templateObject4$
|
|
12434
|
+
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);
|
|
12346
12435
|
|
|
12347
12436
|
var UpsellSection = function UpsellSection(_ref) {
|
|
12348
12437
|
var title = _ref.title,
|
|
@@ -12387,9 +12476,9 @@ var UpsellSection = function UpsellSection(_ref) {
|
|
|
12387
12476
|
})))));
|
|
12388
12477
|
};
|
|
12389
12478
|
|
|
12390
|
-
var _templateObject$
|
|
12391
|
-
var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
12392
|
-
var StickyBarGrid = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
12479
|
+
var _templateObject$1v, _templateObject2$1a;
|
|
12480
|
+
var StickyBarWrapper = /*#__PURE__*/styled.div(_templateObject$1v || (_templateObject$1v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--color-base-white);\n"])), zIndexes.anchor);
|
|
12481
|
+
var StickyBarGrid = /*#__PURE__*/styled(Grid)(_templateObject2$1a || (_templateObject2$1a = /*#__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) {
|
|
12393
12482
|
var bottomBorder = _ref.bottomBorder;
|
|
12394
12483
|
return bottomBorder && 'border-bottom: 1px solid var(--color-base-light-grey);';
|
|
12395
12484
|
}, devices.mobileAndTablet, devices.mobile);
|
|
@@ -12420,13 +12509,13 @@ var StickyBar = function StickyBar(_ref) {
|
|
|
12420
12509
|
}, children)));
|
|
12421
12510
|
};
|
|
12422
12511
|
|
|
12423
|
-
var _templateObject$
|
|
12424
|
-
var InnerModal = /*#__PURE__*/styled.div(_templateObject$
|
|
12425
|
-
var CloseButton = /*#__PURE__*/styled.button(_templateObject2$
|
|
12512
|
+
var _templateObject$1w, _templateObject2$1b, _templateObject3$W, _templateObject4$M;
|
|
12513
|
+
var InnerModal = /*#__PURE__*/styled.div(_templateObject$1w || (_templateObject$1w = /*#__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);
|
|
12514
|
+
var CloseButton = /*#__PURE__*/styled.button(_templateObject2$1b || (_templateObject2$1b = /*#__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);
|
|
12426
12515
|
var ContentWrapper$3 = /*#__PURE__*/styled.div(_templateObject3$W || (_templateObject3$W = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
12427
|
-
var Overlay = /*#__PURE__*/styled(Grid)(_templateObject4$
|
|
12516
|
+
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"])));
|
|
12428
12517
|
|
|
12429
|
-
var _excluded$
|
|
12518
|
+
var _excluded$u = ["isOpen", "setIsOpen", "children", "appElementId", "closeButtonAriaLabel"];
|
|
12430
12519
|
var MAX_Z_INDEX = 9999999999;
|
|
12431
12520
|
if (Modal.defaultStyles.content) {
|
|
12432
12521
|
Modal.defaultStyles.content.position = 'static';
|
|
@@ -12502,7 +12591,7 @@ var ModalWindow = function ModalWindow(_ref) {
|
|
|
12502
12591
|
appElementId = _ref.appElementId,
|
|
12503
12592
|
_ref$closeButtonAriaL = _ref.closeButtonAriaLabel,
|
|
12504
12593
|
closeButtonAriaLabel = _ref$closeButtonAriaL === void 0 ? 'Close modal window' : _ref$closeButtonAriaL,
|
|
12505
|
-
modalProps = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
12594
|
+
modalProps = _objectWithoutPropertiesLoose(_ref, _excluded$u);
|
|
12506
12595
|
var isMobile = useMobile();
|
|
12507
12596
|
var customStyles = {
|
|
12508
12597
|
overlay: {
|
|
@@ -12631,21 +12720,21 @@ var getCardSlideMobileStyles = function getCardSlideMobileStyles(type) {
|
|
|
12631
12720
|
return "\n width: " + ("calc((" + columnsPerSlide + " * " + gridColumnWidth + ") + (" + gapsPerSlide + " * " + GRID_COLUMN_GAP + "))") + ";\n margin-right: " + ("calc(" + gridColumnWidth + " + (" + GRID_COLUMN_GAP + " * 2))") + ";\n ";
|
|
12632
12721
|
};
|
|
12633
12722
|
|
|
12634
|
-
var _templateObject$
|
|
12635
|
-
var ImageCarouselWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
12723
|
+
var _templateObject$1x, _templateObject2$1c, _templateObject3$X, _templateObject4$N, _templateObject5$E, _templateObject6$u, _templateObject7$o, _templateObject8$h, _templateObject9$b;
|
|
12724
|
+
var ImageCarouselWrapper = /*#__PURE__*/styled.div(_templateObject$1x || (_templateObject$1x = /*#__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) {
|
|
12636
12725
|
var imagesHeightDesktop = _ref.imagesHeightDesktop;
|
|
12637
12726
|
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 }";
|
|
12638
12727
|
}, devices.mobile, function (_ref2) {
|
|
12639
12728
|
var imagesHeightDevice = _ref2.imagesHeightDevice;
|
|
12640
12729
|
return "&&& {\n .swipe-slide > figure {\n > div {\n height: " + imagesHeightDevice + "px;\n }\n }\n }";
|
|
12641
12730
|
});
|
|
12642
|
-
var CardsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
12731
|
+
var CardsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject2$1c || (_templateObject2$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n}"])), function (_ref3) {
|
|
12643
12732
|
var type = _ref3.type,
|
|
12644
12733
|
isActive = _ref3.isActive;
|
|
12645
12734
|
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 ";
|
|
12646
12735
|
});
|
|
12647
12736
|
var TitleButtonsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$X || (_templateObject3$X = /*#__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);
|
|
12648
|
-
var CarouselInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
12737
|
+
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"])));
|
|
12649
12738
|
var TitleWrapper$5 = /*#__PURE__*/styled.div(_templateObject5$E || (_templateObject5$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref4) {
|
|
12650
12739
|
var isDescriptionPresent = _ref4.isDescriptionPresent;
|
|
12651
12740
|
return isDescriptionPresent && 'margin: 20px 0';
|
|
@@ -12923,11 +13012,11 @@ var Carousel = function Carousel(_ref) {
|
|
|
12923
13012
|
}, children))));
|
|
12924
13013
|
};
|
|
12925
13014
|
|
|
12926
|
-
var _templateObject$
|
|
12927
|
-
var HighlightsGrid$1 = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
12928
|
-
var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
13015
|
+
var _templateObject$1y, _templateObject2$1d, _templateObject3$Y, _templateObject4$O, _templateObject5$F, _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;
|
|
13016
|
+
var HighlightsGrid$1 = /*#__PURE__*/styled(Grid)(_templateObject$1y || (_templateObject$1y = /*#__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);
|
|
13017
|
+
var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$1d || (_templateObject2$1d = /*#__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);
|
|
12929
13018
|
var HeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$Y || (_templateObject3$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
|
|
12930
|
-
var InfoWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$
|
|
13019
|
+
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);
|
|
12931
13020
|
var InfoLogoWrapper = /*#__PURE__*/styled.div(_templateObject5$F || (_templateObject5$F = /*#__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);
|
|
12932
13021
|
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"])));
|
|
12933
13022
|
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);
|
|
@@ -12946,7 +13035,7 @@ var VideoWithControlsWrapper = /*#__PURE__*/styled.div(_templateObject15$1 || (_
|
|
|
12946
13035
|
}, devices.mobile);
|
|
12947
13036
|
var ProgressContainer$1 = /*#__PURE__*/styled.div(_templateObject16$1 || (_templateObject16$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n\n p {\n margin-bottom: 16px;\n }\n\n @media ", " {\n margin-top: 20px;\n\n p {\n margin-bottom: 12px;\n }\n }\n"])), devices.mobileAndTablet);
|
|
12948
13037
|
|
|
12949
|
-
var _excluded$
|
|
13038
|
+
var _excluded$v = ["text"],
|
|
12950
13039
|
_excluded2$5 = ["text"];
|
|
12951
13040
|
var _buttonTypeToButton$2;
|
|
12952
13041
|
var buttonTypeToButton$2 = (_buttonTypeToButton$2 = {}, _buttonTypeToButton$2[ButtonType.Primary] = PrimaryButton, _buttonTypeToButton$2[ButtonType.Secondary] = SecondaryButton, _buttonTypeToButton$2[ButtonType.Tertiary] = TertiaryButton, _buttonTypeToButton$2);
|
|
@@ -12957,7 +13046,7 @@ var Buttons = function Buttons(_ref) {
|
|
|
12957
13046
|
var _ref2 = firstButton || {},
|
|
12958
13047
|
_ref2$text = _ref2.text,
|
|
12959
13048
|
firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
12960
|
-
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
13049
|
+
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$v);
|
|
12961
13050
|
var secondButton = links == null ? void 0 : links[1];
|
|
12962
13051
|
var _ref3 = secondButton || {},
|
|
12963
13052
|
_ref3$text = _ref3.text,
|
|
@@ -13200,11 +13289,11 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
|
|
|
13200
13289
|
})));
|
|
13201
13290
|
};
|
|
13202
13291
|
|
|
13203
|
-
var _excluded$
|
|
13292
|
+
var _excluded$w = ["logo", "slides"];
|
|
13204
13293
|
var HighlightsCinema = function HighlightsCinema(_ref) {
|
|
13205
13294
|
var logo = _ref.logo,
|
|
13206
13295
|
slides = _ref.slides,
|
|
13207
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
13296
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$w);
|
|
13208
13297
|
var slidesWithLinks = slides.map(function (slide) {
|
|
13209
13298
|
var links = processSlideLinks(slide.links);
|
|
13210
13299
|
return _extends({}, slide, {
|
|
@@ -13221,10 +13310,10 @@ var HighlightsCinema = function HighlightsCinema(_ref) {
|
|
|
13221
13310
|
})));
|
|
13222
13311
|
};
|
|
13223
13312
|
|
|
13224
|
-
var _excluded$
|
|
13313
|
+
var _excluded$x = ["slides"];
|
|
13225
13314
|
var HighlightsCore = function HighlightsCore(_ref) {
|
|
13226
13315
|
var slides = _ref.slides,
|
|
13227
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
13316
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$x);
|
|
13228
13317
|
var slidesWithLinks = slides.map(function (slide) {
|
|
13229
13318
|
var links = processSlideLinks(slide.links);
|
|
13230
13319
|
return _extends({}, slide, {
|
|
@@ -13238,11 +13327,11 @@ var HighlightsCore = function HighlightsCore(_ref) {
|
|
|
13238
13327
|
})));
|
|
13239
13328
|
};
|
|
13240
13329
|
|
|
13241
|
-
var _excluded$
|
|
13330
|
+
var _excluded$y = ["logo", "slides"];
|
|
13242
13331
|
var HighlightsStream = function HighlightsStream(_ref) {
|
|
13243
13332
|
var logo = _ref.logo,
|
|
13244
13333
|
slides = _ref.slides,
|
|
13245
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
13334
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$y);
|
|
13246
13335
|
var slidesWithLinks = slides.map(function (slide) {
|
|
13247
13336
|
var links = processSlideLinks(slide.links);
|
|
13248
13337
|
return _extends({}, slide, {
|
|
@@ -13259,8 +13348,8 @@ var HighlightsStream = function HighlightsStream(_ref) {
|
|
|
13259
13348
|
})));
|
|
13260
13349
|
};
|
|
13261
13350
|
|
|
13262
|
-
var _templateObject$
|
|
13263
|
-
var CarouselWrapper$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
13351
|
+
var _templateObject$1z, _templateObject3$Z;
|
|
13352
|
+
var CarouselWrapper$1 = /*#__PURE__*/styled.div(_templateObject$1z || (_templateObject$1z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n\n .swipe-slide {\n width: 100%;\n }\n"])));
|
|
13264
13353
|
var ButtonsWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$Z || (_templateObject3$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
|
|
13265
13354
|
|
|
13266
13355
|
var MinimalCarousel = function MinimalCarousel(_ref) {
|
|
@@ -13856,8 +13945,8 @@ var Theme = function Theme(_ref) {
|
|
|
13856
13945
|
}, children);
|
|
13857
13946
|
};
|
|
13858
13947
|
|
|
13859
|
-
var _templateObject$
|
|
13860
|
-
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1z || (_templateObject$1z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", ";\n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n\n --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n --harmonic-text-link-underline-offset: 4px;\n --harmonic-text-transform-navigation: capitalize;\n --harmonic-font-size-navigation: 19px;\n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n\n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n }\n\n @media ", " {\n\n }\n\n @media ", " {\n\n }\n }\n"])), function (_ref) {
|
|
13948
|
+
var _templateObject$1A;
|
|
13949
|
+
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) {
|
|
13861
13950
|
var theme = _ref.theme;
|
|
13862
13951
|
return theme.colors.primary;
|
|
13863
13952
|
}, function (_ref2) {
|
|
@@ -14804,5 +14893,5 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1z || (_templa
|
|
|
14804
14893
|
return theme.footer.tablet.paddingBottom;
|
|
14805
14894
|
}, devices.desktop, devices.largeDesktop);
|
|
14806
14895
|
|
|
14807
|
-
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, 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 };
|
|
14896
|
+
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 };
|
|
14808
14897
|
//# sourceMappingURL=harmonic.esm.js.map
|