@royaloperahouse/harmonic 0.18.3-b → 0.18.3-d
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/atoms/Dropdown/Dropdown.d.ts +1 -1
- package/dist/components/atoms/Icons/SvgIcons/index.d.ts +0 -2
- package/dist/components/atoms/Tab/Tab.d.ts +1 -1
- package/dist/components/molecules/Select2/Select2.d.ts +1 -1
- package/dist/components/organisms/Carousels/HighlightsCarousel/helper.d.ts +1 -1
- package/dist/harmonic.cjs.development.css +0 -319
- package/dist/harmonic.cjs.development.js +86 -139
- 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 +94 -150
- package/dist/harmonic.esm.js.map +1 -1
- package/dist/styles/HarmonicThemeProvider/HarmonicThemeProvider.d.ts +0 -1
- package/dist/types/types.d.ts +1 -9
- package/package.json +4 -3
- package/dist/components/atoms/Icons/SvgIcons/Access/Captioned.svg.d.ts +0 -4
- package/dist/components/atoms/Icons/SvgIcons/Access/FamilyFriendly.svg.d.ts +0 -4
package/dist/harmonic.esm.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React__default, { createElement, memo, useCallback, useRef, useImperativeHandle, useMemo, useEffect, useState, forwardRef, cloneElement, useLayoutEffect } from 'react';
|
|
2
2
|
import styled, { css, ThemeProvider, createGlobalStyle } from 'styled-components';
|
|
3
|
-
import
|
|
3
|
+
import moment from 'moment';
|
|
4
4
|
import { renderToString } from 'react-dom/server';
|
|
5
5
|
import Select$1, { components } from 'react-select';
|
|
6
6
|
import Select$2 from 'react-select/async';
|
|
@@ -2175,55 +2175,6 @@ var OpenCaptions = (function (_ref) {
|
|
|
2175
2175
|
}));
|
|
2176
2176
|
});
|
|
2177
2177
|
|
|
2178
|
-
var Captioned = (function (_ref) {
|
|
2179
|
-
var _ref$color = _ref.color,
|
|
2180
|
-
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
2181
|
-
ariaLabel = _ref.ariaLabel;
|
|
2182
|
-
return /*#__PURE__*/createElement("svg", {
|
|
2183
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
2184
|
-
width: "100%",
|
|
2185
|
-
height: "100%",
|
|
2186
|
-
viewBox: "0 0 25 25",
|
|
2187
|
-
fill: "none",
|
|
2188
|
-
"aria-label": ariaLabel
|
|
2189
|
-
}, /*#__PURE__*/createElement("path", {
|
|
2190
|
-
d: "M21 5V19H3V5H21ZM22 4H2V20H22V4Z",
|
|
2191
|
-
fill: color
|
|
2192
|
-
}), /*#__PURE__*/createElement("path", {
|
|
2193
|
-
d: "M9.23998 12.89C9.23998 13.43 9.12999 13.91 8.87999 14.29C8.53999 14.83 7.92999 15.12 7.17999 15.12C6.33999 15.12 5.63998 14.71 5.23998 13.91C4.98998 13.41 4.85999 12.76 4.85999 12.01C4.85999 10.12 5.68999 8.91 7.18999 8.91C8.28999 8.91 9.06998 9.71 9.06998 10.85C9.06998 10.94 9.06999 11.14 9.03999 11.25L8.06998 11.29C8.08998 11.21 8.09999 11.06 8.09999 10.92C8.09999 10.31 7.79999 9.8 7.18999 9.8C6.35999 9.8 5.92999 10.68 5.92999 12.01C5.92999 12.53 5.98999 12.98 6.11999 13.34C6.28999 13.82 6.59999 14.22 7.18999 14.22C7.93999 14.22 8.30999 13.71 8.34999 12.69L9.24999 12.74V12.88L9.23998 12.89Z",
|
|
2194
|
-
fill: color
|
|
2195
|
-
}), /*#__PURE__*/createElement("path", {
|
|
2196
|
-
d: "M13.31 15L12.94 13.77H10.99L10.62 15H9.59998L11.47 9.05H12.49L14.36 15H13.3H13.31ZM12.27 11.56C12.16 11.21 12.07 10.91 11.97 10.52C11.86 10.92 11.77 11.25 11.67 11.56L11.25 12.92H12.68L12.26 11.56H12.27Z",
|
|
2197
|
-
fill: color
|
|
2198
|
-
}), /*#__PURE__*/createElement("path", {
|
|
2199
|
-
d: "M15.17 15V9.05H17.27C17.88 9.05 18.27 9.21 18.56 9.47C18.93 9.8 19.12 10.29 19.12 10.83C19.12 11.37 18.92 11.86 18.56 12.19C18.27 12.45 17.88 12.61 17.27 12.61H16.23V14.99H15.17V15ZM17.11 11.73C17.52 11.73 17.71 11.64 17.84 11.48C17.98 11.32 18.06 11.09 18.06 10.83C18.06 10.57 17.98 10.35 17.84 10.18C17.71 10.03 17.52 9.93 17.11 9.93H16.23V11.72H17.11V11.73Z",
|
|
2200
|
-
fill: color
|
|
2201
|
-
}));
|
|
2202
|
-
});
|
|
2203
|
-
|
|
2204
|
-
var FamilyFriendly = (function (_ref) {
|
|
2205
|
-
var _ref$color = _ref.color,
|
|
2206
|
-
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
2207
|
-
ariaLabel = _ref.ariaLabel;
|
|
2208
|
-
return /*#__PURE__*/createElement("svg", {
|
|
2209
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
2210
|
-
width: "100%",
|
|
2211
|
-
height: "100%",
|
|
2212
|
-
viewBox: "0 0 25 25",
|
|
2213
|
-
fill: "none",
|
|
2214
|
-
"aria-label": ariaLabel
|
|
2215
|
-
}, /*#__PURE__*/createElement("path", {
|
|
2216
|
-
d: "M21 5V19H3V5H21ZM22 4H2V20H22V4Z",
|
|
2217
|
-
fill: color
|
|
2218
|
-
}), /*#__PURE__*/createElement("path", {
|
|
2219
|
-
d: "M8.21 15V9.04999H11.57V9.93999H9.28V11.64H10.89V12.49H9.28V15H8.22H8.21Z",
|
|
2220
|
-
fill: color
|
|
2221
|
-
}), /*#__PURE__*/createElement("path", {
|
|
2222
|
-
d: "M12.48 15V9.04999H15.84V9.93999H13.55V11.64H15.16V12.49H13.55V15H12.49H12.48Z",
|
|
2223
|
-
fill: color
|
|
2224
|
-
}));
|
|
2225
|
-
});
|
|
2226
|
-
|
|
2227
2178
|
var Forward10 = (function (_ref) {
|
|
2228
2179
|
var _ref$color = _ref.color,
|
|
2229
2180
|
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
@@ -2529,7 +2480,6 @@ var IconLibrary = {
|
|
|
2529
2480
|
Clips: Clips,
|
|
2530
2481
|
Clock: Clock,
|
|
2531
2482
|
Close: Close,
|
|
2532
|
-
Captioned: Captioned,
|
|
2533
2483
|
ClosedCaptions: ClosedCaptions,
|
|
2534
2484
|
Confirm: Confirm,
|
|
2535
2485
|
CreditCard: CreditCard,
|
|
@@ -2542,7 +2492,6 @@ var IconLibrary = {
|
|
|
2542
2492
|
Expand12px: Expand12px,
|
|
2543
2493
|
ExternalLink: ExternalLink,
|
|
2544
2494
|
Facebook: Facebook,
|
|
2545
|
-
FamilyFriendly: FamilyFriendly,
|
|
2546
2495
|
Favourite: Favourite,
|
|
2547
2496
|
FavouriteFull: FavouriteFull,
|
|
2548
2497
|
Filter: Filter,
|
|
@@ -3899,7 +3848,6 @@ var Tab = function Tab(_ref) {
|
|
|
3899
3848
|
className = _ref.className,
|
|
3900
3849
|
role = _ref.role,
|
|
3901
3850
|
ariaLabel = _ref.ariaLabel,
|
|
3902
|
-
tabLinkId = _ref.tabLinkId,
|
|
3903
3851
|
color = _ref.color,
|
|
3904
3852
|
dataTestId = _ref.dataTestId,
|
|
3905
3853
|
isOpen = _ref.isOpen;
|
|
@@ -3934,9 +3882,8 @@ var Tab = function Tab(_ref) {
|
|
|
3934
3882
|
className: className,
|
|
3935
3883
|
"data-testid": dataTestId
|
|
3936
3884
|
}, /*#__PURE__*/React__default.createElement(TabText, {
|
|
3937
|
-
id: tabLinkId,
|
|
3938
|
-
trimText: trimText,
|
|
3939
3885
|
color: color,
|
|
3886
|
+
trimText: trimText,
|
|
3940
3887
|
withTextInMobile: withTextInMobile,
|
|
3941
3888
|
"aria-hidden": "true"
|
|
3942
3889
|
}, title), withIcon !== 'none' && /*#__PURE__*/React__default.createElement(Icon, {
|
|
@@ -4622,31 +4569,6 @@ var TimerValueSeparator = /*#__PURE__*/styled.div(_templateObject6$3 || (_templa
|
|
|
4622
4569
|
var TimerValueWrapper = /*#__PURE__*/styled.div(_templateObject7$1 || (_templateObject7$1 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
4623
4570
|
var TimerValue = /*#__PURE__*/styled.div(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
4624
4571
|
|
|
4625
|
-
var pad = function pad(num) {
|
|
4626
|
-
return String(num || 0).padStart(2, '0');
|
|
4627
|
-
};
|
|
4628
|
-
var renderTimerValue = function renderTimerValue(value, label, separator) {
|
|
4629
|
-
if (separator === void 0) {
|
|
4630
|
-
separator = true;
|
|
4631
|
-
}
|
|
4632
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(TimerValueWrapper, null, /*#__PURE__*/React__default.createElement(TimerValue, {
|
|
4633
|
-
className: "harmonic-timer-value"
|
|
4634
|
-
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
4635
|
-
color: "inherit",
|
|
4636
|
-
hierarchy: "h3",
|
|
4637
|
-
size: "medium",
|
|
4638
|
-
"data-testid": label
|
|
4639
|
-
}, value)), /*#__PURE__*/React__default.createElement(TimerLabel, {
|
|
4640
|
-
className: "harmonic-timer-label"
|
|
4641
|
-
}, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
|
|
4642
|
-
color: "inherit",
|
|
4643
|
-
size: "large"
|
|
4644
|
-
}, label))), separator && (/*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
4645
|
-
color: "inherit",
|
|
4646
|
-
hierarchy: "h3",
|
|
4647
|
-
size: "medium"
|
|
4648
|
-
}, /*#__PURE__*/React__default.createElement(TimerValueSeparator, null, ":"))));
|
|
4649
|
-
};
|
|
4650
4572
|
var Timer = function Timer(_ref) {
|
|
4651
4573
|
var endDate = _ref.endDate,
|
|
4652
4574
|
title = _ref.title,
|
|
@@ -4655,22 +4577,43 @@ var Timer = function Timer(_ref) {
|
|
|
4655
4577
|
bottomLine = _ref$bottomLine === void 0 ? true : _ref$bottomLine,
|
|
4656
4578
|
_ref$color = _ref.color,
|
|
4657
4579
|
color = _ref$color === void 0 ? ThemeColor['base-black'] : _ref$color;
|
|
4658
|
-
var
|
|
4659
|
-
seconds =
|
|
4660
|
-
setSeconds =
|
|
4661
|
-
var
|
|
4662
|
-
minutes =
|
|
4663
|
-
setMinutes =
|
|
4664
|
-
var
|
|
4665
|
-
hours =
|
|
4666
|
-
setHours =
|
|
4667
|
-
var
|
|
4668
|
-
days =
|
|
4669
|
-
setDays =
|
|
4670
|
-
var
|
|
4671
|
-
isEndDateReached =
|
|
4672
|
-
setIsEndDateReached =
|
|
4673
|
-
|
|
4580
|
+
var _React$useState = React__default.useState('00'),
|
|
4581
|
+
seconds = _React$useState[0],
|
|
4582
|
+
setSeconds = _React$useState[1];
|
|
4583
|
+
var _React$useState2 = React__default.useState('00'),
|
|
4584
|
+
minutes = _React$useState2[0],
|
|
4585
|
+
setMinutes = _React$useState2[1];
|
|
4586
|
+
var _React$useState3 = React__default.useState('00'),
|
|
4587
|
+
hours = _React$useState3[0],
|
|
4588
|
+
setHours = _React$useState3[1];
|
|
4589
|
+
var _React$useState4 = React__default.useState('00'),
|
|
4590
|
+
days = _React$useState4[0],
|
|
4591
|
+
setDays = _React$useState4[1];
|
|
4592
|
+
var _React$useState5 = React__default.useState(false),
|
|
4593
|
+
isEndDateReached = _React$useState5[0],
|
|
4594
|
+
setIsEndDateReached = _React$useState5[1];
|
|
4595
|
+
var renderTimerValue = function renderTimerValue(value, label, separator) {
|
|
4596
|
+
if (separator === void 0) {
|
|
4597
|
+
separator = true;
|
|
4598
|
+
}
|
|
4599
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(TimerValueWrapper, null, /*#__PURE__*/React__default.createElement(TimerValue, {
|
|
4600
|
+
className: "harmonic-timer-value"
|
|
4601
|
+
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
4602
|
+
color: "inherit",
|
|
4603
|
+
hierarchy: "h3",
|
|
4604
|
+
size: "medium"
|
|
4605
|
+
}, value)), /*#__PURE__*/React__default.createElement(TimerLabel, {
|
|
4606
|
+
className: "harmonic-timer-label"
|
|
4607
|
+
}, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
|
|
4608
|
+
color: "inherit",
|
|
4609
|
+
size: "large"
|
|
4610
|
+
}, label))), separator && (/*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
4611
|
+
color: "inherit",
|
|
4612
|
+
hierarchy: "h3",
|
|
4613
|
+
size: "medium"
|
|
4614
|
+
}, /*#__PURE__*/React__default.createElement(TimerValueSeparator, null, ":"))));
|
|
4615
|
+
};
|
|
4616
|
+
React__default.useEffect(function () {
|
|
4674
4617
|
if (isEndDateReached) return undefined;
|
|
4675
4618
|
// We use this to set values for the timer immediately
|
|
4676
4619
|
var setIntervalAndExecute = function setIntervalAndExecute(fn, delay) {
|
|
@@ -4678,21 +4621,19 @@ var Timer = function Timer(_ref) {
|
|
|
4678
4621
|
return setInterval(fn, delay);
|
|
4679
4622
|
};
|
|
4680
4623
|
var updateValues = function updateValues() {
|
|
4681
|
-
var futureDate =
|
|
4682
|
-
var nowDate =
|
|
4683
|
-
var
|
|
4684
|
-
|
|
4624
|
+
var futureDate = moment(endDate);
|
|
4625
|
+
var nowDate = moment();
|
|
4626
|
+
var differenceInMilliseconds = futureDate.valueOf() - nowDate.valueOf();
|
|
4627
|
+
var difference = moment(differenceInMilliseconds).utc();
|
|
4628
|
+
if (differenceInMilliseconds < 0) {
|
|
4685
4629
|
setIsEndDateReached(true);
|
|
4686
4630
|
if (endDateHandler) endDateHandler();
|
|
4687
4631
|
} else {
|
|
4688
|
-
var
|
|
4689
|
-
|
|
4690
|
-
|
|
4691
|
-
|
|
4692
|
-
var
|
|
4693
|
-
var hoursDiff = pad(duration.hours);
|
|
4694
|
-
var minutesDiff = pad(duration.minutes);
|
|
4695
|
-
var secondsDiff = pad(duration.seconds);
|
|
4632
|
+
var fullDaysLeft = Math.floor(futureDate.diff(nowDate, 'days', true));
|
|
4633
|
+
var daysDiff = fullDaysLeft < 10 ? "0" + fullDaysLeft : fullDaysLeft.toString();
|
|
4634
|
+
var hoursDiff = difference.format('HH');
|
|
4635
|
+
var minutesDiff = difference.format('mm');
|
|
4636
|
+
var secondsDiff = difference.format('ss');
|
|
4696
4637
|
setDays(daysDiff);
|
|
4697
4638
|
setHours(hoursDiff);
|
|
4698
4639
|
setMinutes(minutesDiff);
|
|
@@ -4704,7 +4645,7 @@ var Timer = function Timer(_ref) {
|
|
|
4704
4645
|
clearInterval(interval);
|
|
4705
4646
|
};
|
|
4706
4647
|
});
|
|
4707
|
-
var hideTimer =
|
|
4648
|
+
var hideTimer = moment(endDate).isBefore(moment());
|
|
4708
4649
|
if (hideTimer) return null;
|
|
4709
4650
|
return /*#__PURE__*/React__default.createElement(TimerWrapper, {
|
|
4710
4651
|
color: color
|
|
@@ -5422,7 +5363,6 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
5422
5363
|
className = _ref.className,
|
|
5423
5364
|
role = _ref.role,
|
|
5424
5365
|
ariaLabel = _ref.ariaLabel,
|
|
5425
|
-
tabLinkId = _ref.tabLinkId,
|
|
5426
5366
|
trimTabText = _ref.trimTabText;
|
|
5427
5367
|
var node = useRef();
|
|
5428
5368
|
var _useState = useState(false),
|
|
@@ -5519,7 +5459,6 @@ var Dropdown = function Dropdown(_ref) {
|
|
|
5519
5459
|
};
|
|
5520
5460
|
var renderTab = function renderTab() {
|
|
5521
5461
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Tab, {
|
|
5522
|
-
tabLinkId: tabLinkId,
|
|
5523
5462
|
trimText: trimTabText,
|
|
5524
5463
|
title: title,
|
|
5525
5464
|
titleLink: titleLink,
|
|
@@ -5599,8 +5538,7 @@ var Account = function Account(_ref) {
|
|
|
5599
5538
|
iconName: iconName,
|
|
5600
5539
|
withOptionsInMobile: false,
|
|
5601
5540
|
withIcon: "left",
|
|
5602
|
-
className: className
|
|
5603
|
-
tabLinkId: "account-link"
|
|
5541
|
+
className: className
|
|
5604
5542
|
});
|
|
5605
5543
|
};
|
|
5606
5544
|
|
|
@@ -6003,7 +5941,7 @@ var Accordion = function Accordion(_ref) {
|
|
|
6003
5941
|
} else if (!openAccordion) {
|
|
6004
5942
|
setTextHeight('0px');
|
|
6005
5943
|
}
|
|
6006
|
-
}, [openAccordion, childrenVisibility, content]);
|
|
5944
|
+
}, [openAccordion, childrenVisibility, content, children]);
|
|
6007
5945
|
useEffect(function () {
|
|
6008
5946
|
return function () {
|
|
6009
5947
|
if (timeoutRef.current) {
|
|
@@ -6019,7 +5957,6 @@ var Accordion = function Accordion(_ref) {
|
|
|
6019
5957
|
var toggleAccordion = function toggleAccordion() {
|
|
6020
5958
|
if (React__default.Children.count(children) === 0) return;
|
|
6021
5959
|
if (openAccordion) {
|
|
6022
|
-
setIcon(collapsedStateIconData);
|
|
6023
5960
|
setOpenAccordion(false);
|
|
6024
5961
|
setTextHeight('0px');
|
|
6025
5962
|
setIcon(collapsedStateIconData);
|
|
@@ -7500,24 +7437,21 @@ var InfoBodyWrapper = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject4$n |
|
|
|
7500
7437
|
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";
|
|
7501
7438
|
styleInject(css_248z$1);
|
|
7502
7439
|
|
|
7503
|
-
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";
|
|
7504
|
-
styleInject(css_248z$2);
|
|
7505
|
-
|
|
7506
|
-
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";
|
|
7440
|
+
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";
|
|
7507
7441
|
var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
|
|
7508
|
-
styleInject(css_248z$
|
|
7442
|
+
styleInject(css_248z$2);
|
|
7509
7443
|
|
|
7510
|
-
var css_248z$
|
|
7444
|
+
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 --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";
|
|
7511
7445
|
var streamThemeStyles = {"streamTheme":"stream-theme-module_streamTheme__lTfqQ"};
|
|
7512
|
-
styleInject(css_248z$
|
|
7446
|
+
styleInject(css_248z$3);
|
|
7513
7447
|
|
|
7514
|
-
var css_248z$
|
|
7448
|
+
var css_248z$4 = ".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";
|
|
7515
7449
|
var cinemaThemeStyles = {"cinemaTheme":"cinema-theme-module_cinemaTheme__f5QFs"};
|
|
7516
|
-
styleInject(css_248z$
|
|
7450
|
+
styleInject(css_248z$4);
|
|
7517
7451
|
|
|
7518
|
-
var css_248z$
|
|
7452
|
+
var css_248z$5 = ".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";
|
|
7519
7453
|
var schoolsThemeStyles = {"schoolsTheme":"schools-theme-module_schoolsTheme__CWHba"};
|
|
7520
|
-
styleInject(css_248z$
|
|
7454
|
+
styleInject(css_248z$5);
|
|
7521
7455
|
|
|
7522
7456
|
/* eslint-disable react/jsx-no-useless-fragment */
|
|
7523
7457
|
var DEFAULT_THEME = ThemeType.Core;
|
|
@@ -8976,7 +8910,7 @@ var _excluded$m = ["text"],
|
|
|
8976
8910
|
_excluded3$1 = ["text"];
|
|
8977
8911
|
var _buttonTypeToButton$1;
|
|
8978
8912
|
var LENGTH_TEXT$1 = 28;
|
|
8979
|
-
var LENGTH_TEXT_PARAGRAPH =
|
|
8913
|
+
var LENGTH_TEXT_PARAGRAPH = 130;
|
|
8980
8914
|
var buttonTypeToButton$1 = (_buttonTypeToButton$1 = {}, _buttonTypeToButton$1[ButtonType.Primary] = PrimaryButton, _buttonTypeToButton$1[ButtonType.Secondary] = SecondaryButton, _buttonTypeToButton$1[ButtonType.Tertiary] = TertiaryButton, _buttonTypeToButton$1);
|
|
8981
8915
|
var PromoWithTags = function PromoWithTags(_ref) {
|
|
8982
8916
|
var _ref$imagePosition = _ref.imagePosition,
|
|
@@ -10021,35 +9955,35 @@ function Select(_ref3) {
|
|
|
10021
9955
|
|
|
10022
9956
|
var _templateObject$1a, _templateObject2$U, _templateObject3$G, _templateObject4$y;
|
|
10023
9957
|
var Container$4 = /*#__PURE__*/styled.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
10024
|
-
var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$U || (_templateObject2$U = /*#__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 .harmonic-select__control--is-focused {\n border-color: var(--base-
|
|
9958
|
+
var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$U || (_templateObject2$U = /*#__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-base-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-base-dark-grey);\n }\n\n .harmonic-select__single-value {\n color: var(--color-base-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-dark-grey);\n background: var(--color-base-light-grey);\n }\n\n .harmonic-select__menu-list {\n padding-top: 0;\n padding-bottom: 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-base-black);\n\n @media ", " {\n font-size: 17px;\n }\n\n &:active,\n &.harmonic-select__option--is-focused {\n background: var(--color-base-mid-grey);\n }\n }\n\n .harmonic-select__option--is-selected {\n color: var(--color-base-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-base-black);\n }\n\n .harmonic-select__menu-notice {\n color: var(--color-base-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) {
|
|
10025
9959
|
var width = _ref.width;
|
|
10026
9960
|
if (!width) return 'none';
|
|
10027
9961
|
return width + "px";
|
|
10028
9962
|
}, function (_ref2) {
|
|
10029
9963
|
var error = _ref2.error;
|
|
10030
|
-
if (error !== undefined) return "1px solid var(--base-
|
|
10031
|
-
return "1px solid var(--base-
|
|
9964
|
+
if (error !== undefined) return "1px solid var(--color-base-errorstate)";
|
|
9965
|
+
return "1px solid var(--color-base-dark-grey)";
|
|
10032
9966
|
}, function (_ref3) {
|
|
10033
9967
|
var error = _ref3.error;
|
|
10034
|
-
if (error !== undefined) return "var(--base-
|
|
10035
|
-
return "var(--base-
|
|
9968
|
+
if (error !== undefined) return "var(--color-base-errorstate)";
|
|
9969
|
+
return "var(--color-base-dark-grey)";
|
|
10036
9970
|
}, function (_ref4) {
|
|
10037
9971
|
var darkMode = _ref4.darkMode;
|
|
10038
|
-
if (darkMode) return "0 0 0 4px var(--base-
|
|
10039
|
-
return "0 0 0 3px var(--base-
|
|
10040
|
-
});
|
|
10041
|
-
var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0
|
|
9972
|
+
if (darkMode) return "0 0 0 4px var(--color-base-lemonchiffon)";
|
|
9973
|
+
return "0 0 0 3px var(--color-base-lapislazuli)";
|
|
9974
|
+
}, devices.mobile, devices.mobile);
|
|
9975
|
+
var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0 24px;\n color: ", ";\n"])), function (_ref5) {
|
|
10042
9976
|
var darkMode = _ref5.darkMode;
|
|
10043
|
-
if (darkMode) return "var(--base-
|
|
10044
|
-
return "var(--base-
|
|
9977
|
+
if (darkMode) return "var(--color-base-white)";
|
|
9978
|
+
return "var(--color-base-black)";
|
|
10045
9979
|
});
|
|
10046
9980
|
var ErrorLabel$5 = /*#__PURE__*/styled.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 20px 0 0;\n color: ", ";\n"])), function (_ref6) {
|
|
10047
9981
|
var darkMode = _ref6.darkMode;
|
|
10048
|
-
if (darkMode) return "var(--base-
|
|
10049
|
-
return "var(--base-
|
|
9982
|
+
if (darkMode) return "var(--color-base-white)";
|
|
9983
|
+
return "var(--color-base-errorstate)";
|
|
10050
9984
|
});
|
|
10051
9985
|
|
|
10052
|
-
var _excluded$o = ["label", "error", "width", "darkMode", "isSearchable", "components"];
|
|
9986
|
+
var _excluded$o = ["label", "error", "width", "darkMode", "isSearchable", "components", "className"];
|
|
10053
9987
|
var DropdownIndicator = function DropdownIndicator(props) {
|
|
10054
9988
|
return /*#__PURE__*/React__default.createElement(components.DropdownIndicator, Object.assign({}, props), /*#__PURE__*/React__default.createElement(Icon, {
|
|
10055
9989
|
iconName: "DropdownArrow"
|
|
@@ -10060,12 +9994,15 @@ var WrapperComponent = function WrapperComponent(_ref) {
|
|
|
10060
9994
|
error = _ref.error,
|
|
10061
9995
|
width = _ref.width,
|
|
10062
9996
|
darkMode = _ref.darkMode,
|
|
10063
|
-
children = _ref.children
|
|
10064
|
-
|
|
9997
|
+
children = _ref.children,
|
|
9998
|
+
className = _ref.className;
|
|
9999
|
+
return /*#__PURE__*/React__default.createElement(Container$4, {
|
|
10000
|
+
className: className
|
|
10001
|
+
}, /*#__PURE__*/React__default.createElement("label", null, !!label && (/*#__PURE__*/React__default.createElement(TextLabel$4, {
|
|
10065
10002
|
darkMode: darkMode,
|
|
10066
10003
|
"data-testid": "select2-text-label"
|
|
10067
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
10068
|
-
|
|
10004
|
+
}, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
10005
|
+
size: 'large'
|
|
10069
10006
|
}, label))), /*#__PURE__*/React__default.createElement(SelectWrapper$1, {
|
|
10070
10007
|
width: width,
|
|
10071
10008
|
error: error,
|
|
@@ -10073,8 +10010,8 @@ var WrapperComponent = function WrapperComponent(_ref) {
|
|
|
10073
10010
|
}, children)), !!error && (/*#__PURE__*/React__default.createElement(ErrorLabel$5, {
|
|
10074
10011
|
darkMode: darkMode,
|
|
10075
10012
|
"data-testid": "select2-error-label"
|
|
10076
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
10077
|
-
|
|
10013
|
+
}, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
10014
|
+
size: 'medium'
|
|
10078
10015
|
}, error))));
|
|
10079
10016
|
};
|
|
10080
10017
|
/**
|
|
@@ -10100,12 +10037,14 @@ var SelectComponent = function SelectComponent(_ref2) {
|
|
|
10100
10037
|
_ref2$isSearchable = _ref2.isSearchable,
|
|
10101
10038
|
isSearchable = _ref2$isSearchable === void 0 ? false : _ref2$isSearchable,
|
|
10102
10039
|
components = _ref2.components,
|
|
10040
|
+
className = _ref2.className,
|
|
10103
10041
|
selectProps = _objectWithoutPropertiesLoose(_ref2, _excluded$o);
|
|
10104
10042
|
return /*#__PURE__*/React__default.createElement(WrapperComponent, {
|
|
10105
10043
|
label: label,
|
|
10106
10044
|
error: error,
|
|
10107
10045
|
width: width,
|
|
10108
|
-
darkMode: darkMode
|
|
10046
|
+
darkMode: darkMode,
|
|
10047
|
+
className: className
|
|
10109
10048
|
}, /*#__PURE__*/React__default.createElement(Select$1, Object.assign({}, selectProps, {
|
|
10110
10049
|
components: _extends({
|
|
10111
10050
|
DropdownIndicator: DropdownIndicator,
|
|
@@ -11539,9 +11478,14 @@ var BodyContent = function BodyContent(_ref2) {
|
|
|
11539
11478
|
_ref2$renderGridItem = _ref2.renderGridItem,
|
|
11540
11479
|
renderGridItem = _ref2$renderGridItem === void 0 ? true : _ref2$renderGridItem;
|
|
11541
11480
|
var textContainerClassName = !renderGrid && !renderGridItem ? className : undefined;
|
|
11542
|
-
var content = /*#__PURE__*/React__default.createElement(
|
|
11481
|
+
var content = /*#__PURE__*/React__default.createElement(TextContainer$1, {
|
|
11482
|
+
tag: "div",
|
|
11483
|
+
size: "large",
|
|
11484
|
+
"data-testid": "text-container",
|
|
11543
11485
|
className: textContainerClassName,
|
|
11544
|
-
|
|
11486
|
+
dangerouslySetInnerHTML: {
|
|
11487
|
+
__html: addTypographyClasses(text)
|
|
11488
|
+
}
|
|
11545
11489
|
});
|
|
11546
11490
|
var gridItemOrContent = renderGridItem ? (/*#__PURE__*/React__default.createElement(GridItem, {
|
|
11547
11491
|
columnStartDesktop: columnStartDesktop,
|