@royaloperahouse/chord 2.2.6 → 2.2.7-b-chord-development
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 +213 -7
- package/README.md +250 -40
- package/dist/chord.cjs.development.js +824 -433
- package/dist/chord.cjs.development.js.map +1 -1
- package/dist/chord.cjs.production.min.js +1 -1
- package/dist/chord.cjs.production.min.js.map +1 -1
- package/dist/chord.esm.js +822 -434
- package/dist/chord.esm.js.map +1 -1
- package/dist/components/atoms/Icons/SvgIcons/Descriptors/Seat.svg.d.ts +4 -0
- package/dist/components/atoms/Icons/SvgIcons/Descriptors/Standing.svg.d.ts +4 -0
- package/dist/components/atoms/Icons/SvgIcons/Descriptors/Wheelchair.svg.d.ts +4 -0
- package/dist/components/atoms/Icons/SvgIcons/index.d.ts +3 -0
- package/dist/components/atoms/Radio/Radio.d.ts +3 -0
- package/dist/components/atoms/Radio2/Radio2.d.ts +23 -0
- package/dist/components/atoms/Radio2/Radio2.style.d.ts +7 -0
- package/dist/components/atoms/Radio2/index.d.ts +2 -0
- package/dist/components/atoms/Tickbox/Tickbox.d.ts +3 -0
- package/dist/components/atoms/Tickbox2/Tickbox2.d.ts +23 -0
- package/dist/components/atoms/Tickbox2/Tickbox2.style.d.ts +7 -0
- package/dist/components/atoms/Tickbox2/index.d.ts +2 -0
- package/dist/components/atoms/index.d.ts +3 -1
- package/dist/components/index.d.ts +3 -3
- package/dist/components/molecules/Card/Card.style.d.ts +1 -0
- package/dist/components/molecules/PageHeading/index.d.ts +1 -1
- package/dist/components/molecules/PeopleListing/CreditListing/CreditListing.style.d.ts +1 -0
- package/dist/components/molecules/RadioGroup/RadioGroup.d.ts +3 -0
- package/dist/components/molecules/RadioGroup2/RadioGroup2.d.ts +38 -0
- package/dist/components/molecules/RadioGroup2/RadioGroup2.style.d.ts +4 -0
- package/dist/components/molecules/RadioGroup2/index.d.ts +2 -0
- package/dist/components/molecules/index.d.ts +3 -2
- package/dist/index.d.ts +3 -2
- package/dist/types/card.d.ts +4 -0
- package/dist/types/formTypes.d.ts +125 -10
- package/dist/types/passwordStrength.d.ts +6 -6
- package/package.json +1 -1
- package/README.GIT +0 -277
|
@@ -1269,6 +1269,24 @@ var Print = (function (_ref) {
|
|
|
1269
1269
|
}));
|
|
1270
1270
|
});
|
|
1271
1271
|
|
|
1272
|
+
var Seat = (function (_ref) {
|
|
1273
|
+
var _ref$color = _ref.color,
|
|
1274
|
+
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color;
|
|
1275
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
1276
|
+
width: "100%",
|
|
1277
|
+
height: "100%",
|
|
1278
|
+
viewBox: "0 0 24 24",
|
|
1279
|
+
fill: "none",
|
|
1280
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
1281
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
1282
|
+
d: "M17.5 7.8V4.9c0-2.7-2.2-4.9-4.9-4.9H7.2C4.5 0 2.3 2.2 2.3 4.9v2.9H0V20h4.2v-3.7h11.3V20h4.2V7.8h-2.2ZM3 4.8h.3v.1C3.3 2.8 5 1 7.2 1h5.4c2.2 0 3.9 1.8 3.9 3.9v2.8h-1v4.6H4.2V7.8H3v-3ZM1 19V8.7h2.2v3.6H1.9v4h1.3V19H1Zm1.9-3.6v-2h13.9v2H2.9ZM18.8 19h-2.2v-2.7h1.3v-4h-1.3V8.7h2.2V19Z",
|
|
1283
|
+
fill: color
|
|
1284
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
1285
|
+
d: "M3.3 7.8v-3H3v3h.3Z",
|
|
1286
|
+
fill: color
|
|
1287
|
+
}));
|
|
1288
|
+
});
|
|
1289
|
+
|
|
1272
1290
|
var Secure = (function (_ref) {
|
|
1273
1291
|
var _ref$color = _ref.color,
|
|
1274
1292
|
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color;
|
|
@@ -1287,6 +1305,21 @@ var Secure = (function (_ref) {
|
|
|
1287
1305
|
}));
|
|
1288
1306
|
});
|
|
1289
1307
|
|
|
1308
|
+
var Standing = (function (_ref) {
|
|
1309
|
+
var _ref$color = _ref.color,
|
|
1310
|
+
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color;
|
|
1311
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
1312
|
+
width: "100%",
|
|
1313
|
+
height: "100%",
|
|
1314
|
+
viewBox: "0 0 24 24",
|
|
1315
|
+
fill: "none",
|
|
1316
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
1317
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
1318
|
+
d: "M9.8 3.9c1.1 0 1.9-.9 1.9-1.9 0-1-.8-2-1.9-2-1.1 0-1.9.9-1.9 2s.9 1.9 1.9 1.9Zm0-2.9c.5 0 .9.4.9.9s-.4.9-.9.9-.9-.3-.9-.8.4-1 .9-1Zm2 3.2H8c-1.3 0-2.3 1-2.3 2.2v6.4h1.7V20h4.9v-7h1.8V6.4c0-1.2-1.1-2.2-2.3-2.2Zm1.3 7.8h-.8V7.4c0-.2-.2-.4-.5-.4-.2 0-.5.2-.5.4V19h-.9v-6.3c0-.2-.2-.4-.5-.4-.2 0-.5.2-.5.4V19h-1V7.4c0-.2-.2-.4-.5-.4-.2 0-.5.2-.5.4v4.5h-.7V6.5c0-.7.6-1.2 1.3-1.2h3.7c.7 0 1.3.5 1.3 1.2l.1 5.5Z",
|
|
1319
|
+
fill: color
|
|
1320
|
+
}));
|
|
1321
|
+
});
|
|
1322
|
+
|
|
1290
1323
|
var Tickets = (function (_ref) {
|
|
1291
1324
|
var _ref$color = _ref.color,
|
|
1292
1325
|
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color;
|
|
@@ -1308,6 +1341,21 @@ var Tickets = (function (_ref) {
|
|
|
1308
1341
|
}));
|
|
1309
1342
|
});
|
|
1310
1343
|
|
|
1344
|
+
var Wheelchair = (function (_ref) {
|
|
1345
|
+
var _ref$color = _ref.color,
|
|
1346
|
+
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color;
|
|
1347
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
1348
|
+
width: "100%",
|
|
1349
|
+
height: "100%",
|
|
1350
|
+
viewBox: "0 0 24 24",
|
|
1351
|
+
fill: "none",
|
|
1352
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
1353
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
1354
|
+
d: "M8.4 18.8c-1.1 0-2.2-.4-3-1.1-.8-.8-1.3-1.8-1.3-2.9-.1-1.6.9-3.2 2.3-3.9l-.4-1c-1.9.9-3 2.8-3 4.9.1 2.8 2.4 5.1 5.3 5.1h.2c2.6-.1 4.7-2.1 5.1-4.6l-1.1-.1c-.3 2-2 3.6-4.1 3.6ZM9.8 4.5c1.2 0 2.2-1 2.2-2.2C12 1.1 11 .1 9.8.1c-1.2 0-2.2 1-2.2 2.2 0 1.2.9 2.2 2.2 2.2Zm0-3.3c.6 0 1.1.5 1.1 1.1 0 .6-.5 1.1-1.1 1.1-.6 0-1.1-.5-1.1-1.1 0-.6.5-1.1 1.1-1.1Zm4.9 12c-.3-.5-.9-.8-1.6-.8h-2.6V6.3c0-.6-.5-1.2-1.1-1.2H6.2c-.5.1-.9.5-.9 1v3.2h1.1V6.2l2.9.1v7.2h3.8c.3 0 .5.1.6.3l3.4 5.4.9-.6-3.3-5.4Z",
|
|
1355
|
+
fill: color
|
|
1356
|
+
}));
|
|
1357
|
+
});
|
|
1358
|
+
|
|
1311
1359
|
var BalletAndDance = (function (_ref) {
|
|
1312
1360
|
var _ref$color = _ref.color,
|
|
1313
1361
|
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color;
|
|
@@ -2137,10 +2185,12 @@ var IconLibrary = {
|
|
|
2137
2185
|
Remove: Remove,
|
|
2138
2186
|
Restart: Restart,
|
|
2139
2187
|
Search: Search,
|
|
2188
|
+
Seat: Seat,
|
|
2140
2189
|
Secure: Secure,
|
|
2141
2190
|
Settings: Settings,
|
|
2142
2191
|
Shift: Shift,
|
|
2143
2192
|
Space: Space,
|
|
2193
|
+
Standing: Standing,
|
|
2144
2194
|
Star: Star,
|
|
2145
2195
|
Subscribe: Subscribe,
|
|
2146
2196
|
Subtitles: Subtitles,
|
|
@@ -2153,6 +2203,7 @@ var IconLibrary = {
|
|
|
2153
2203
|
UserSignedIn: UserSignedIn,
|
|
2154
2204
|
Volume: Volume,
|
|
2155
2205
|
Watch: Watch,
|
|
2206
|
+
Wheelchair: Wheelchair,
|
|
2156
2207
|
X: X,
|
|
2157
2208
|
Youtube: Youtube
|
|
2158
2209
|
};
|
|
@@ -2723,6 +2774,10 @@ var Subtitle = function Subtitle(_ref6) {
|
|
|
2723
2774
|
}, children);
|
|
2724
2775
|
};
|
|
2725
2776
|
|
|
2777
|
+
/**
|
|
2778
|
+
* DEPRECATED. Use Radio2 instead
|
|
2779
|
+
*/
|
|
2780
|
+
|
|
2726
2781
|
var Radio = function Radio(_ref) {
|
|
2727
2782
|
var _ref$checked = _ref.checked,
|
|
2728
2783
|
checked = _ref$checked === void 0 ? false : _ref$checked,
|
|
@@ -2762,13 +2817,123 @@ var Radio = function Radio(_ref) {
|
|
|
2762
2817
|
}, error)));
|
|
2763
2818
|
};
|
|
2764
2819
|
|
|
2765
|
-
var _templateObject$f, _templateObject2$5, _templateObject3$4;
|
|
2766
|
-
var
|
|
2767
|
-
var
|
|
2820
|
+
var _templateObject$f, _templateObject2$5, _templateObject3$4, _templateObject4$2, _templateObject5$1, _templateObject6;
|
|
2821
|
+
var Container = /*#__PURE__*/styled__default.div(_templateObject$f || (_templateObject$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
2822
|
+
var Radio$1 = /*#__PURE__*/styled__default.div(_templateObject2$5 || (_templateObject2$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 1px;\n left: 0;\n z-index: 1;\n box-sizing: border-box;\n width: 20px;\n height: 20px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n border: ", ";\n background-color: ", ";\n color: ", ";\n"])), function (_ref) {
|
|
2823
|
+
var error = _ref.error,
|
|
2824
|
+
darkMode = _ref.darkMode,
|
|
2825
|
+
disabled = _ref.disabled;
|
|
2826
|
+
if (error !== undefined) return '1px solid var(--error-color-state)';
|
|
2827
|
+
if (disabled) return '1px solid var(--base-color-midgrey)';
|
|
2828
|
+
if (darkMode) return '1px solid var(--base-color-white)';
|
|
2829
|
+
return '1px solid var(--base-color-black)';
|
|
2830
|
+
}, function (_ref2) {
|
|
2831
|
+
var disabled = _ref2.disabled,
|
|
2832
|
+
darkMode = _ref2.darkMode;
|
|
2833
|
+
if (disabled) return 'var(--base-color-lightgrey)';
|
|
2834
|
+
if (darkMode) return 'var(--base-color-white)';
|
|
2835
|
+
return ' var(--base-color-white)';
|
|
2836
|
+
}, function (_ref3) {
|
|
2837
|
+
var disabled = _ref3.disabled,
|
|
2838
|
+
blackBox = _ref3.blackBox,
|
|
2839
|
+
darkMode = _ref3.darkMode;
|
|
2840
|
+
if (disabled) return 'var(--base-color-midgrey)';
|
|
2841
|
+
if (darkMode) return 'var(--base-color-black)';
|
|
2842
|
+
if (blackBox) return 'var(--base-color-white)';
|
|
2843
|
+
return ' var(--base-color-black)';
|
|
2844
|
+
});
|
|
2845
|
+
var TickboxLabel = /*#__PURE__*/styled__default.label(_templateObject3$4 || (_templateObject3$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-left: 32px;\n input[type='radio'] {\n width: 1px;\n height: 1px;\n position: absolute;\n top: 0;\n left: 0;\n opacity: 0;\n z-index: 0;\n &:checked + ", " {\n background-color: ", ";\n }\n &:focus + ", " {\n outline: ", ";\n }\n }\n"])), Radio$1, function (_ref4) {
|
|
2846
|
+
var blackBox = _ref4.blackBox,
|
|
2847
|
+
darkMode = _ref4.darkMode;
|
|
2848
|
+
if (darkMode) return 'var(--base-color-white)';
|
|
2849
|
+
if (blackBox) return 'var(--base-color-black)';
|
|
2850
|
+
return ' var(--base-color-white)';
|
|
2851
|
+
}, Radio$1, function (_ref5) {
|
|
2852
|
+
var darkMode = _ref5.darkMode;
|
|
2853
|
+
if (darkMode) return '4px solid var(--base-color-lemonchiffon)';
|
|
2854
|
+
return '3px solid var(--base-color-lapislazuli)';
|
|
2855
|
+
});
|
|
2856
|
+
var RadioIcon = /*#__PURE__*/styled__default.div(_templateObject4$2 || (_templateObject4$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n color: inherit;\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background-color: currentColor;\n input[type='radio']:checked + ", " & {\n display: block;\n }\n"])), Radio$1);
|
|
2857
|
+
var TextLabel = /*#__PURE__*/styled__default.div(_templateObject5$1 || (_templateObject5$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref6) {
|
|
2858
|
+
var darkMode = _ref6.darkMode,
|
|
2859
|
+
disabled = _ref6.disabled;
|
|
2860
|
+
if (darkMode && disabled) return 'var(--base-color-lightgrey)';
|
|
2861
|
+
if (darkMode) return 'var(--base-color-white)';
|
|
2862
|
+
if (disabled) return 'var(--base-color-darkgrey)';
|
|
2863
|
+
return 'var(--base-color-black)';
|
|
2864
|
+
});
|
|
2865
|
+
var ErrorLabel = /*#__PURE__*/styled__default.div(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref7) {
|
|
2866
|
+
var darkMode = _ref7.darkMode;
|
|
2867
|
+
if (darkMode) return 'var(--base-color-white)';
|
|
2868
|
+
return 'var(--base-color-errorstate)';
|
|
2869
|
+
});
|
|
2870
|
+
|
|
2871
|
+
var _excluded$4 = ["children", "disabled", "error", "darkMode", "blackBox"];
|
|
2872
|
+
/**
|
|
2873
|
+
* A Radio component, that wraps around the native `<input type="radio"/>` element
|
|
2874
|
+
* and adds some extra styling, states and information around it (i.e. an error label,
|
|
2875
|
+
* error state).
|
|
2876
|
+
*
|
|
2877
|
+
* # Error state
|
|
2878
|
+
* An error label will be shown below the radio if the `error` prop exists.
|
|
2879
|
+
* Also radio will be rendered with a red border. An empty string can be passed to
|
|
2880
|
+
* render only error state without error message.
|
|
2881
|
+
*
|
|
2882
|
+
* # Light / Dark mode
|
|
2883
|
+
* The component can also adapt its styles for light / dark mode. If you want this component
|
|
2884
|
+
* to be rendered on a dark / coloured background, you can use the `darkMode` prop.
|
|
2885
|
+
*
|
|
2886
|
+
* # Black box mode
|
|
2887
|
+
* If `blackBox` prop is true checked state will be styled as black box with white tick icon.
|
|
2888
|
+
* This style was used before as a default. Not preferred in new components.
|
|
2889
|
+
* This will be ignored if `darkMode` is true.
|
|
2890
|
+
*/
|
|
2891
|
+
|
|
2892
|
+
var Radio2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
2893
|
+
var children = _ref.children,
|
|
2894
|
+
_ref$disabled = _ref.disabled,
|
|
2895
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
2896
|
+
error = _ref.error,
|
|
2897
|
+
_ref$darkMode = _ref.darkMode,
|
|
2898
|
+
darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
|
|
2899
|
+
_ref$blackBox = _ref.blackBox,
|
|
2900
|
+
blackBox = _ref$blackBox === void 0 ? false : _ref$blackBox,
|
|
2901
|
+
inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
2902
|
+
|
|
2903
|
+
return /*#__PURE__*/React__default.createElement(Container, null, /*#__PURE__*/React__default.createElement(TickboxLabel, {
|
|
2904
|
+
darkMode: darkMode,
|
|
2905
|
+
blackBox: blackBox
|
|
2906
|
+
}, /*#__PURE__*/React__default.createElement("input", Object.assign({}, inputProps, {
|
|
2907
|
+
disabled: disabled,
|
|
2908
|
+
type: "radio",
|
|
2909
|
+
ref: ref,
|
|
2910
|
+
"data-testid": "radio-input"
|
|
2911
|
+
})), /*#__PURE__*/React__default.createElement(Radio$1, {
|
|
2912
|
+
error: error,
|
|
2913
|
+
darkMode: darkMode,
|
|
2914
|
+
disabled: disabled,
|
|
2915
|
+
blackBox: blackBox
|
|
2916
|
+
}, /*#__PURE__*/React__default.createElement(RadioIcon, null)), /*#__PURE__*/React__default.createElement(TextLabel, {
|
|
2917
|
+
disabled: disabled,
|
|
2918
|
+
darkMode: darkMode,
|
|
2919
|
+
"data-testid": "radio-content"
|
|
2920
|
+
}, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
2921
|
+
level: 1
|
|
2922
|
+
}, children))), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel, {
|
|
2923
|
+
darkMode: darkMode,
|
|
2924
|
+
"data-testid": "radio-error-label"
|
|
2925
|
+
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
2926
|
+
level: 6
|
|
2927
|
+
}, error)));
|
|
2928
|
+
});
|
|
2929
|
+
|
|
2930
|
+
var _templateObject$g, _templateObject2$6, _templateObject3$5;
|
|
2931
|
+
var ButtonsContainer = /*#__PURE__*/styled__default.div(_templateObject$g || (_templateObject$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n"])));
|
|
2932
|
+
var IconWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$6 || (_templateObject2$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n justify-content: center;\n display: flex;\n align-items: center;\n width: var(--rotator-button-width);\n height: var(--rotator-button-width);\n background-color: var(--base-color-lightgrey);\n color: var(--base-color-black);\n\n svg {\n width: var(--rotator-button-icon-width);\n height: var(--rotator-button-icon-width);\n }\n\n svg path {\n fill: var(--base-color-black);\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n && svg path {\n fill: var(--base-color-white);\n }\n }\n\n @media ", " {\n background-color: var(--base-color-black);\n\n && svg path {\n fill: var(--base-color-white);\n }\n\n :hover {\n cursor: default;\n background-color: var(--base-color-black);\n\n && svg path {\n fill: var(--base-color-white);\n }\n }\n }\n"])), function (_ref) {
|
|
2768
2933
|
var theme = _ref.theme;
|
|
2769
2934
|
return theme.colors.primary;
|
|
2770
2935
|
}, devices.mobile);
|
|
2771
|
-
var IconUnavailableWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
2936
|
+
var IconUnavailableWrapper = /*#__PURE__*/styled__default.div(_templateObject3$5 || (_templateObject3$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n justify-content: center;\n display: flex;\n align-items: center;\n width: var(--navigation-large-margin);\n height: var(--navigation-large-margin);\n background-color: var(--base-color-lightgrey);\n color: var(--base-color-black);\n opacity: 0.2;\n\n svg {\n width: var(--navigation-xlarge-gap);\n height: var(--navigation-xlarge-gap);\n }\n\n svg path {\n fill: var(--base-color-black);\n }\n\n @media ", " {\n opacity: 1;\n pointer-events: none;\n background-color: var(--base-color-black);\n\n && svg path {\n fill: var(--base-color-white);\n }\n }\n"])), devices.mobile);
|
|
2772
2937
|
|
|
2773
2938
|
var RotatorButtons = function RotatorButtons(_ref) {
|
|
2774
2939
|
var onClickPrev = _ref.onClickPrev,
|
|
@@ -2834,8 +2999,8 @@ var RotatorButtons = function RotatorButtons(_ref) {
|
|
|
2834
2999
|
}, renderNextIcon()));
|
|
2835
3000
|
};
|
|
2836
3001
|
|
|
2837
|
-
var _templateObject$
|
|
2838
|
-
var SecondaryLogoWrapper = /*#__PURE__*/styled__default.svg(_templateObject$
|
|
3002
|
+
var _templateObject$h;
|
|
3003
|
+
var SecondaryLogoWrapper = /*#__PURE__*/styled__default.svg(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n path {\n fill: var(--base-color-", ");\n }\n"])), function (_ref) {
|
|
2839
3004
|
var fillColor = _ref.fillColor;
|
|
2840
3005
|
return fillColor;
|
|
2841
3006
|
});
|
|
@@ -2859,9 +3024,9 @@ var SecondaryLogo = function SecondaryLogo(_ref) {
|
|
|
2859
3024
|
})));
|
|
2860
3025
|
};
|
|
2861
3026
|
|
|
2862
|
-
var _templateObject$
|
|
2863
|
-
var SectionSplitterContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
2864
|
-
var Splitter = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3027
|
+
var _templateObject$i, _templateObject2$7;
|
|
3028
|
+
var SectionSplitterContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$i || (_templateObject$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 4px;\n"])));
|
|
3029
|
+
var Splitter = /*#__PURE__*/styled__default.div(_templateObject2$7 || (_templateObject2$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n height: 4px;\n background: var(--base-color-lightgrey);\n"])));
|
|
2865
3030
|
|
|
2866
3031
|
var SectionSplitter = function SectionSplitter(_ref) {
|
|
2867
3032
|
var _ref$fullWidth = _ref.fullWidth,
|
|
@@ -2879,8 +3044,8 @@ var SectionSplitter = function SectionSplitter(_ref) {
|
|
|
2879
3044
|
}, /*#__PURE__*/React__default.createElement(Splitter, null)));
|
|
2880
3045
|
};
|
|
2881
3046
|
|
|
2882
|
-
var _templateObject$
|
|
2883
|
-
var SponsorLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3047
|
+
var _templateObject$j;
|
|
3048
|
+
var SponsorLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$j || (_templateObject$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n width: 172px;\n"])));
|
|
2884
3049
|
|
|
2885
3050
|
var SponsorLogo = function SponsorLogo(_ref) {
|
|
2886
3051
|
var _ref$colorLogo = _ref.colorLogo,
|
|
@@ -3090,9 +3255,9 @@ var SponsorLogo = function SponsorLogo(_ref) {
|
|
|
3090
3255
|
})))));
|
|
3091
3256
|
};
|
|
3092
3257
|
|
|
3093
|
-
var _templateObject$
|
|
3094
|
-
var CustomImage = /*#__PURE__*/styled__default.img(_templateObject$
|
|
3095
|
-
var SponsorshipStyledIframe = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3258
|
+
var _templateObject$k, _templateObject2$8;
|
|
3259
|
+
var CustomImage = /*#__PURE__*/styled__default.img(_templateObject$k || (_templateObject$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-height: 100px;\n max-width: auto;\n\n @media ", " {\n max-height: 55px;\n }\n\n @media ", " {\n max-height: 45px;\n }\n"])), devices.tablet, devices.mobile);
|
|
3260
|
+
var SponsorshipStyledIframe = /*#__PURE__*/styled__default.div(_templateObject2$8 || (_templateObject2$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: transparent;\n height: 80px;\n margin: 0px;\n overflow: hidden;\n padding: 0;\n width: 80px;\n\n & > iframe {\n border: 0;\n display: block;\n margin: 0px;\n padding: 0px;\n overflow: hidden;\n width: 100%;\n height: 100%;\n }\n\n @media ", " {\n & {\n height: 40px;\n width: 40px;\n }\n & iframe {\n height: 80px;\n transform: scale(0.5) translate(-40px, -40px);\n width: 80px;\n }\n }\n"])), devices.mobile);
|
|
3096
3261
|
|
|
3097
3262
|
var DEFAULT_SPONSORSHIP_IFRAME = 'https://static.roh.org.uk/rolex/v3/rolex.html?size=80';
|
|
3098
3263
|
var DEFAULT_SPONSORSHIP_TITLE = 'rolex';
|
|
@@ -3124,8 +3289,8 @@ var Sponsorship = function Sponsorship(_ref) {
|
|
|
3124
3289
|
}));
|
|
3125
3290
|
};
|
|
3126
3291
|
|
|
3127
|
-
var _templateObject$
|
|
3128
|
-
var TabText = /*#__PURE__*/styled__default.a(_templateObject$
|
|
3292
|
+
var _templateObject$l, _templateObject2$9;
|
|
3293
|
+
var TabText = /*#__PURE__*/styled__default.a(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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-black);\n margin-right: 0px;\n margin-top: 5px;\n text-decoration: none;\n text-transform: uppercase;\n\n ", "\n\n @media ", " {\n ", "\n }\n"])), function (props) {
|
|
3129
3294
|
if (props.withIcon === 'left') {
|
|
3130
3295
|
return "margin-left: 5px;";
|
|
3131
3296
|
}
|
|
@@ -3138,7 +3303,7 @@ var TabText = /*#__PURE__*/styled__default.a(_templateObject$k || (_templateObje
|
|
|
3138
3303
|
|
|
3139
3304
|
return "";
|
|
3140
3305
|
});
|
|
3141
|
-
var TitleContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3306
|
+
var TitleContainer = /*#__PURE__*/styled__default.div(_templateObject2$9 || (_templateObject2$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n width: fit-content;\n border-bottom: 1px solid transparent;\n\n ", "\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n\n ", "\n\n ", "\n\n @media ", " {\n svg {\n margin-right: 0px;\n }\n }\n\n :hover {\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-", ");\n && a {\n color: var(--base-color-", ");\n }\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n"])), function (props) {
|
|
3142
3307
|
if (props.withIcon === 'left') {
|
|
3143
3308
|
return "\n flex-direction: row-reverse;\n svg {\n margin-right: 6px;\n }";
|
|
3144
3309
|
}
|
|
@@ -3224,8 +3389,8 @@ var Tab = function Tab(_ref) {
|
|
|
3224
3389
|
}));
|
|
3225
3390
|
};
|
|
3226
3391
|
|
|
3227
|
-
var _templateObject$
|
|
3228
|
-
var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$
|
|
3392
|
+
var _templateObject$m, _templateObject2$a;
|
|
3393
|
+
var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$m || (_templateObject$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: ", ";\n font-family: var(--font-family-navigation);\n font-size: var(--font-size-navigation);\n font-weight: var(--font-weight-navigation);\n line-height: var(--line-height-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n text-transform: var(--text-transform-navigation);\n color: ", ";\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n border-bottom: ", ";\n ", "\n\n @media ", ", ", " {\n &:hover {\n color: var(--base-color-", ");\n border-bottom: 1px solid var(--base-color-", ");\n\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n }\n"])), function (_ref) {
|
|
3229
3394
|
var iconName = _ref.iconName;
|
|
3230
3395
|
return iconName ? 'calc(var(--text-link-underline-offset) - 4px) 0' : 'var(--text-link-underline-offset) 0';
|
|
3231
3396
|
}, function (_ref2) {
|
|
@@ -3251,9 +3416,9 @@ var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$l || (_templ
|
|
|
3251
3416
|
var hoverColor = _ref7.hoverColor;
|
|
3252
3417
|
return hoverColor;
|
|
3253
3418
|
});
|
|
3254
|
-
var TabLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$
|
|
3419
|
+
var TabLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$a || (_templateObject2$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-right: var(--button-icon-margin);\n"])));
|
|
3255
3420
|
|
|
3256
|
-
var _excluded$
|
|
3421
|
+
var _excluded$5 = ["children", "iconName", "iconDirection", "color", "hoverColor"];
|
|
3257
3422
|
|
|
3258
3423
|
var TabLink = function TabLink(_ref) {
|
|
3259
3424
|
var children = _ref.children,
|
|
@@ -3263,7 +3428,7 @@ var TabLink = function TabLink(_ref) {
|
|
|
3263
3428
|
color = _ref$color === void 0 ? exports.Colors.DarkGrey : _ref$color,
|
|
3264
3429
|
_ref$hoverColor = _ref.hoverColor,
|
|
3265
3430
|
hoverColor = _ref$hoverColor === void 0 ? exports.Colors.Primary : _ref$hoverColor,
|
|
3266
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
3431
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
3267
3432
|
|
|
3268
3433
|
return /*#__PURE__*/React__default.createElement(TabLinkWrapper, Object.assign({
|
|
3269
3434
|
color: color,
|
|
@@ -3278,19 +3443,19 @@ var TabLink = function TabLink(_ref) {
|
|
|
3278
3443
|
})) : null, children);
|
|
3279
3444
|
};
|
|
3280
3445
|
|
|
3281
|
-
var _templateObject$
|
|
3282
|
-
var TextAreaWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3446
|
+
var _templateObject$n, _templateObject2$b, _templateObject3$6, _templateObject4$3;
|
|
3447
|
+
var TextAreaWrapper = /*#__PURE__*/styled__default.div(_templateObject$n || (_templateObject$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n"])), function (_ref) {
|
|
3283
3448
|
var width = _ref.width;
|
|
3284
3449
|
return width ? width + "px;" : '100%;';
|
|
3285
3450
|
}, function (_ref2) {
|
|
3286
3451
|
var height = _ref2.height;
|
|
3287
3452
|
return height + "px;";
|
|
3288
3453
|
});
|
|
3289
|
-
var TextAreaLabel = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3454
|
+
var TextAreaLabel = /*#__PURE__*/styled__default.div(_templateObject2$b || (_templateObject2$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-block: 0 15px;\n ", ";\n"])), function (_ref3) {
|
|
3290
3455
|
var darkMode = _ref3.darkMode;
|
|
3291
3456
|
return darkMode ? 'color: var(--base-color-white)' : '';
|
|
3292
3457
|
});
|
|
3293
|
-
var TextAreaBox = /*#__PURE__*/styled__default.textarea(_templateObject3$
|
|
3458
|
+
var TextAreaBox = /*#__PURE__*/styled__default.textarea(_templateObject3$6 || (_templateObject3$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n box-sizing: border-box;\n resize: none;\n padding: 20px;\n width: 100%;\n height: 100%;\n border: 1px solid ", ";\n\n ", ";\n\n :disabled {\n background-color: var(--base-color-lightgrey);\n border: 1px solid transparent;\n outline: none;\n }\n\n :focus {\n outline-style: solid;\n outline-width: ", ";\n outline-color: ", ";\n }\n"])), function (_ref4) {
|
|
3294
3459
|
var error = _ref4.error;
|
|
3295
3460
|
return !!error ? 'var(--base-color-errorstate)' : 'var(--base-color-lightgrey)';
|
|
3296
3461
|
}, function (_ref5) {
|
|
@@ -3305,7 +3470,7 @@ var TextAreaBox = /*#__PURE__*/styled__default.textarea(_templateObject3$5 || (_
|
|
|
3305
3470
|
var darkMode = _ref7.darkMode;
|
|
3306
3471
|
return darkMode ? 'var(--base-color-lemonchiffon)' : 'var(--base-color-lapislazuli)';
|
|
3307
3472
|
});
|
|
3308
|
-
var TextAreaError = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
3473
|
+
var TextAreaError = /*#__PURE__*/styled__default.div(_templateObject4$3 || (_templateObject4$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n color: ", ";\n margin-block: 15px 0;\n"])), function (_ref8) {
|
|
3309
3474
|
var darkMode = _ref8.darkMode;
|
|
3310
3475
|
return darkMode ? 'color: var(--base-color-white)' : '';
|
|
3311
3476
|
}, function (_ref9) {
|
|
@@ -3313,7 +3478,7 @@ var TextAreaError = /*#__PURE__*/styled__default.div(_templateObject4$2 || (_tem
|
|
|
3313
3478
|
return darkMode ? 'var(--base-color-white)' : 'var(--base-color-errorstate)';
|
|
3314
3479
|
});
|
|
3315
3480
|
|
|
3316
|
-
var _excluded$
|
|
3481
|
+
var _excluded$6 = ["label", "error", "width", "darkMode", "height", "columnStartDesktop", "columnStartDevice", "columnSpanDesktop", "columnSpanDevice", "maxLength", "tabIndex"];
|
|
3317
3482
|
/**
|
|
3318
3483
|
* An HTML textarea component for Chord.
|
|
3319
3484
|
*
|
|
@@ -3375,7 +3540,7 @@ var TextArea = function TextArea(_ref) {
|
|
|
3375
3540
|
maxLength = _ref$maxLength === void 0 ? 950 : _ref$maxLength,
|
|
3376
3541
|
_ref$tabIndex = _ref.tabIndex,
|
|
3377
3542
|
tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
|
|
3378
|
-
textareaProps = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
3543
|
+
textareaProps = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
3379
3544
|
|
|
3380
3545
|
return /*#__PURE__*/React__default.createElement(GridItem, {
|
|
3381
3546
|
columnStartDesktop: columnStartDesktop,
|
|
@@ -3403,14 +3568,14 @@ var TextArea = function TextArea(_ref) {
|
|
|
3403
3568
|
}, error))));
|
|
3404
3569
|
};
|
|
3405
3570
|
|
|
3406
|
-
var _templateObject$
|
|
3407
|
-
var Container = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3408
|
-
var InputWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3571
|
+
var _templateObject$o, _templateObject2$c, _templateObject3$7, _templateObject4$4, _templateObject5$2, _templateObject6$1;
|
|
3572
|
+
var Container$1 = /*#__PURE__*/styled__default.div(_templateObject$o || (_templateObject$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
3573
|
+
var InputWrapper = /*#__PURE__*/styled__default.div(_templateObject2$c || (_templateObject2$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n"])), function (_ref) {
|
|
3409
3574
|
var width = _ref.width;
|
|
3410
3575
|
if (!width) return 'none';
|
|
3411
3576
|
return width + 'px';
|
|
3412
3577
|
});
|
|
3413
|
-
var Input = /*#__PURE__*/styled__default.input(_templateObject3$
|
|
3578
|
+
var Input = /*#__PURE__*/styled__default.input(_templateObject3$7 || (_templateObject3$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n box-sizing: border-box;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n border-radius: 0;\n width: 100%;\n height: 48px;\n padding-left: 20px;\n -moz-appearance: textfield;\n padding-right: ", ";\n outline: none;\n border: ", ";\n &:disabled {\n background-color: var(--base-color-lightgrey);\n border: 1px solid transparent;\n outline: none;\n }\n\n &:focus {\n outline: ", ";\n }\n\n /* remove search decoration */\n &::-webkit-search-decoration,\n &::-webkit-search-cancel-button,\n &::-webkit-search-results-button,\n &::-webkit-search-results-decoration {\n display: none; \n }\n\n /* remove number decoration */\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n"])), function (_ref2) {
|
|
3414
3579
|
var isPasswordField = _ref2.isPasswordField;
|
|
3415
3580
|
if (isPasswordField) return "80px";
|
|
3416
3581
|
return "20px";
|
|
@@ -3423,19 +3588,19 @@ var Input = /*#__PURE__*/styled__default.input(_templateObject3$6 || (_templateO
|
|
|
3423
3588
|
if (darkMode) return "4px solid var(--base-color-lemonchiffon)";
|
|
3424
3589
|
return "3px solid var(--base-color-lapislazuli)";
|
|
3425
3590
|
});
|
|
3426
|
-
var ShowHideButton = /*#__PURE__*/styled__default.button(_templateObject4$
|
|
3427
|
-
var TextLabel = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
3591
|
+
var ShowHideButton = /*#__PURE__*/styled__default.button(_templateObject4$4 || (_templateObject4$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n width: 53px;\n top: 50%;\n margin-top: calc(var(--line-height-overline-1) / 2 * -1);\n right: 20px;\n border: none;\n background: none;\n padding: 0;\n display: block;\n text-align: left;\n cursor: pointer;\n white-space: nowrap;\n color: var(--base-color-black);\n"])));
|
|
3592
|
+
var TextLabel$1 = /*#__PURE__*/styled__default.div(_templateObject5$2 || (_templateObject5$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 20px;\n color: ", ";\n"])), function (_ref5) {
|
|
3428
3593
|
var darkMode = _ref5.darkMode;
|
|
3429
3594
|
if (darkMode) return "var(--base-color-white)";
|
|
3430
3595
|
return "var(--base-color-black)";
|
|
3431
3596
|
});
|
|
3432
|
-
var ErrorLabel = /*#__PURE__*/styled__default.div(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref6) {
|
|
3597
|
+
var ErrorLabel$1 = /*#__PURE__*/styled__default.div(_templateObject6$1 || (_templateObject6$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref6) {
|
|
3433
3598
|
var darkMode = _ref6.darkMode;
|
|
3434
3599
|
if (darkMode) return "var(--base-color-white)";
|
|
3435
3600
|
return "var(--base-color-errorstate)";
|
|
3436
3601
|
});
|
|
3437
3602
|
|
|
3438
|
-
var _excluded$
|
|
3603
|
+
var _excluded$7 = ["label", "type", "error", "darkMode", "width"];
|
|
3439
3604
|
/**
|
|
3440
3605
|
* A text field component, that wraps around the native `<input />` element
|
|
3441
3606
|
* and adds some extra states and information around it (i.e. a text and an error labels,
|
|
@@ -3483,7 +3648,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
3483
3648
|
_ref$darkMode = _ref.darkMode,
|
|
3484
3649
|
darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
|
|
3485
3650
|
width = _ref.width,
|
|
3486
|
-
inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
3651
|
+
inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$7);
|
|
3487
3652
|
|
|
3488
3653
|
var _useState = React.useState(false),
|
|
3489
3654
|
showPassword = _useState[0],
|
|
@@ -3504,7 +3669,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
3504
3669
|
});
|
|
3505
3670
|
};
|
|
3506
3671
|
|
|
3507
|
-
return /*#__PURE__*/React__default.createElement(Container, null, /*#__PURE__*/React__default.createElement("label", null, !!label && /*#__PURE__*/React__default.createElement(TextLabel, {
|
|
3672
|
+
return /*#__PURE__*/React__default.createElement(Container$1, null, /*#__PURE__*/React__default.createElement("label", null, !!label && /*#__PURE__*/React__default.createElement(TextLabel$1, {
|
|
3508
3673
|
darkMode: darkMode,
|
|
3509
3674
|
"data-testid": "text-field-text-label"
|
|
3510
3675
|
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
@@ -3519,11 +3684,11 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
3519
3684
|
"data-testid": "text-field-input",
|
|
3520
3685
|
ref: ref
|
|
3521
3686
|
}, inputProps)), isPasswordField && /*#__PURE__*/React__default.createElement(ShowHideButton, {
|
|
3522
|
-
type:
|
|
3687
|
+
type: 'button',
|
|
3523
3688
|
onClick: showHideClickHandler
|
|
3524
3689
|
}, /*#__PURE__*/React__default.createElement(Overline, {
|
|
3525
3690
|
level: 1
|
|
3526
|
-
}, showHideButtonText)))), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel, {
|
|
3691
|
+
}, showHideButtonText)))), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$1, {
|
|
3527
3692
|
darkMode: darkMode,
|
|
3528
3693
|
"data-testid": "text-field-error-label"
|
|
3529
3694
|
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
@@ -3531,24 +3696,24 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
3531
3696
|
}, error)));
|
|
3532
3697
|
});
|
|
3533
3698
|
|
|
3534
|
-
var _templateObject$
|
|
3535
|
-
var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$
|
|
3699
|
+
var _templateObject$p, _templateObject2$d;
|
|
3700
|
+
var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$p || (_templateObject$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid;\n padding-bottom: ", ";\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n color: var(--base-color-", ");\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n"])), function (_ref) {
|
|
3536
3701
|
var iconName = _ref.iconName;
|
|
3537
3702
|
return iconName ? 'calc(var(--text-link-underline-offset) - 4px)' : 'var(--text-link-underline-offset)';
|
|
3538
3703
|
}, function (_ref2) {
|
|
3539
3704
|
var color = _ref2.color;
|
|
3540
3705
|
return color;
|
|
3541
3706
|
});
|
|
3542
|
-
var TextLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$
|
|
3707
|
+
var TextLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$d || (_templateObject2$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-left: var(--button-icon-margin);\n"])));
|
|
3543
3708
|
|
|
3544
|
-
var _excluded$
|
|
3709
|
+
var _excluded$8 = ["children", "iconName", "iconDirection", "color"];
|
|
3545
3710
|
|
|
3546
3711
|
var TextLink = function TextLink(_ref) {
|
|
3547
3712
|
var children = _ref.children,
|
|
3548
3713
|
iconName = _ref.iconName,
|
|
3549
3714
|
iconDirection = _ref.iconDirection,
|
|
3550
3715
|
color = _ref.color,
|
|
3551
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
3716
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
|
|
3552
3717
|
|
|
3553
3718
|
var truncatedString = children.substring(0, 30);
|
|
3554
3719
|
return /*#__PURE__*/React__default.createElement(TextLinkWrapper, Object.assign({
|
|
@@ -3563,20 +3728,20 @@ var TextLink = function TextLink(_ref) {
|
|
|
3563
3728
|
})) : null);
|
|
3564
3729
|
};
|
|
3565
3730
|
|
|
3566
|
-
var _templateObject$
|
|
3567
|
-
var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3731
|
+
var _templateObject$q, _templateObject2$e, _templateObject3$8, _templateObject4$5;
|
|
3732
|
+
var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: 10px;\n margin-top: 140px;\n display: grid;\n grid-template-columns: repeat(2, auto);\n font-family: var(--font-family-header);\n font-size: ", ";\n color: ", ";\n width: auto;\n margin: auto;\n"])), function (_ref) {
|
|
3568
3733
|
var fontSize = _ref.fontSize;
|
|
3569
3734
|
return fontSize + 'px';
|
|
3570
3735
|
}, function (_ref2) {
|
|
3571
3736
|
var color = _ref2.color;
|
|
3572
3737
|
return color;
|
|
3573
3738
|
});
|
|
3574
|
-
var LogoRightSide = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3575
|
-
var LogoLeftSide = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
3739
|
+
var LogoRightSide = /*#__PURE__*/styled__default.div(_templateObject2$e || (_templateObject2$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-left: 10px;\n font-weight: 500;\n letter-spacing: 1px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])));
|
|
3740
|
+
var LogoLeftSide = /*#__PURE__*/styled__default.div(_templateObject3$8 || (_templateObject3$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-right: 1px solid ", ";\n padding-right: 10px;\n letter-spacing: 2px;\n display: flex;\n flex-direction: column;\n"])), function (_ref3) {
|
|
3576
3741
|
var color = _ref3.color;
|
|
3577
3742
|
return color;
|
|
3578
3743
|
});
|
|
3579
|
-
var LogoLeftSideRow = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
3744
|
+
var LogoLeftSideRow = /*#__PURE__*/styled__default.div(_templateObject4$5 || (_templateObject4$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n font-weight: 400;\n"])));
|
|
3580
3745
|
|
|
3581
3746
|
var TextLogoProduct;
|
|
3582
3747
|
|
|
@@ -3598,12 +3763,12 @@ var Logo = function Logo(_ref) {
|
|
|
3598
3763
|
}, /*#__PURE__*/React.createElement(LogoLeftSideRow, null, "ROYAL"), /*#__PURE__*/React.createElement(LogoLeftSideRow, null, "OPERA"), /*#__PURE__*/React.createElement(LogoLeftSideRow, null, "HOUSE")), /*#__PURE__*/React.createElement(LogoRightSide, null, productName));
|
|
3599
3764
|
};
|
|
3600
3765
|
|
|
3601
|
-
var _templateObject$
|
|
3602
|
-
var TickboxError = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3766
|
+
var _templateObject$r, _templateObject2$f, _templateObject3$9, _templateObject4$6;
|
|
3767
|
+
var TickboxError = /*#__PURE__*/styled__default.div(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-block: 20px;\n color: var(--base-color-", ");\n"])), function (_ref) {
|
|
3603
3768
|
var dark = _ref.dark;
|
|
3604
3769
|
return dark ? 'white' : 'errorstate';
|
|
3605
3770
|
});
|
|
3606
|
-
var TickboxLabel = /*#__PURE__*/styled__default.label(_templateObject2$
|
|
3771
|
+
var TickboxLabel$1 = /*#__PURE__*/styled__default.label(_templateObject2$f || (_templateObject2$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n width: fit-content;\n position: relative;\n padding-left: 32px;\n color: var(\n --base-color-", "\n );\n cursor: ", ";\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n\n div {\n margin-left: -32px;\n }\n\n @media ", " {\n &:focus {\n outline: 0;\n }\n }\n"])), function (_ref2) {
|
|
3607
3772
|
var dark = _ref2.dark,
|
|
3608
3773
|
disabled = _ref2.disabled;
|
|
3609
3774
|
if (dark) return disabled ? 'lightgrey' : 'white';
|
|
@@ -3612,7 +3777,7 @@ var TickboxLabel = /*#__PURE__*/styled__default.label(_templateObject2$e || (_te
|
|
|
3612
3777
|
var disabled = _ref3.disabled;
|
|
3613
3778
|
return disabled ? 'not-allowed' : 'pointer';
|
|
3614
3779
|
}, devices.mobileAndTablet);
|
|
3615
|
-
var TickboxCheckmark = /*#__PURE__*/styled__default.span(_templateObject3$
|
|
3780
|
+
var TickboxCheckmark = /*#__PURE__*/styled__default.span(_templateObject3$9 || (_templateObject3$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 1px;\n left: 0;\n height: 20px;\n width: 20px;\n padding: 3px;\n box-sizing: border-box;\n border: 1px solid\n var(\n --base-color-", "\n );\n background-color: var(--base-color-", ");\n outline: ", ";\n\n svg {\n display: none;\n }\n\n @media ", " {\n top: 0;\n }\n"])), function (_ref4) {
|
|
3616
3781
|
var dark = _ref4.dark,
|
|
3617
3782
|
disabled = _ref4.disabled,
|
|
3618
3783
|
error = _ref4.error;
|
|
@@ -3628,7 +3793,7 @@ var TickboxCheckmark = /*#__PURE__*/styled__default.span(_templateObject3$8 || (
|
|
|
3628
3793
|
dark = _ref6.dark;
|
|
3629
3794
|
return dark && error ? '1px solid var(--base-color-errorstate)' : 'none';
|
|
3630
3795
|
}, devices.mobile);
|
|
3631
|
-
var TickboxInput = /*#__PURE__*/styled__default.input(_templateObject4$
|
|
3796
|
+
var TickboxInput = /*#__PURE__*/styled__default.input(_templateObject4$6 || (_templateObject4$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n &:checked ~ ", " {\n background-color: var(\n --base-color-", "\n );\n & svg {\n display: block;\n path {\n fill: var(\n --base-color-", "\n );\n }\n }\n }\n"])), TickboxCheckmark, function (_ref7) {
|
|
3632
3797
|
var dark = _ref7.dark,
|
|
3633
3798
|
whiteBox = _ref7.whiteBox,
|
|
3634
3799
|
disabled = _ref7.disabled;
|
|
@@ -3644,6 +3809,10 @@ var TickboxInput = /*#__PURE__*/styled__default.input(_templateObject4$5 || (_te
|
|
|
3644
3809
|
return 'white';
|
|
3645
3810
|
});
|
|
3646
3811
|
|
|
3812
|
+
/**
|
|
3813
|
+
* DEPRECATED. Use Tickbox2 instead
|
|
3814
|
+
*/
|
|
3815
|
+
|
|
3647
3816
|
var Tickbox = function Tickbox(_ref) {
|
|
3648
3817
|
var children = _ref.children,
|
|
3649
3818
|
onChange = _ref.onChange,
|
|
@@ -3682,7 +3851,7 @@ var Tickbox = function Tickbox(_ref) {
|
|
|
3682
3851
|
};
|
|
3683
3852
|
|
|
3684
3853
|
var isDarkMode = mode === exports.TickboxMode.Dark;
|
|
3685
|
-
return /*#__PURE__*/React__default.createElement(TickboxLabel, {
|
|
3854
|
+
return /*#__PURE__*/React__default.createElement(TickboxLabel$1, {
|
|
3686
3855
|
tabIndex: 0,
|
|
3687
3856
|
onKeyPress: spaceButtonHandler,
|
|
3688
3857
|
dark: isDarkMode,
|
|
@@ -3712,19 +3881,131 @@ var Tickbox = function Tickbox(_ref) {
|
|
|
3712
3881
|
}, error)));
|
|
3713
3882
|
};
|
|
3714
3883
|
|
|
3715
|
-
var _templateObject$
|
|
3716
|
-
var
|
|
3884
|
+
var _templateObject$s, _templateObject2$g, _templateObject3$a, _templateObject4$7, _templateObject5$3, _templateObject6$2;
|
|
3885
|
+
var Container$2 = /*#__PURE__*/styled__default.div(_templateObject$s || (_templateObject$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
3886
|
+
var Tickbox$1 = /*#__PURE__*/styled__default.div(_templateObject2$g || (_templateObject2$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 1px;\n left: 0;\n z-index: 1;\n box-sizing: border-box;\n width: 20px;\n height: 20px;\n display: flex;\n align-items: center;\n justify-content: center;\n border: ", ";\n background-color: ", ";\n color: ", ";\n"])), function (_ref) {
|
|
3887
|
+
var error = _ref.error,
|
|
3888
|
+
darkMode = _ref.darkMode,
|
|
3889
|
+
disabled = _ref.disabled;
|
|
3890
|
+
if (error !== undefined) return '1px solid var(--error-color-state)';
|
|
3891
|
+
if (disabled) return '1px solid var(--base-color-midgrey)';
|
|
3892
|
+
if (darkMode) return '1px solid var(--base-color-white)';
|
|
3893
|
+
return '1px solid var(--base-color-black)';
|
|
3894
|
+
}, function (_ref2) {
|
|
3895
|
+
var disabled = _ref2.disabled,
|
|
3896
|
+
darkMode = _ref2.darkMode;
|
|
3897
|
+
if (disabled) return 'var(--base-color-lightgrey)';
|
|
3898
|
+
if (darkMode) return 'var(--base-color-white)';
|
|
3899
|
+
return ' var(--base-color-white)';
|
|
3900
|
+
}, function (_ref3) {
|
|
3901
|
+
var disabled = _ref3.disabled,
|
|
3902
|
+
blackBox = _ref3.blackBox,
|
|
3903
|
+
darkMode = _ref3.darkMode;
|
|
3904
|
+
if (disabled) return 'var(--base-color-midgrey)';
|
|
3905
|
+
if (darkMode) return 'var(--base-color-black)';
|
|
3906
|
+
if (blackBox) return 'var(--base-color-white)';
|
|
3907
|
+
return ' var(--base-color-black)';
|
|
3908
|
+
});
|
|
3909
|
+
var TickboxLabel$2 = /*#__PURE__*/styled__default.label(_templateObject3$a || (_templateObject3$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-left: 32px;\n input[type='checkbox'] {\n width: 1px;\n height: 1px;\n position: absolute;\n top: 0;\n left: 0;\n opacity: 0;\n z-index: 0;\n &:checked + ", " {\n background-color: ", ";\n }\n &:focus + ", " {\n outline: ", ";\n }\n }\n"])), Tickbox$1, function (_ref4) {
|
|
3910
|
+
var blackBox = _ref4.blackBox,
|
|
3911
|
+
darkMode = _ref4.darkMode;
|
|
3912
|
+
if (darkMode) return 'var(--base-color-white)';
|
|
3913
|
+
if (blackBox) return 'var(--base-color-black)';
|
|
3914
|
+
return ' var(--base-color-white)';
|
|
3915
|
+
}, Tickbox$1, function (_ref5) {
|
|
3916
|
+
var darkMode = _ref5.darkMode;
|
|
3917
|
+
if (darkMode) return '4px solid var(--base-color-lemonchiffon)';
|
|
3918
|
+
return '3px solid var(--base-color-lapislazuli)';
|
|
3919
|
+
});
|
|
3920
|
+
var TickboxIcon = /*#__PURE__*/styled__default.div(_templateObject4$7 || (_templateObject4$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n color: inherit;\n svg {\n font-size: 12px;\n width: 1em;\n height: 1em;\n fill: currentColor;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n input[type='checkbox']:checked + ", " & {\n display: block;\n }\n"])), Tickbox$1);
|
|
3921
|
+
var TextLabel$2 = /*#__PURE__*/styled__default.div(_templateObject5$3 || (_templateObject5$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref6) {
|
|
3922
|
+
var darkMode = _ref6.darkMode,
|
|
3923
|
+
disabled = _ref6.disabled;
|
|
3924
|
+
if (darkMode && disabled) return 'var(--base-color-lightgrey)';
|
|
3925
|
+
if (darkMode) return 'var(--base-color-white)';
|
|
3926
|
+
if (disabled) return 'var(--base-color-darkgrey)';
|
|
3927
|
+
return 'var(--base-color-black)';
|
|
3928
|
+
});
|
|
3929
|
+
var ErrorLabel$2 = /*#__PURE__*/styled__default.div(_templateObject6$2 || (_templateObject6$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref7) {
|
|
3930
|
+
var darkMode = _ref7.darkMode;
|
|
3931
|
+
if (darkMode) return 'var(--base-color-white)';
|
|
3932
|
+
return 'var(--base-color-errorstate)';
|
|
3933
|
+
});
|
|
3934
|
+
|
|
3935
|
+
var _excluded$9 = ["children", "disabled", "error", "darkMode", "blackBox"];
|
|
3936
|
+
/**
|
|
3937
|
+
* A Tickbox component, that wraps around the native `<input type="checkbox"/>` element
|
|
3938
|
+
* and adds some extra styling, states and information around it (i.e. an error label,
|
|
3939
|
+
* error state).
|
|
3940
|
+
*
|
|
3941
|
+
* # Error state
|
|
3942
|
+
* An error label will be shown below the tickbox if the `error` prop exists.
|
|
3943
|
+
* Also tickbox will be rendered with a red border. An empty string can be passed to
|
|
3944
|
+
* render only error state without error message.
|
|
3945
|
+
*
|
|
3946
|
+
* # Light / Dark mode
|
|
3947
|
+
* The component can also adapt its styles for light / dark mode. If you want this component
|
|
3948
|
+
* to be rendered on a dark / coloured background, you can use the `darkMode` prop.
|
|
3949
|
+
*
|
|
3950
|
+
* # Black box mode
|
|
3951
|
+
* If `blackBox` prop is true checked state will be styled as black box with white tick icon.
|
|
3952
|
+
* This style was used before as a default. Not preferred in new components.
|
|
3953
|
+
* This will be ignored if `darkMode` is true.
|
|
3954
|
+
*/
|
|
3955
|
+
|
|
3956
|
+
var Tickbox2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
3957
|
+
var children = _ref.children,
|
|
3958
|
+
_ref$disabled = _ref.disabled,
|
|
3959
|
+
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
3960
|
+
error = _ref.error,
|
|
3961
|
+
_ref$darkMode = _ref.darkMode,
|
|
3962
|
+
darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
|
|
3963
|
+
_ref$blackBox = _ref.blackBox,
|
|
3964
|
+
blackBox = _ref$blackBox === void 0 ? false : _ref$blackBox,
|
|
3965
|
+
inputProps = _objectWithoutPropertiesLoose(_ref, _excluded$9);
|
|
3966
|
+
|
|
3967
|
+
return /*#__PURE__*/React__default.createElement(Container$2, null, /*#__PURE__*/React__default.createElement(TickboxLabel$2, {
|
|
3968
|
+
darkMode: darkMode,
|
|
3969
|
+
blackBox: blackBox
|
|
3970
|
+
}, /*#__PURE__*/React__default.createElement("input", Object.assign({}, inputProps, {
|
|
3971
|
+
disabled: disabled,
|
|
3972
|
+
type: "checkbox",
|
|
3973
|
+
ref: ref,
|
|
3974
|
+
"data-testid": "tickbox-input"
|
|
3975
|
+
})), /*#__PURE__*/React__default.createElement(Tickbox$1, {
|
|
3976
|
+
error: error,
|
|
3977
|
+
darkMode: darkMode,
|
|
3978
|
+
disabled: disabled,
|
|
3979
|
+
blackBox: blackBox
|
|
3980
|
+
}, /*#__PURE__*/React__default.createElement(TickboxIcon, null, /*#__PURE__*/React__default.createElement(Icon, {
|
|
3981
|
+
iconName: "Tick"
|
|
3982
|
+
}))), /*#__PURE__*/React__default.createElement(TextLabel$2, {
|
|
3983
|
+
disabled: disabled,
|
|
3984
|
+
darkMode: darkMode,
|
|
3985
|
+
"data-testid": "tickbox-content"
|
|
3986
|
+
}, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
3987
|
+
level: 1
|
|
3988
|
+
}, children))), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$2, {
|
|
3989
|
+
darkMode: darkMode,
|
|
3990
|
+
"data-testid": "tickbox-error-label"
|
|
3991
|
+
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
3992
|
+
level: 6
|
|
3993
|
+
}, error)));
|
|
3994
|
+
});
|
|
3995
|
+
|
|
3996
|
+
var _templateObject$t, _templateObject2$h, _templateObject3$b, _templateObject4$8, _templateObject5$4, _templateObject6$3, _templateObject7, _templateObject8;
|
|
3997
|
+
var TimerWrapper = /*#__PURE__*/styled__default.div(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-", ");\n"])), function (_ref) {
|
|
3717
3998
|
var color = _ref.color;
|
|
3718
3999
|
return color;
|
|
3719
4000
|
});
|
|
3720
|
-
var Line = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4001
|
+
var Line = /*#__PURE__*/styled__default.div(_templateObject2$h || (_templateObject2$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 1px;\n background-color: var(--base-color-", ");\n margin-top: 32px;\n\n @media ", " {\n margin-top: 20px;\n }\n"])), function (_ref2) {
|
|
3721
4002
|
var color = _ref2.color;
|
|
3722
4003
|
return color;
|
|
3723
4004
|
}, devices.mobileAndTablet);
|
|
3724
|
-
var TitleWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
3725
|
-
var ValuesWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
3726
|
-
var TimerLabel = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
3727
|
-
var TimerValueSeparator = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
4005
|
+
var TitleWrapper = /*#__PURE__*/styled__default.div(_templateObject3$b || (_templateObject3$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 16px;\n\n @media ", " {\n margin-bottom: 8px;\n }\n"])), devices.mobileAndTablet);
|
|
4006
|
+
var ValuesWrapper = /*#__PURE__*/styled__default.div(_templateObject4$8 || (_templateObject4$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n display: flex;\n\n @media ", " {\n font-size: var(--font-size-header-5);\n }\n"])), devices.tablet);
|
|
4007
|
+
var TimerLabel = /*#__PURE__*/styled__default.div(_templateObject5$4 || (_templateObject5$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n margin-top: 4px;\n"])));
|
|
4008
|
+
var TimerValueSeparator = /*#__PURE__*/styled__default.div(_templateObject6$3 || (_templateObject6$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 20px;\n\n @media ", " {\n margin: 0 12px;\n }\n\n @media ", " {\n margin: 0 12px;\n }\n"])), devices.tablet, devices.mobile);
|
|
3728
4009
|
var TimerValueWrapper = /*#__PURE__*/styled__default.div(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
3729
4010
|
var TimerValue = /*#__PURE__*/styled__default.div(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
3730
4011
|
|
|
@@ -3821,8 +4102,8 @@ var Timer = function Timer(_ref) {
|
|
|
3821
4102
|
}));
|
|
3822
4103
|
};
|
|
3823
4104
|
|
|
3824
|
-
var _templateObject$
|
|
3825
|
-
var TypeTagsContainer = /*#__PURE__*/styled__default.ul(_templateObject$
|
|
4105
|
+
var _templateObject$u;
|
|
4106
|
+
var TypeTagsContainer = /*#__PURE__*/styled__default.ul(_templateObject$u || (_templateObject$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n\n & li {\n display: inline-block;\n margin: 0;\n }\n\n & li:before {\n content: '\u2014';\n margin: 0 0.5em;\n }\n\n & li:first-child:before {\n display: none;\n }\n"])));
|
|
3826
4107
|
|
|
3827
4108
|
var TypeTags = function TypeTags(_ref) {
|
|
3828
4109
|
var list = _ref.list;
|
|
@@ -3835,13 +4116,13 @@ var TypeTags = function TypeTags(_ref) {
|
|
|
3835
4116
|
}));
|
|
3836
4117
|
};
|
|
3837
4118
|
|
|
3838
|
-
var _templateObject$
|
|
3839
|
-
var VideoPlayButton = /*#__PURE__*/styled__default.button(_templateObject$
|
|
3840
|
-
var VideoControlsWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3841
|
-
var VideoVolume = /*#__PURE__*/styled__default.input(_templateObject3$
|
|
3842
|
-
var VideoMute = /*#__PURE__*/styled__default.button(_templateObject4$
|
|
3843
|
-
var thumbStyes = /*#__PURE__*/styled.css(_templateObject5$
|
|
3844
|
-
var trackStyles = /*#__PURE__*/styled.css(_templateObject6$
|
|
4119
|
+
var _templateObject$v, _templateObject2$i, _templateObject3$c, _templateObject4$9, _templateObject5$5, _templateObject6$4, _templateObject7$1;
|
|
4120
|
+
var VideoPlayButton = /*#__PURE__*/styled__default.button(_templateObject$v || (_templateObject$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background-color: #fff;\n border: none;\n padding: 12px;\n"])));
|
|
4121
|
+
var VideoControlsWrapper = /*#__PURE__*/styled__default.div(_templateObject2$i || (_templateObject2$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: 50px;\n bottom: 24px;\n display: flex;\n align-items: center;\n @media ", " {\n left: 20px;\n bottom: 12px;\n }\n"])), devices.mobile);
|
|
4122
|
+
var VideoVolume = /*#__PURE__*/styled__default.input(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100px;\n margin-left: 24px;\n"])));
|
|
4123
|
+
var VideoMute = /*#__PURE__*/styled__default.button(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 17px;\n height: 17px;\n background: none;\n border: none;\n padding: 0;\n svg {\n width: 100%;\n height: 100%;\n }\n"])));
|
|
4124
|
+
var thumbStyes = /*#__PURE__*/styled.css(_templateObject5$5 || (_templateObject5$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n -webkit-appearance: none;\n appearance: none;\n border: none;\n height: 8px;\n width: 8px;\n border-radius: 50%;\n background: #ffffff;\n border: none;\n transform: translateY(-25%);\n"])));
|
|
4125
|
+
var trackStyles = /*#__PURE__*/styled.css(_templateObject6$4 || (_templateObject6$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n cursor: pointer;\n height: 4px;\n cursor: pointer;\n background: rgb(241, 241, 241, 0.5);\n border-radius: 1.3px;\n border: none;\n"])));
|
|
3845
4126
|
var VolumeControlsWrapper = /*#__PURE__*/styled__default.div(_templateObject7$1 || (_templateObject7$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n margin: 12px 12px;\n padding: 0;\n background-color: rgb(26, 26, 26, 0.6);\n height: 36px;\n width: ", ";\n align-items: center;\n justify-content: center;\n\n /* Range slider overrides */\n input[type='range' i] {\n -webkit-appearance: none;\n appearance: none;\n width: 42px;\n margin: 0;\n margin-left: 7px;\n background: transparent; /* Otherwise white in Chrome */\n\n ::-webkit-slider-runnable-track {\n ", "\n }\n ::-moz-range-track {\n ", "\n }\n ::-ms-track {\n ", "\n }\n ::-ms-fill-lower {\n ", "\n }\n ::-ms-fill-upper {\n ", "\n }\n\n ::-webkit-slider-thumb {\n ", "\n }\n ::-moz-range-thumb {\n ", "\n }\n ::-ms-thumb {\n ", "\n }\n }\n"])), function (_ref) {
|
|
3846
4127
|
var volumeHidden = _ref.volumeHidden;
|
|
3847
4128
|
return volumeHidden ? '40px' : '100px';
|
|
@@ -3947,13 +4228,13 @@ var VideoControls = function VideoControls(_ref) {
|
|
|
3947
4228
|
})));
|
|
3948
4229
|
};
|
|
3949
4230
|
|
|
3950
|
-
var _templateObject$
|
|
3951
|
-
var StepperWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3952
|
-
var StepperError = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4231
|
+
var _templateObject$w, _templateObject2$j, _templateObject3$d, _templateObject4$a, _templateObject5$6;
|
|
4232
|
+
var StepperWrapper = /*#__PURE__*/styled__default.div(_templateObject$w || (_templateObject$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: left;\n align-items: left;\n"])));
|
|
4233
|
+
var StepperError = /*#__PURE__*/styled__default.div(_templateObject2$j || (_templateObject2$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-", ");\n margin-block: 15px 0;\n\n * {\n margin: 0;\n }\n"])), function (_ref) {
|
|
3953
4234
|
var darkMode = _ref.darkMode;
|
|
3954
4235
|
return darkMode ? 'white' : 'errorstate';
|
|
3955
4236
|
});
|
|
3956
|
-
var StepperBox = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4237
|
+
var StepperBox = /*#__PURE__*/styled__default.div(_templateObject3$d || (_templateObject3$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 154px;\n height: 48px;\n display: flex;\n flex-direction: row;\n align-items: center;\n border: 1px solid\n var(\n --base-color-", "\n );\n background-color: var(--base-color-", ");\n ", ";\n\n * {\n color: var(--base-color-", ");\n word-break: unset;\n user-select: none;\n }\n\n path {\n fill: var(--base-color-", ") !important;\n }\n\n & > * {\n width: 51px;\n }\n"])), function (_ref2) {
|
|
3957
4238
|
var darkMode = _ref2.darkMode,
|
|
3958
4239
|
disabled = _ref2.disabled,
|
|
3959
4240
|
error = _ref2.error;
|
|
@@ -3975,11 +4256,11 @@ var StepperBox = /*#__PURE__*/styled__default.div(_templateObject3$b || (_templa
|
|
|
3975
4256
|
var disabled = _ref6.disabled;
|
|
3976
4257
|
return disabled ? 'midgrey' : 'black';
|
|
3977
4258
|
});
|
|
3978
|
-
var StepperValue = /*#__PURE__*/styled__default.input(_templateObject4$
|
|
4259
|
+
var StepperValue = /*#__PURE__*/styled__default.input(_templateObject4$a || (_templateObject4$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 51px;\n border: 0;\n text-align: center;\n font-family: var(--font-family-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n background-color: transparent;\n cursor: ", ";\n"])), function (_ref7) {
|
|
3979
4260
|
var disabled = _ref7.disabled;
|
|
3980
4261
|
return disabled ? 'not-allowed' : 'text';
|
|
3981
4262
|
});
|
|
3982
|
-
var StepperButton = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
4263
|
+
var StepperButton = /*#__PURE__*/styled__default.div(_templateObject5$6 || (_templateObject5$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: ", ";\n\n span {\n display: flex;\n justify-content: center;\n }\n\n svg {\n width: 40%;\n height: auto;\n }\n"])), function (_ref8) {
|
|
3983
4264
|
var disabled = _ref8.disabled;
|
|
3984
4265
|
return disabled ? 'not-allowed' : 'pointer';
|
|
3985
4266
|
});
|
|
@@ -4175,22 +4456,22 @@ var Component = function Component(_ref) {
|
|
|
4175
4456
|
}, error)));
|
|
4176
4457
|
};
|
|
4177
4458
|
|
|
4178
|
-
var _templateObject$
|
|
4179
|
-
var NavigationWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4459
|
+
var _templateObject$x, _templateObject2$k, _templateObject3$e, _templateObject4$b, _templateObject5$7, _templateObject6$5, _templateObject7$2, _templateObject8$1, _templateObject9, _templateObject10, _templateObject11;
|
|
4460
|
+
var NavigationWrapper = /*#__PURE__*/styled__default.div(_templateObject$x || (_templateObject$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n ", "\n }\n"])), devices.mobileAndTablet, function (_ref) {
|
|
4180
4461
|
var isMenuOpen = _ref.isMenuOpen;
|
|
4181
4462
|
return isMenuOpen && "\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: " + zIndexes.overlay + ";\n background-color: var(--base-color-white);\n overflow-y: auto;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n ";
|
|
4182
4463
|
});
|
|
4183
|
-
var FullScreenContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4184
|
-
var NavigationGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$
|
|
4185
|
-
var SearchBackground = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
4464
|
+
var FullScreenContainer = /*#__PURE__*/styled__default.div(_templateObject2$k || (_templateObject2$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n width: 100vw;\n position: absolute;\n z-index: ", ";\n opacity: 0.4;\n"])), zIndexes.searchOverlay);
|
|
4465
|
+
var NavigationGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$e || (_templateObject3$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n background-color: var(--base-color-white);\n height: 140px;\n z-index: ", ";\n\n @media ", " {\n height: 80px;\n }\n"])), zIndexes.navigation, devices.mobile);
|
|
4466
|
+
var SearchBackground = /*#__PURE__*/styled__default.div(_templateObject4$b || (_templateObject4$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n background-color: var(--base-color-white);\n height: 100px;\n border-top: 1px solid var(--base-color-light-grey);\n width: 100%;\n position: absolute;\n top: 140px;\n z-index: ", ";\n\n @media ", " {\n height: 100%;\n top: 80px;\n }\n"])), function (_ref2) {
|
|
4186
4467
|
var visible = _ref2.visible;
|
|
4187
4468
|
return visible ? 'visible' : 'hidden';
|
|
4188
4469
|
}, zIndexes.search, devices.mobile);
|
|
4189
|
-
var GridItemSearch = /*#__PURE__*/styled__default(GridItem)(_templateObject5$
|
|
4470
|
+
var GridItemSearch = /*#__PURE__*/styled__default(GridItem)(_templateObject5$7 || (_templateObject5$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n background-color: var(--base-color-white);\n border-top: 1px solid var(--base-color-light-grey);\n width: 100%;\n position: absolute;\n top: 140px;\n z-index: ", ";\n height: 100px;\n\n @media ", " {\n height: 100%;\n top: 80px;\n }\n"])), function (_ref3) {
|
|
4190
4471
|
var visible = _ref3.visible;
|
|
4191
4472
|
return visible ? 'visible' : 'hidden';
|
|
4192
4473
|
}, zIndexes.search, devices.mobile);
|
|
4193
|
-
var NavigationGridMobile = /*#__PURE__*/styled__default(Grid)(_templateObject6$
|
|
4474
|
+
var NavigationGridMobile = /*#__PURE__*/styled__default(Grid)(_templateObject6$5 || (_templateObject6$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n display: grid;\n background-color: var(--base-color-white);\n padding-top: ", ";\n padding-bottom: var(--navigation-large-margin);\n }\n"])), devices.mobileAndTablet, function (_ref4) {
|
|
4194
4475
|
var theme = _ref4.theme;
|
|
4195
4476
|
return theme.spacing[12];
|
|
4196
4477
|
});
|
|
@@ -4200,8 +4481,8 @@ var NavContainer = /*#__PURE__*/styled__default.div(_templateObject9 || (_templa
|
|
|
4200
4481
|
var NavContainerGridItem = /*#__PURE__*/styled__default(GridItem)(_templateObject10 || (_templateObject10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 3 / span 14;\n }\n"])), devices.desktop);
|
|
4201
4482
|
var NavTopContainer = /*#__PURE__*/styled__default.div(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 26px;\n right: 50px;\n top: 20px;\n position: absolute;\n\n @media ", " {\n margin-top: 1px;\n position: inherit;\n }\n"])), devices.mobileAndTablet);
|
|
4202
4483
|
|
|
4203
|
-
var _templateObject$
|
|
4204
|
-
var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4484
|
+
var _templateObject$y;
|
|
4485
|
+
var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$y || (_templateObject$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 66px;\n height: auto;\n cursor: pointer;\n & img {\n width: auto;\n height: 100%;\n }\n"])));
|
|
4205
4486
|
|
|
4206
4487
|
var Logo$1 = function Logo(_ref) {
|
|
4207
4488
|
var _ref$id = _ref.id,
|
|
@@ -4230,11 +4511,11 @@ var Logo$1 = function Logo(_ref) {
|
|
|
4230
4511
|
}))));
|
|
4231
4512
|
};
|
|
4232
4513
|
|
|
4233
|
-
var _templateObject$
|
|
4234
|
-
var NavTopContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4514
|
+
var _templateObject$z;
|
|
4515
|
+
var NavTopContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$z || (_templateObject$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 16px;\n justify-content: flex-end;\n height: 26px;\n\n @media ", " {\n column-gap: 8px;\n }\n"])), devices.mobile);
|
|
4235
4516
|
|
|
4236
|
-
var _templateObject$
|
|
4237
|
-
var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4517
|
+
var _templateObject$A, _templateObject2$l, _templateObject3$f, _templateObject4$c;
|
|
4518
|
+
var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$A || (_templateObject$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && a {\n color: var(--base-color-", ");\n }\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n\n ", "\n"])), function (_ref) {
|
|
4238
4519
|
var selected = _ref.selected,
|
|
4239
4520
|
colorPrimary = _ref.colorPrimary;
|
|
4240
4521
|
|
|
@@ -4262,9 +4543,9 @@ var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$y || (_te
|
|
|
4262
4543
|
|
|
4263
4544
|
return '';
|
|
4264
4545
|
});
|
|
4265
|
-
var SvgContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4266
|
-
var NumContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4267
|
-
var BasketText = /*#__PURE__*/styled__default.a(_templateObject4$
|
|
4546
|
+
var SvgContainer = /*#__PURE__*/styled__default.div(_templateObject2$l || (_templateObject2$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n"])));
|
|
4547
|
+
var NumContainer = /*#__PURE__*/styled__default.div(_templateObject3$f || (_templateObject3$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n width: 12px;\n height: 12px;\n position: absolute;\n top: 8px;\n margin-left: 6px;\n\n & .basket-num {\n color: white;\n font-size: 10px;\n font-family: var(--font-family-navigation);\n }\n"])));
|
|
4548
|
+
var BasketText = /*#__PURE__*/styled__default.a(_templateObject4$c || (_templateObject4$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n color: var(--base-color-black);\n margin-left: 6px;\n text-decoration: none;\n"])));
|
|
4268
4549
|
|
|
4269
4550
|
var getSecondsUntil = function getSecondsUntil(expiryUnixTimestamp) {
|
|
4270
4551
|
if (!expiryUnixTimestamp) return 0;
|
|
@@ -4422,8 +4703,8 @@ var Basket$1 = function Basket(_ref) {
|
|
|
4422
4703
|
}, expiryTime ? basketText : text) : ''));
|
|
4423
4704
|
};
|
|
4424
4705
|
|
|
4425
|
-
var _templateObject$
|
|
4426
|
-
var SearchContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4706
|
+
var _templateObject$B, _templateObject2$m;
|
|
4707
|
+
var SearchContainer = /*#__PURE__*/styled__default.div(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n cursor: pointer;\n border-bottom: 1px solid var(--base-color-transparent);\n ", "\n\n :hover {\n border-bottom: 1px solid var(--base-color-", ");\n && svg path {\n fill: var(--base-color-", ");\n }\n }\n"])), function (_ref) {
|
|
4427
4708
|
var selected = _ref.selected,
|
|
4428
4709
|
colorPrimary = _ref.colorPrimary;
|
|
4429
4710
|
|
|
@@ -4439,7 +4720,7 @@ var SearchContainer = /*#__PURE__*/styled__default.div(_templateObject$z || (_te
|
|
|
4439
4720
|
var colorPrimary = _ref3.colorPrimary;
|
|
4440
4721
|
return colorPrimary;
|
|
4441
4722
|
});
|
|
4442
|
-
var SvgContainer$1 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4723
|
+
var SvgContainer$1 = /*#__PURE__*/styled__default.div(_templateObject2$m || (_templateObject2$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n"])));
|
|
4443
4724
|
|
|
4444
4725
|
var Search$1 = function Search(_ref) {
|
|
4445
4726
|
var _ref$selected = _ref.selected,
|
|
@@ -4715,23 +4996,23 @@ var NavTop = function NavTop(_ref) {
|
|
|
4715
4996
|
}));
|
|
4716
4997
|
};
|
|
4717
4998
|
|
|
4718
|
-
var _templateObject$
|
|
4719
|
-
var TabsContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4720
|
-
var ItemsContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4999
|
+
var _templateObject$C, _templateObject2$n, _templateObject3$g, _templateObject4$d;
|
|
5000
|
+
var TabsContainer = /*#__PURE__*/styled__default.div(_templateObject$C || (_templateObject$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
|
|
5001
|
+
var ItemsContainer = /*#__PURE__*/styled__default.div(_templateObject2$n || (_templateObject2$n = /*#__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) {
|
|
4721
5002
|
if (props.showMenu) {
|
|
4722
5003
|
return "\n display: flex;\n flex-direction: column;\n row-gap: 32px;\n ";
|
|
4723
5004
|
}
|
|
4724
5005
|
|
|
4725
5006
|
return "display: none;";
|
|
4726
5007
|
});
|
|
4727
|
-
var MenuContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5008
|
+
var MenuContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$g || (_templateObject3$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n width: 60px;\n\n & a {\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-black);\n text-decoration: none;\n cursor: pointer;\n\n :hover {\n color: var(--base-color-", ");\n }\n }\n\n :hover {\n && svg path {\n fill: var(--base-color-", ");\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"])), function (_ref) {
|
|
4728
5009
|
var colorPrimary = _ref.colorPrimary;
|
|
4729
5010
|
return colorPrimary;
|
|
4730
5011
|
}, function (_ref2) {
|
|
4731
5012
|
var colorPrimary = _ref2.colorPrimary;
|
|
4732
5013
|
return colorPrimary;
|
|
4733
5014
|
}, devices.mobileAndTablet);
|
|
4734
|
-
var MenuItem = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
5015
|
+
var MenuItem = /*#__PURE__*/styled__default.div(_templateObject4$d || (_templateObject4$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n a {\n margin-left: 20px;\n }\n }\n"])), devices.mobileAndTablet);
|
|
4735
5016
|
|
|
4736
5017
|
var Tabs = function Tabs(_ref) {
|
|
4737
5018
|
var _ref$items = _ref.items,
|
|
@@ -4858,12 +5139,12 @@ var Tabs = function Tabs(_ref) {
|
|
|
4858
5139
|
}, "MENU"))));
|
|
4859
5140
|
};
|
|
4860
5141
|
|
|
4861
|
-
var _templateObject$
|
|
4862
|
-
var SearchBarContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4863
|
-
var SvgContainerSearch = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4864
|
-
var SvgContainerClose = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4865
|
-
var InputContainer = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
4866
|
-
var SearchLinkContainer = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
5142
|
+
var _templateObject$D, _templateObject2$o, _templateObject3$h, _templateObject5$8, _templateObject6$6, _templateObject7$3;
|
|
5143
|
+
var SearchBarContainer = /*#__PURE__*/styled__default.div(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 64px;\n justify-content: space-between;\n align-items: center;\n height: 100%;\n background-color: var(--base-color-transparent);\n\n @media ", " {\n column-gap: 12px;\n }\n"])), devices.mobile);
|
|
5144
|
+
var SvgContainerSearch = /*#__PURE__*/styled__default.div(_templateObject2$o || (_templateObject2$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-xlarge-gap);\n height: var(--navigation-xlarge-gap);\n }\n"])));
|
|
5145
|
+
var SvgContainerClose = /*#__PURE__*/styled__default.div(_templateObject3$h || (_templateObject3$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n\n :hover {\n cursor: pointer;\n && svg path {\n fill: var(--base-color-navigation);\n }\n }\n"])));
|
|
5146
|
+
var InputContainer = /*#__PURE__*/styled__default.div(_templateObject5$8 || (_templateObject5$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: blue;\n width: 100%;\n\n input {\n font-size: var(--font-size-search);\n font-family: var(--font-family-search);\n border: none;\n border-radius: 0;\n outline: none;\n outline-color: var(--base-color-white);\n height: 48px;\n box-sizing: border-box;\n width: 100%;\n -webkit-appearance: none;\n\n &.search-input {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n @media ", " {\n column-gap: 24px;\n }\n }\n"])), devices.mobile);
|
|
5147
|
+
var SearchLinkContainer = /*#__PURE__*/styled__default.div(_templateObject6$6 || (_templateObject6$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
4867
5148
|
var SearchArrowContainer = /*#__PURE__*/styled__default.a(_templateObject7$3 || (_templateObject7$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n height: 24px;\n width: 24px;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
4868
5149
|
|
|
4869
5150
|
var SearchBar = function SearchBar(_ref) {
|
|
@@ -5096,18 +5377,18 @@ var Navigation = function Navigation(_ref) {
|
|
|
5096
5377
|
})))));
|
|
5097
5378
|
};
|
|
5098
5379
|
|
|
5099
|
-
var _templateObject$
|
|
5100
|
-
var FooterSection = /*#__PURE__*/styled__default.section(_templateObject$
|
|
5101
|
-
var FooterContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
5102
|
-
var PolicyLinksRow = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5103
|
-
var ContactNewsletterRow = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
5104
|
-
var ArtsLogoRow = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
5105
|
-
var AdditionalInfo = /*#__PURE__*/styled__default.p(_templateObject6$
|
|
5380
|
+
var _templateObject$E, _templateObject2$p, _templateObject3$i, _templateObject4$e, _templateObject5$9, _templateObject6$7;
|
|
5381
|
+
var FooterSection = /*#__PURE__*/styled__default.section(_templateObject$E || (_templateObject$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n color: var(--base-color-white);\n"])));
|
|
5382
|
+
var FooterContainer = /*#__PURE__*/styled__default.div(_templateObject2$p || (_templateObject2$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--footer-height);\n padding-top: var(--footer-padding-top);\n padding-bottom: var(--footer-padding-bottom);\n display: grid;\n grid-template-rows:\n min-content var(--footer-vertical-spacing-lg) min-content var(--footer-vertical-spacing-lg) min-content var(\n --footer-vertical-spacing-sm\n )\n min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2'\n '.'\n 'row3'\n '.'\n 'row4';\n"])));
|
|
5383
|
+
var PolicyLinksRow = /*#__PURE__*/styled__default.div(_templateObject3$i || (_templateObject3$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row1;\n justify-self: center;\n\n @media ", " {\n & {\n justify-self: start;\n grid-area: row2;\n }\n }\n"])), devices.mobile);
|
|
5384
|
+
var ContactNewsletterRow = /*#__PURE__*/styled__default.div(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row2;\n\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), devices.mobile);
|
|
5385
|
+
var ArtsLogoRow = /*#__PURE__*/styled__default.div(_templateObject5$9 || (_templateObject5$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row3;\n justify-self: center;\n\n @media ", " {\n justify-self: start;\n }\n"])), devices.mobile);
|
|
5386
|
+
var AdditionalInfo = /*#__PURE__*/styled__default.p(_templateObject6$7 || (_templateObject6$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row4;\n font-family: var(--font-family-body);\n font-size: var(--font-size-body-3);\n line-height: var(--line-height-body-3);\n text-align: center;\n margin: 0;\n padding: 0;\n\n @media ", " {\n text-align: left;\n }\n"])), devices.mobile);
|
|
5106
5387
|
|
|
5107
|
-
var _templateObject$
|
|
5108
|
-
var PolicyLinksList = /*#__PURE__*/styled__default.ul(_templateObject$
|
|
5109
|
-
var PolicyLinkItem = /*#__PURE__*/styled__default.li(_templateObject2$
|
|
5110
|
-
var PolicyLink = /*#__PURE__*/styled__default.a(_templateObject3$
|
|
5388
|
+
var _templateObject$F, _templateObject2$q, _templateObject3$j;
|
|
5389
|
+
var PolicyLinksList = /*#__PURE__*/styled__default.ul(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 auto;\n padding: 0;\n list-style: none;\n display: flex;\n gap: var(--footer-items-gap);\n\n @media ", " {\n & {\n margin: 0;\n flex-direction: column;\n }\n }\n"])), devices.mobile);
|
|
5390
|
+
var PolicyLinkItem = /*#__PURE__*/styled__default.li(_templateObject2$q || (_templateObject2$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n text-align: center;\n\n @media ", " {\n & {\n text-align: left;\n }\n }\n"])), devices.mobile);
|
|
5391
|
+
var PolicyLink = /*#__PURE__*/styled__default.a(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: fit-content;\n text-decoration: none;\n text-transform: uppercase;\n color: var(--base-color-white);\n cursor: pointer;\n"])));
|
|
5111
5392
|
|
|
5112
5393
|
var PolicyLinks = function PolicyLinks(_ref) {
|
|
5113
5394
|
var _ref$items = _ref.items,
|
|
@@ -5123,13 +5404,13 @@ var PolicyLinks = function PolicyLinks(_ref) {
|
|
|
5123
5404
|
}));
|
|
5124
5405
|
};
|
|
5125
5406
|
|
|
5126
|
-
var _templateObject$
|
|
5127
|
-
var ContactNewsletterWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5128
|
-
var ContactNewsletterSeparator = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
5129
|
-
var SignUpWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5130
|
-
var SignUpText = /*#__PURE__*/styled__default.p(_templateObject4$
|
|
5131
|
-
var ContactWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
5132
|
-
var MediaLinksWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
5407
|
+
var _templateObject$G, _templateObject2$r, _templateObject3$k, _templateObject4$f, _templateObject5$a, _templateObject6$8, _templateObject7$4, _templateObject8$2;
|
|
5408
|
+
var ContactNewsletterWrapper = /*#__PURE__*/styled__default.div(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: calc(50% - 1px) 2px calc(50% - 1px);\n grid-template-rows: 100px;\n gap: 0;\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content min-content;\n gap: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
5409
|
+
var ContactNewsletterSeparator = /*#__PURE__*/styled__default.div(_templateObject2$r || (_templateObject2$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 2;\n justify-self: center;\n height: 100%;\n border: 1px solid var(--base-color-white);\n\n @media ", " {\n & {\n grid-column: auto;\n display: none;\n }\n }\n"])), devices.mobile);
|
|
5410
|
+
var SignUpWrapper = /*#__PURE__*/styled__default.div(_templateObject3$k || (_templateObject3$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1;\n padding-top: 9px;\n justify-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n\n @media ", " {\n & {\n grid-column: auto;\n align-items: start;\n justify-self: start;\n padding-top: 0;\n }\n }\n"])), devices.mobile);
|
|
5411
|
+
var SignUpText = /*#__PURE__*/styled__default.p(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-body-2);\n line-height: var(--line-height-body-2);\n width: 60%;\n margin: 0 auto;\n height: 60px;\n text-align: center;\n\n @media ", " {\n & {\n width: 100%;\n height: auto;\n text-align: left;\n font-size: 14px;\n margin-bottom: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
5412
|
+
var ContactWrapper = /*#__PURE__*/styled__default.div(_templateObject5$a || (_templateObject5$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 3;\n justify-self: center;\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: 9px;\n\n @media ", " {\n & {\n grid-column: auto;\n align-items: start;\n justify-self: start;\n padding-top: 0;\n }\n }\n"])), devices.mobile);
|
|
5413
|
+
var MediaLinksWrapper = /*#__PURE__*/styled__default.div(_templateObject6$8 || (_templateObject6$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: var(--footer-media-gap);\n height: 60px;\n\n @media ", " {\n & {\n height: auto;\n margin-bottom: var(--footer-vertical-spacing-lg);\n }\n }\n"])), devices.mobile);
|
|
5133
5414
|
var MediaIconWrapper = /*#__PURE__*/styled__default.a(_templateObject7$4 || (_templateObject7$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--footer-media-icon-height);\n width: var(--footer-media-icon-width);\n"])));
|
|
5134
5415
|
var TextLinkWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject8$2 || (_templateObject8$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &&& {\n font-family: var(--font-family-overline);\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n line-height: var(--line-height-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n text-transform: var(--text-transform-overline);\n }\n"])));
|
|
5135
5416
|
|
|
@@ -5156,7 +5437,7 @@ var ContactNewsletter = function ContactNewsletter(_ref) {
|
|
|
5156
5437
|
}, contact.title))));
|
|
5157
5438
|
};
|
|
5158
5439
|
|
|
5159
|
-
var _excluded$
|
|
5440
|
+
var _excluded$a = ["dataRoh"];
|
|
5160
5441
|
|
|
5161
5442
|
var Footer = function Footer(_ref) {
|
|
5162
5443
|
var data = _ref.data;
|
|
@@ -5167,7 +5448,7 @@ var Footer = function Footer(_ref) {
|
|
|
5167
5448
|
|
|
5168
5449
|
var _data$artsLogo = data.artsLogo,
|
|
5169
5450
|
artsDataRoh = _data$artsLogo.dataRoh,
|
|
5170
|
-
artsLogo = _objectWithoutPropertiesLoose(_data$artsLogo, _excluded$
|
|
5451
|
+
artsLogo = _objectWithoutPropertiesLoose(_data$artsLogo, _excluded$a);
|
|
5171
5452
|
|
|
5172
5453
|
var additionalInfo = data.additionalInfo;
|
|
5173
5454
|
return /*#__PURE__*/React__default.createElement(FooterSection, null, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
@@ -5197,15 +5478,15 @@ var Footer = function Footer(_ref) {
|
|
|
5197
5478
|
}, additionalInfo)))));
|
|
5198
5479
|
};
|
|
5199
5480
|
|
|
5200
|
-
var _templateObject$
|
|
5481
|
+
var _templateObject$H, _templateObject2$s, _templateObject3$l, _templateObject4$g, _templateObject5$b, _templateObject6$9;
|
|
5201
5482
|
var LIST_ITEM_GAP = 32;
|
|
5202
|
-
var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5483
|
+
var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$H || (_templateObject$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n width: 100%;\n top: 0;\n border-bottom: ", ";\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
5203
5484
|
var bottomBorder = _ref.bottomBorder;
|
|
5204
5485
|
return bottomBorder ? '2px solid var(--base-color-light-grey)' : 'none';
|
|
5205
5486
|
}, zIndexes.anchor);
|
|
5206
|
-
var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
5207
|
-
var TabsWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5208
|
-
var TabsList = /*#__PURE__*/styled__default.ul(_templateObject4$
|
|
5487
|
+
var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$s || (_templateObject2$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
|
|
5488
|
+
var TabsWrapper = /*#__PURE__*/styled__default.div(_templateObject3$l || (_templateObject3$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
5489
|
+
var TabsList = /*#__PURE__*/styled__default.ul(_templateObject4$g || (_templateObject4$g = /*#__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 background: linear-gradient(\n 135deg,\n rgba(255, 255, 255, 1) 0%,\n rgba(255, 255, 255, 0.48) 85%,\n rgba(235, 235, 235, 0.4) 99%,\n rgba(255, 255, 255, 0.39) 100%\n );\n }\n\n @media ", " {\n & {\n width: ", ";\n }\n }\n"])), function (_ref2) {
|
|
5209
5490
|
var tabsOverflow = _ref2.tabsOverflow;
|
|
5210
5491
|
return tabsOverflow ? 'calc(100% - 74px)' : '100%';
|
|
5211
5492
|
}, LIST_ITEM_GAP, function (_ref3) {
|
|
@@ -5216,13 +5497,13 @@ var TabsList = /*#__PURE__*/styled__default.ul(_templateObject4$e || (_templateO
|
|
|
5216
5497
|
hasTwoArrows = _ref4.hasTwoArrows;
|
|
5217
5498
|
return tabsOverflow && hasTwoArrows ? 'calc(100% - 50px)' : '100%';
|
|
5218
5499
|
});
|
|
5219
|
-
var ArrowsContainer = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
5500
|
+
var ArrowsContainer = /*#__PURE__*/styled__default.div(_templateObject5$b || (_templateObject5$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n height: var(--anchor-tabs-height);\n background-color: var(--base-color-white);\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 10px;\n"])), function (_ref5) {
|
|
5220
5501
|
var fullWidth = _ref5.fullWidth;
|
|
5221
5502
|
return fullWidth ? '74px' : '46px';
|
|
5222
5503
|
});
|
|
5223
|
-
var ArrowWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
5504
|
+
var ArrowWrapper = /*#__PURE__*/styled__default.div(_templateObject6$9 || (_templateObject6$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: flex-center;\n\n :hover {\n && svg path {\n fill: var(--base-color-primary);\n }\n }\n"])));
|
|
5224
5505
|
|
|
5225
|
-
var _excluded$
|
|
5506
|
+
var _excluded$b = ["id", "text"];
|
|
5226
5507
|
|
|
5227
5508
|
var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
5228
5509
|
var tabs = _ref.tabs,
|
|
@@ -5438,7 +5719,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
5438
5719
|
}, tabs.map(function (_ref4) {
|
|
5439
5720
|
var id = _ref4.id,
|
|
5440
5721
|
text = _ref4.text,
|
|
5441
|
-
rest = _objectWithoutPropertiesLoose(_ref4, _excluded$
|
|
5722
|
+
rest = _objectWithoutPropertiesLoose(_ref4, _excluded$b);
|
|
5442
5723
|
|
|
5443
5724
|
return /*#__PURE__*/React__default.createElement("li", {
|
|
5444
5725
|
key: id
|
|
@@ -5465,18 +5746,18 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
5465
5746
|
})) : null) : null))));
|
|
5466
5747
|
};
|
|
5467
5748
|
|
|
5468
|
-
var _templateObject$
|
|
5469
|
-
var TitleCTAGridWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5749
|
+
var _templateObject$I, _templateObject2$t, _templateObject3$m, _templateObject4$h, _templateObject6$a, _templateObject7$5, _templateObject8$3, _templateObject9$1, _templateObject10$1;
|
|
5750
|
+
var TitleCTAGridWrapper = /*#__PURE__*/styled__default.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
5470
5751
|
var sticky = _ref.sticky;
|
|
5471
5752
|
return sticky ? 'sticky' : 'initial';
|
|
5472
5753
|
}, zIndexes.anchor);
|
|
5473
|
-
var TitleCTAGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
5474
|
-
var TitleCTAGridItem = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5754
|
+
var TitleCTAGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$t || (_templateObject2$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: solid 2px var(--base-color-lightgrey);\n"])));
|
|
5755
|
+
var TitleCTAGridItem = /*#__PURE__*/styled__default.div(_templateObject3$m || (_templateObject3$m = /*#__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) {
|
|
5475
5756
|
var title = _ref2.title;
|
|
5476
5757
|
return title ? 'row' : 'row-reverse';
|
|
5477
5758
|
}, devices.tablet, devices.mobile);
|
|
5478
|
-
var AnchorTitle = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
5479
|
-
var ButtonsDesktopWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
5759
|
+
var AnchorTitle = /*#__PURE__*/styled__default.div(_templateObject4$h || (_templateObject4$h = /*#__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);
|
|
5760
|
+
var ButtonsDesktopWrapper = /*#__PURE__*/styled__default.div(_templateObject6$a || (_templateObject6$a = /*#__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);
|
|
5480
5761
|
var ButtonsMobileWrapper = /*#__PURE__*/styled__default.div(_templateObject7$5 || (_templateObject7$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: block;\n }\n }\n"])), devices.mobile);
|
|
5481
5762
|
var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject8$3 || (_templateObject8$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n"])), function (_ref3) {
|
|
5482
5763
|
var theme = _ref3.theme;
|
|
@@ -5494,7 +5775,7 @@ var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_template
|
|
|
5494
5775
|
var MessageWrapper = /*#__PURE__*/styled__default.div(_templateObject9$1 || (_templateObject9$1 = /*#__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);
|
|
5495
5776
|
var MessageWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject10$1 || (_templateObject10$1 = /*#__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);
|
|
5496
5777
|
|
|
5497
|
-
var _excluded$
|
|
5778
|
+
var _excluded$c = ["text"],
|
|
5498
5779
|
_excluded2 = ["text"];
|
|
5499
5780
|
|
|
5500
5781
|
var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
@@ -5506,7 +5787,7 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
|
5506
5787
|
|
|
5507
5788
|
var _ref2 = (links == null ? void 0 : links[0]) || {},
|
|
5508
5789
|
primaryButtonText = _ref2.text,
|
|
5509
|
-
primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
5790
|
+
primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, _excluded$c);
|
|
5510
5791
|
|
|
5511
5792
|
var _ref3 = (links == null ? void 0 : links[1]) || {},
|
|
5512
5793
|
secondaryButtonText = _ref3.text,
|
|
@@ -5529,16 +5810,16 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
|
5529
5810
|
}, message)));
|
|
5530
5811
|
};
|
|
5531
5812
|
|
|
5532
|
-
var _templateObject$
|
|
5533
|
-
var Wrapper$2 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5534
|
-
var PromoLabelWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
5535
|
-
var PromoLabel = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5813
|
+
var _templateObject$J, _templateObject2$u, _templateObject3$n, _templateObject4$i, _templateObject5$c, _templateObject6$b, _templateObject7$6, _templateObject8$4;
|
|
5814
|
+
var Wrapper$2 = /*#__PURE__*/styled__default.div(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-lightgrey);\n padding: 40px;\n\n display: block;\n position: relative;\n\n @media ", " {\n margin-top: 0;\n padding: 40px 20px;\n }\n"])), devices.tablet);
|
|
5815
|
+
var PromoLabelWrapper = /*#__PURE__*/styled__default.div(_templateObject2$u || (_templateObject2$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-self: flex-end;\n height: 15px;\n"])));
|
|
5816
|
+
var PromoLabel = /*#__PURE__*/styled__default.div(_templateObject3$n || (_templateObject3$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: ", ";\n 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 font-family: var(--font-family-header);\n font-feature-settings: 'tnum' on, 'lnum' on, 'liga' off, 'calt' off;\n font-size: var(--font-size-overline-2);\n line-height: 12px;\n text-align: center;\n letter-spacing: 1px;\n text-transform: uppercase;\n"])), function (_ref) {
|
|
5536
5817
|
var theme = _ref.theme;
|
|
5537
5818
|
return theme.colors.primary;
|
|
5538
5819
|
}, exports.Colors.White);
|
|
5539
|
-
var ButtonContainer = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
5540
|
-
var TitleContainer$1 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
5541
|
-
var OfferTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
5820
|
+
var ButtonContainer = /*#__PURE__*/styled__default.div(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 2em;\n width: fit-content;\n"])));
|
|
5821
|
+
var TitleContainer$1 = /*#__PURE__*/styled__default.div(_templateObject5$c || (_templateObject5$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin-top: 0;\n margin-bottom: 0.5em;\n }\n"])));
|
|
5822
|
+
var OfferTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin-bottom: 0.5em;\n }\n margin-bottom: 1em;\n"])));
|
|
5542
5823
|
var PriceRow = /*#__PURE__*/styled__default.div(_templateObject7$6 || (_templateObject7$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n gap: 6px 12px;\n padding: 5px 0 8px 0;\n"])));
|
|
5543
5824
|
var LineThrough = /*#__PURE__*/styled__default.div(_templateObject8$4 || (_templateObject8$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration-line: line-through;\n color: var(--base-color-darkgrey);\n"])));
|
|
5544
5825
|
|
|
@@ -5610,8 +5891,8 @@ var UpsellCard = function UpsellCard(_ref) {
|
|
|
5610
5891
|
}), link && /*#__PURE__*/React__default.createElement(ButtonContainer, null, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, link), truncate(link.text, LENGTH_SMALL_TEXT)))));
|
|
5611
5892
|
};
|
|
5612
5893
|
|
|
5613
|
-
var _templateObject$
|
|
5614
|
-
var Wrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5894
|
+
var _templateObject$K;
|
|
5895
|
+
var Wrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$K || (_templateObject$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n gap: 60px 75px;\n grid-template-columns: repeat(2, 1fr);\n width: 100%;\n\n @media ", " {\n padding-left: 0;\n padding-right: 0;\n }\n\n @media ", " {\n width: 100%;\n padding-left: 0;\n padding-right: 0;\n grid-template-columns: 1fr;\n }\n"])), devices.tablet, devices.mobile);
|
|
5615
5896
|
|
|
5616
5897
|
var UpsellCards = function UpsellCards(_ref) {
|
|
5617
5898
|
var upsellCards = _ref.upsellCards;
|
|
@@ -5629,20 +5910,20 @@ var UpsellCards = function UpsellCards(_ref) {
|
|
|
5629
5910
|
}));
|
|
5630
5911
|
};
|
|
5631
5912
|
|
|
5632
|
-
var _templateObject$
|
|
5633
|
-
var UpsellBorderBox = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5913
|
+
var _templateObject$L, _templateObject2$v, _templateObject3$o;
|
|
5914
|
+
var UpsellBorderBox = /*#__PURE__*/styled__default.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: solid 4px;\n border-color: ", ";\n padding: 80px;\n\n @media ", " {\n & {\n border-left: none;\n border-right: none;\n padding-top: 2.5em;\n padding-left: 0;\n padding-right: 0;\n padding-bottom: 2.5em;\n }\n }\n\n @media ", " {\n & {\n padding: 25px;\n padding-top: 2.5em;\n }\n }\n"])), function (_ref) {
|
|
5634
5915
|
var theme = _ref.theme;
|
|
5635
5916
|
return theme.colors.primary;
|
|
5636
5917
|
}, devices.mobile, devices.tablet);
|
|
5637
|
-
var TitleContainer$2 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
5638
|
-
var TextContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5918
|
+
var TitleContainer$2 = /*#__PURE__*/styled__default.div(_templateObject2$v || (_templateObject2$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n }\n"])), devices.mobile);
|
|
5919
|
+
var TextContainer = /*#__PURE__*/styled__default.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 2.5em;\n div > :first-child {\n margin-top: 1.5em;\n }\n\n @media ", " {\n margin-top: 0;\n div > :first-child {\n margin-top: 0.5em;\n }\n }\n\n @media ", " {\n margin-left: 1.5em;\n margin-right: 1.5em;\n & {\n div > :first-child {\n margin-top: 1em;\n }\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
5639
5920
|
|
|
5640
|
-
var _templateObject$
|
|
5641
|
-
var AccordionContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5642
|
-
var LineContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
5643
|
-
var ChildrenContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5644
|
-
var TitleContainer$3 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
5645
|
-
var ContentContainer = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
5921
|
+
var _templateObject$M, _templateObject2$w, _templateObject3$p, _templateObject4$j, _templateObject5$d;
|
|
5922
|
+
var AccordionContainer = /*#__PURE__*/styled__default.div(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n div {\n overflow: hidden;\n }\n"])));
|
|
5923
|
+
var LineContainer = /*#__PURE__*/styled__default.div(_templateObject2$w || (_templateObject2$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 2px;\n background-color: var(--base-color-lightgrey);\n width: 100%;\n"])));
|
|
5924
|
+
var ChildrenContainer = /*#__PURE__*/styled__default.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n"])), devices.mobile);
|
|
5925
|
+
var TitleContainer$3 = /*#__PURE__*/styled__default.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n\n && h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n div {\n margin: 21px 20px;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n @media ", " {\n margin: 12px 20px 12px 0px;\n }\n }\n\n && svg {\n width: var(--navigation-middle-gap);\n height: var(--navigation-middle-gap);\n margin-right: 20px;\n\n @media ", " {\n margin-right: 0px;\n }\n }\n\n :hover {\n cursor: pointer;\n }\n"])), devices.mobile, devices.mobile);
|
|
5926
|
+
var ContentContainer = /*#__PURE__*/styled__default.div(_templateObject5$d || (_templateObject5$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.2s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), devices.mobile);
|
|
5646
5927
|
|
|
5647
5928
|
var Accordion = function Accordion(_ref) {
|
|
5648
5929
|
var _ref$title = _ref.title,
|
|
@@ -5767,8 +6048,8 @@ var Accordion = function Accordion(_ref) {
|
|
|
5767
6048
|
}, children)), showLine && /*#__PURE__*/React__default.createElement(LineContainer, null));
|
|
5768
6049
|
};
|
|
5769
6050
|
|
|
5770
|
-
var _templateObject$
|
|
5771
|
-
var AccordionsContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
6051
|
+
var _templateObject$N;
|
|
6052
|
+
var AccordionsContainer = /*#__PURE__*/styled__default.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
5772
6053
|
|
|
5773
6054
|
var Accordions = function Accordions(_ref) {
|
|
5774
6055
|
var _ref$items = _ref.items,
|
|
@@ -5786,7 +6067,8 @@ var Accordions = function Accordions(_ref) {
|
|
|
5786
6067
|
visibleStandfirst: accordion.visibleStandfirst,
|
|
5787
6068
|
contentType: accordion.contentType,
|
|
5788
6069
|
displayLevel: accordion.displayLevel,
|
|
5789
|
-
semanticLevel: accordion.semanticLevel
|
|
6070
|
+
semanticLevel: accordion.semanticLevel,
|
|
6071
|
+
initOpen: accordion.initOpen
|
|
5790
6072
|
}, accordion.children);
|
|
5791
6073
|
}));
|
|
5792
6074
|
};
|
|
@@ -5800,13 +6082,13 @@ var Theme = function Theme(_ref) {
|
|
|
5800
6082
|
}, children);
|
|
5801
6083
|
};
|
|
5802
6084
|
|
|
5803
|
-
var _templateObject$
|
|
5804
|
-
var AnnouncementBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
6085
|
+
var _templateObject$O, _templateObject2$x, _templateObject3$q;
|
|
6086
|
+
var AnnouncementBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 28px 0;\n background-color: ", ";\n color: var(--base-color-white);\n\n @media ", " {\n padding: 20px 0;\n }\n"])), function (_ref) {
|
|
5805
6087
|
var theme = _ref.theme;
|
|
5806
6088
|
return theme.colors.primary;
|
|
5807
6089
|
}, devices.mobile);
|
|
5808
|
-
var SvgContainer$2 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
5809
|
-
var ContentContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
6090
|
+
var SvgContainer$2 = /*#__PURE__*/styled__default.div(_templateObject2$x || (_templateObject2$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: center;\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n\n @media ", " {\n align-items: flex-start;\n }\n"])), devices.mobile);
|
|
6091
|
+
var ContentContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$q || (_templateObject3$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.2s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n color: var(--base-color-white);\n a {\n color: var(--base-color-white);\n text-decoration: underline;\n }\n"])));
|
|
5810
6092
|
|
|
5811
6093
|
var AnnouncementBanner = function AnnouncementBanner(_ref) {
|
|
5812
6094
|
var title = _ref.title,
|
|
@@ -5843,48 +6125,49 @@ var AnnouncementBanner = function AnnouncementBanner(_ref) {
|
|
|
5843
6125
|
}))))));
|
|
5844
6126
|
};
|
|
5845
6127
|
|
|
5846
|
-
var _templateObject$
|
|
6128
|
+
var _templateObject$P, _templateObject2$y, _templateObject3$r, _templateObject4$k, _templateObject5$e, _templateObject6$c, _templateObject7$7, _templateObject8$5, _templateObject9$2, _templateObject10$2, _templateObject11$1, _templateObject12, _templateObject13;
|
|
5847
6129
|
var LENGTH_LARGE_TEXT = 28;
|
|
5848
6130
|
var LENGTH_SMALL_TEXT$1 = 19;
|
|
5849
6131
|
var LENGTH_TEXT_TABLET = 10;
|
|
5850
|
-
var CardContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
6132
|
+
var CardContainer = /*#__PURE__*/styled__default.div(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: ", ";\n position: relative;\n ", "\n\n .targetLink {\n text-decoration: none;\n color: inherit;\n }\n"])), function (_ref) {
|
|
5851
6133
|
var isCardClickable = _ref.isCardClickable;
|
|
5852
6134
|
return isCardClickable ? 'pointer' : 'default';
|
|
5853
6135
|
}, function (_ref2) {
|
|
5854
6136
|
var onlyShowButtonsOnHover = _ref2.onlyShowButtonsOnHover;
|
|
5855
6137
|
return !onlyShowButtonsOnHover ? "height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: space-between; \n " : '';
|
|
5856
6138
|
});
|
|
5857
|
-
var HoverContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
6139
|
+
var HoverContainer = /*#__PURE__*/styled__default.div(_templateObject2$y || (_templateObject2$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--editorial-spacing-hover);\n background-color: ", ";\n position: absolute;\n width: 100%;\n z-index: ", ";\n"])), function (_ref3) {
|
|
5858
6140
|
var lineColor = _ref3.lineColor,
|
|
5859
6141
|
theme = _ref3.theme;
|
|
5860
6142
|
if (lineColor === exports.Colors.Cinema) return 'var(--base-color-white)';
|
|
5861
6143
|
return lineColor ? "var(--base-color-" + lineColor + ")" : theme.colors.primary;
|
|
5862
6144
|
}, zIndexes.contentOverlay);
|
|
5863
|
-
var ProgressContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5864
|
-
var ContentContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
6145
|
+
var ProgressContainer = /*#__PURE__*/styled__default.div(_templateObject3$r || (_templateObject3$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: -10px;\n"])));
|
|
6146
|
+
var ContentContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$k || (_templateObject4$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n margin-top: var(--editorial-margin-between);\n\n @media ", " {\n margin-left: ", ";\n margin-right: ", ";\n }\n"])), devices.mobile, function (_ref4) {
|
|
5865
6147
|
var fullWidth = _ref4.fullWidth;
|
|
5866
6148
|
return fullWidth ? '0' : '20px';
|
|
5867
6149
|
}, function (_ref5) {
|
|
5868
6150
|
var fullWidth = _ref5.fullWidth;
|
|
5869
6151
|
return fullWidth ? '0' : '20px';
|
|
5870
6152
|
});
|
|
5871
|
-
var TitleContainer$4 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
5872
|
-
var TitleContainerMobile = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
6153
|
+
var TitleContainer$4 = /*#__PURE__*/styled__default.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: calc(-1 * var(--editorial-margin-between)) 0 calc(-1 * var(--editorial-margin-between)) 0;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
|
|
6154
|
+
var TitleContainerMobile = /*#__PURE__*/styled__default.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: calc(-1 * var(--editorial-margin-between)) 0 calc(-1 * var(--editorial-margin-between)) 0;\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobileAndTablet);
|
|
5873
6155
|
var TextContainer$1 = /*#__PURE__*/styled__default.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin-top: var(--editorial-spacing-hover);\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n em {\n font-family: var(--font-family-body-italics);\n }\n"])));
|
|
5874
|
-
var
|
|
5875
|
-
var
|
|
6156
|
+
var HighlightTextContainer = /*#__PURE__*/styled__default(TextContainer$1)(_templateObject8$5 || (_templateObject8$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-primary);\n margin-top: 4px;\n"])));
|
|
6157
|
+
var SubtitleContainer = /*#__PURE__*/styled__default.span(_templateObject9$2 || (_templateObject9$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n display: block;\n overflow-wrap: break-word;\n"])));
|
|
6158
|
+
var LabelContainer = /*#__PURE__*/styled__default.div(_templateObject10$2 || (_templateObject10$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n width: fit-content;\n height: 30px;\n\n @media ", " {\n margin-left: ", ";\n }\n"])), function (_ref6) {
|
|
5876
6159
|
var isVisible = _ref6.isVisible;
|
|
5877
6160
|
return isVisible ? "visible" : 'hidden';
|
|
5878
6161
|
}, devices.mobile, function (_ref7) {
|
|
5879
6162
|
var isGridCard = _ref7.isGridCard;
|
|
5880
6163
|
return isGridCard ? '20px' : '0';
|
|
5881
6164
|
});
|
|
5882
|
-
var LabelElements = /*#__PURE__*/styled__default.div(
|
|
6165
|
+
var LabelElements = /*#__PURE__*/styled__default.div(_templateObject11$1 || (_templateObject11$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: 30px;\n padding: 0 8px;\n background-color: ", ";\n color: var(--base-color-white);\n"])), function (_ref8) {
|
|
5883
6166
|
var bgColor = _ref8.bgColor,
|
|
5884
6167
|
theme = _ref8.theme;
|
|
5885
6168
|
return bgColor ? "var(--base-color-" + bgColor + ")" : theme.colors.primary;
|
|
5886
6169
|
});
|
|
5887
|
-
var LabelIconWrapper = /*#__PURE__*/styled__default.div(
|
|
6170
|
+
var LabelIconWrapper = /*#__PURE__*/styled__default.div(_templateObject12 || (_templateObject12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-left: 10px;\n\n svg {\n height: 24px;\n width: 24px;\n }\n"])));
|
|
5888
6171
|
|
|
5889
6172
|
var getButtonsOpacity = function getButtonsOpacity(_ref9) {
|
|
5890
6173
|
var onlyShowButtonsOnHover = _ref9.onlyShowButtonsOnHover;
|
|
@@ -5896,7 +6179,7 @@ var getButtonsMinHeight = function getButtonsMinHeight(_ref10) {
|
|
|
5896
6179
|
return onlyShowButtonsOnHover ? 'min-height: unset;' : 'min-height: 120px;';
|
|
5897
6180
|
};
|
|
5898
6181
|
|
|
5899
|
-
var ButtonsContainer$1 = /*#__PURE__*/styled__default.div(
|
|
6182
|
+
var ButtonsContainer$1 = /*#__PURE__*/styled__default.div(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n gap: 16px;\n margin-top: var(--editorial-margin-between);\n\n ", "\n\n @media ", " {\n ", ";\n margin-left: ", ";\n margin-right: ", ";\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n ", ";\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), getButtonsOpacity, function (_ref11) {
|
|
5900
6183
|
var size = _ref11.size,
|
|
5901
6184
|
primaryButtonTextLength = _ref11.primaryButtonTextLength,
|
|
5902
6185
|
tertiaryButtonTextLength = _ref11.tertiaryButtonTextLength;
|
|
@@ -5991,7 +6274,7 @@ var truncateReactNodeString = function truncateReactNodeString(node, resultLengt
|
|
|
5991
6274
|
return truncateHtmlString(nodeString, resultLength, addDots);
|
|
5992
6275
|
};
|
|
5993
6276
|
|
|
5994
|
-
var _excluded$
|
|
6277
|
+
var _excluded$d = ["text"],
|
|
5995
6278
|
_excluded2$1 = ["text"];
|
|
5996
6279
|
|
|
5997
6280
|
var _buttonTypeToButton;
|
|
@@ -6009,6 +6292,8 @@ var Card = function Card(_ref) {
|
|
|
6009
6292
|
subtitle = _ref.subtitle,
|
|
6010
6293
|
_ref$text = _ref.text,
|
|
6011
6294
|
text = _ref$text === void 0 ? '' : _ref$text,
|
|
6295
|
+
_ref$highlightText = _ref.highlightText,
|
|
6296
|
+
highlightText = _ref$highlightText === void 0 ? '' : _ref$highlightText,
|
|
6012
6297
|
links = _ref.links,
|
|
6013
6298
|
_ref$tags = _ref.tags,
|
|
6014
6299
|
tags = _ref$tags === void 0 ? [] : _ref$tags,
|
|
@@ -6044,7 +6329,7 @@ var Card = function Card(_ref) {
|
|
|
6044
6329
|
var _ref2 = firstButton || {},
|
|
6045
6330
|
_ref2$text = _ref2.text,
|
|
6046
6331
|
firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
6047
|
-
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
6332
|
+
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$d);
|
|
6048
6333
|
|
|
6049
6334
|
var primaryButtonTextTruncate = size === 'small' ? truncate(firstButtonText, LENGTH_SMALL_TEXT$2) : truncate(firstButtonText, LENGTH_LARGE_TEXT$1);
|
|
6050
6335
|
var secondButton = links == null ? void 0 : links[1];
|
|
@@ -6121,7 +6406,9 @@ var Card = function Card(_ref) {
|
|
|
6121
6406
|
dangerouslySetInnerHTML: {
|
|
6122
6407
|
__html: truncatedText
|
|
6123
6408
|
}
|
|
6124
|
-
})
|
|
6409
|
+
}), highlightText && /*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
6410
|
+
level: 1
|
|
6411
|
+
}, highlightText)))), links && /*#__PURE__*/React__default.createElement(ButtonsContainer$1, {
|
|
6125
6412
|
ref: node,
|
|
6126
6413
|
"data-testid": "buttonscontainer",
|
|
6127
6414
|
size: size,
|
|
@@ -6132,9 +6419,9 @@ var Card = function Card(_ref) {
|
|
|
6132
6419
|
}, firstButton && /*#__PURE__*/React__default.createElement(FirstButtonComponent, Object.assign({}, restFirstButton), primaryButtonTextTruncate), secondButton && /*#__PURE__*/React__default.createElement(SecondButtonComponent, Object.assign({}, restSecondButton), tertiaryButtonTextTruncate)));
|
|
6133
6420
|
};
|
|
6134
6421
|
|
|
6135
|
-
var _templateObject$
|
|
6136
|
-
var CardsContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
6137
|
-
var GridItemContainer = /*#__PURE__*/styled__default(GridItem)(_templateObject2$
|
|
6422
|
+
var _templateObject$Q, _templateObject2$z;
|
|
6423
|
+
var CardsContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$Q || (_templateObject$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n @media ", " {\n grid-row-gap: var(--cards-spacing-stack);\n }\n"])), devices.mobile);
|
|
6424
|
+
var GridItemContainer = /*#__PURE__*/styled__default(GridItem)(_templateObject2$z || (_templateObject2$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 1 / span 14;\n }\n"])), devices.mobile);
|
|
6138
6425
|
|
|
6139
6426
|
var Cards = function Cards(_ref) {
|
|
6140
6427
|
var cards = _ref.cards,
|
|
@@ -6165,6 +6452,7 @@ var Cards = function Cards(_ref) {
|
|
|
6165
6452
|
title: card.title,
|
|
6166
6453
|
subtitle: card.subtitle,
|
|
6167
6454
|
text: card.text,
|
|
6455
|
+
highlightText: card.highlightText,
|
|
6168
6456
|
links: card.links,
|
|
6169
6457
|
tags: card.tags,
|
|
6170
6458
|
withContinueWatching: card.withContinueWatching,
|
|
@@ -6177,18 +6465,18 @@ var Cards = function Cards(_ref) {
|
|
|
6177
6465
|
}));
|
|
6178
6466
|
};
|
|
6179
6467
|
|
|
6180
|
-
var _templateObject$
|
|
6181
|
-
var ContentWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
6182
|
-
var Wrapper$4 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
6468
|
+
var _templateObject$R, _templateObject2$A, _templateObject3$s, _templateObject4$l, _templateObject5$f;
|
|
6469
|
+
var ContentWrapper = /*#__PURE__*/styled__default.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > div {\n margin-bottom: 2px;\n\n &:first-child {\n margin-bottom: 4px;\n\n @media ", " {\n margin-bottom: 6px;\n }\n }\n }\n\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobile, devices.mobileAndTablet);
|
|
6470
|
+
var Wrapper$4 = /*#__PURE__*/styled__default.div(_templateObject2$A || (_templateObject2$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n padding: 30px 0;\n\n @media ", " {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: max-content;\n gap: var(--grid-column-gap);\n margin: 0;\n }\n"])), function (_ref) {
|
|
6183
6471
|
var hideBottomBorder = _ref.hideBottomBorder;
|
|
6184
6472
|
return "border-bottom: " + (hideBottomBorder ? 'none' : '2px solid var(--base-color-midgrey)') + ";";
|
|
6185
6473
|
}, function (_ref2) {
|
|
6186
6474
|
var hideTopBorder = _ref2.hideTopBorder;
|
|
6187
6475
|
return "border-top: " + (hideTopBorder ? 'none' : '2px solid var(--base-color-midgrey)') + ";";
|
|
6188
6476
|
}, devices.mobileAndTablet);
|
|
6189
|
-
var AddressWrapperDesktop = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
6190
|
-
var AddressWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
6191
|
-
var DetailsWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
6477
|
+
var AddressWrapperDesktop = /*#__PURE__*/styled__default.div(_templateObject3$s || (_templateObject3$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
6478
|
+
var AddressWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject4$l || (_templateObject4$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n & > div {\n margin-bottom: 2px;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
6479
|
+
var DetailsWrapper = /*#__PURE__*/styled__default.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n\n @media ", " {\n flex-direction: column;\n margin: 4px 0;\n }\n\n a {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n color: var(--base-color-black);\n text-decoration: underline;\n\n &:before {\n display: inline-block;\n content: '';\n background-color: var(--base-color-black);\n width: 1px;\n height: 18px;\n margin: 0 8px -4px;\n\n @media ", " {\n display: none;\n }\n }\n\n &:first-child:before {\n display: none;\n }\n }\n"])), devices.mobile, devices.mobile);
|
|
6192
6480
|
|
|
6193
6481
|
var divideAddressString = function divideAddressString(address) {
|
|
6194
6482
|
return address.split(',').map(function (chunk, i) {
|
|
@@ -6246,17 +6534,17 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
6246
6534
|
}, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString)))))));
|
|
6247
6535
|
};
|
|
6248
6536
|
|
|
6249
|
-
var _templateObject$
|
|
6250
|
-
var BodyTextRelative = /*#__PURE__*/styled__default(BodyText)(_templateObject$
|
|
6251
|
-
var ContentSummaryWrapper = /*#__PURE__*/styled__default.article(_templateObject2$
|
|
6537
|
+
var _templateObject$S, _templateObject2$B, _templateObject3$t, _templateObject4$m, _templateObject5$g, _templateObject6$d, _templateObject7$8;
|
|
6538
|
+
var BodyTextRelative = /*#__PURE__*/styled__default(BodyText)(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
6539
|
+
var ContentSummaryWrapper = /*#__PURE__*/styled__default.article(_templateObject2$B || (_templateObject2$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n justify-items: start;\n align-items: center;\n margin: 20px 0;\n gap: 24px;\n cursor: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n"])), function (props) {
|
|
6252
6540
|
return props.clickable ? 'pointer' : 'default';
|
|
6253
6541
|
}, devices.mobile);
|
|
6254
|
-
var ContentSummaryImageWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
6255
|
-
var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
6542
|
+
var ContentSummaryImageWrapper = /*#__PURE__*/styled__default.div(_templateObject3$t || (_templateObject3$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 0 0 33.3%;\n"])));
|
|
6543
|
+
var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject4$m || (_templateObject4$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: ", ";\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n gap: 22px;\n\n & > * {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n\n @media ", " {\n margin: 0 20px;\n gap: 12px;\n }\n\n & .content-summary-text-link {\n height: unset;\n }\n"])), function (props) {
|
|
6256
6544
|
return props.showImage ? 2 : '1 / span 4';
|
|
6257
6545
|
}, devices.mobile);
|
|
6258
|
-
var ContentSummaryTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
6259
|
-
var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
6546
|
+
var ContentSummaryTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject5$g || (_templateObject5$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin: 0;\n }\n\n @media ", " {\n & > * {\n font-size: var(--font-size-header-5);\n font-weight: var(--font-weight-header-5);\n }\n }\n"])), devices.mobile);
|
|
6547
|
+
var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
|
|
6260
6548
|
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & p:not(:last-child):after {\n content: '\\A\\A';\n white-space: pre;\n }\n\n ", "\n"], ["\n & p:not(:last-child):after {\n content: '\\\\A\\\\A';\n white-space: pre;\n }\n\n ", "\n"])), function (props) {
|
|
6261
6549
|
return !!props.truncate && "\n overflow: hidden;\n position: relative;\n display: -webkit-box;\n -webkit-line-clamp: " + props.truncate + ";\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n min-height: 1em;\n max-height: 3em;\n ";
|
|
6262
6550
|
});
|
|
@@ -6329,21 +6617,21 @@ var ContentSummary = function ContentSummary(_ref) {
|
|
|
6329
6617
|
}), link.text)));
|
|
6330
6618
|
};
|
|
6331
6619
|
|
|
6332
|
-
var _templateObject$
|
|
6333
|
-
var EditorialGrid = /*#__PURE__*/styled__default.div(_templateObject$
|
|
6620
|
+
var _templateObject$T, _templateObject2$C, _templateObject3$u, _templateObject4$n, _templateObject5$h;
|
|
6621
|
+
var EditorialGrid = /*#__PURE__*/styled__default.div(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(12, minmax(0, 1fr));\n gap: var(--grid-column-gap);\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: min-content 24px min-content;\n grid-template-areas:\n 'row1'\n '.'\n 'row2';\n }\n }\n"])), function (_ref) {
|
|
6334
6622
|
var imageToLeft = _ref.imageToLeft;
|
|
6335
6623
|
return imageToLeft ? "'left left left left left . right right right right right right'" : "'left left left left left left . right right right right right'";
|
|
6336
6624
|
}, devices.mobile);
|
|
6337
|
-
var EditorialImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
6625
|
+
var EditorialImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$C || (_templateObject2$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n align-self: center;\n grid-area: ", ";\n @media ", " {\n & {\n grid-area: row1;\n }\n"])), function (_ref2) {
|
|
6338
6626
|
var imageToLeft = _ref2.imageToLeft;
|
|
6339
6627
|
return imageToLeft ? 'left' : 'right';
|
|
6340
6628
|
}, devices.mobile);
|
|
6341
|
-
var EditorialTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
6629
|
+
var EditorialTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n"])), function (_ref3) {
|
|
6342
6630
|
var imageToLeft = _ref3.imageToLeft;
|
|
6343
6631
|
return imageToLeft ? 'right' : 'left';
|
|
6344
6632
|
}, devices.mobile);
|
|
6345
|
-
var EditorialSubtitle = /*#__PURE__*/styled__default.span(_templateObject4$
|
|
6346
|
-
var EditorialText = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
6633
|
+
var EditorialSubtitle = /*#__PURE__*/styled__default.span(_templateObject4$n || (_templateObject4$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n margin-bottom: var(--editorial-subtitle-margin-bottom);\n display: block;\n overflow-wrap: break-word;\n"])));
|
|
6634
|
+
var EditorialText = /*#__PURE__*/styled__default.div(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n em {\n font-family: var(--font-family-body-italics);\n }\n"])));
|
|
6347
6635
|
|
|
6348
6636
|
var Editorial = function Editorial(_ref) {
|
|
6349
6637
|
var _ref$imagePosition = _ref.imagePosition,
|
|
@@ -6407,10 +6695,10 @@ var BackgroundColour;
|
|
|
6407
6695
|
BackgroundColour["White"] = "white";
|
|
6408
6696
|
})(BackgroundColour || (BackgroundColour = {}));
|
|
6409
6697
|
|
|
6410
|
-
var _templateObject$
|
|
6411
|
-
var InfoContent = /*#__PURE__*/styled__default('div')(_templateObject$
|
|
6412
|
-
var InfoTitle = /*#__PURE__*/styled__default('div')(_templateObject2$
|
|
6413
|
-
var InfoCTAWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$
|
|
6698
|
+
var _templateObject$U, _templateObject2$D, _templateObject3$v, _templateObject4$o;
|
|
6699
|
+
var InfoContent = /*#__PURE__*/styled__default('div')(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n -webkit-letter-spacing: var(--letter-spacing-altHeader-6);\n -moz-letter-spacing: var(--letter-spacing-altHeader-6);\n -ms-letter-spacing: var(--letter-spacing-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n word-break: var(--word-break-altHeader);\n"])));
|
|
6700
|
+
var InfoTitle = /*#__PURE__*/styled__default('div')(_templateObject2$D || (_templateObject2$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n * {\n margin-block: 0;\n }\n"])));
|
|
6701
|
+
var InfoCTAWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 32px 0;\n\n ", "}\n"])), function (props) {
|
|
6414
6702
|
if (!props.infoThemed) {
|
|
6415
6703
|
return;
|
|
6416
6704
|
} else {
|
|
@@ -6421,7 +6709,7 @@ var InfoCTAWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$t || (
|
|
|
6421
6709
|
}
|
|
6422
6710
|
}
|
|
6423
6711
|
});
|
|
6424
|
-
var InfoWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject4$
|
|
6712
|
+
var InfoWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject4$o || (_templateObject4$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 60px 0;\n color: ", ";\n background: ", "\n }};\n"])), function (props) {
|
|
6425
6713
|
return props.background !== BackgroundColour.White ? 'var(--base-color-white)' : 'var(--base-color-black)';
|
|
6426
6714
|
}, function (props) {
|
|
6427
6715
|
return "var(--base-color-" + props.background + ")";
|
|
@@ -6534,29 +6822,29 @@ var Information = function Information(_ref) {
|
|
|
6534
6822
|
}))));
|
|
6535
6823
|
};
|
|
6536
6824
|
|
|
6537
|
-
var _templateObject$
|
|
6538
|
-
var PageHeadingWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
6825
|
+
var _templateObject$V, _templateObject2$E, _templateObject3$w, _templateObject4$p, _templateObject5$i, _templateObject6$e, _templateObject7$9, _templateObject8$6;
|
|
6826
|
+
var PageHeadingWrapper = /*#__PURE__*/styled__default.div(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n ", ";\n\n h2 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
6539
6827
|
var theme = _ref.theme;
|
|
6540
6828
|
return theme.colors.primary;
|
|
6541
6829
|
}, function (_ref2) {
|
|
6542
6830
|
var isPageHeadingWithoutTitle = _ref2.isPageHeadingWithoutTitle;
|
|
6543
6831
|
return isPageHeadingWithoutTitle && "\n padding-bottom: 42px;\n ";
|
|
6544
6832
|
}, devices.mobile);
|
|
6545
|
-
var PageHeadingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
6546
|
-
var TitleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
6833
|
+
var PageHeadingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$E || (_templateObject2$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n grid-template-rows: min-content min-content;\n grid-template-areas:\n '. . title title title title title title title title title title . . logo .'\n '. . text text text text text text text text text button button button . .';\n\n @media ", " {\n & {\n grid-template-rows: 20px min-content min-content min-content 20px;\n grid-template-areas:\n '. . . . . . . . . . . . . .'\n '. title title title title title title title title title title logo logo .'\n '. text text text text text text text text text text text text .'\n '. button button button button button button button button button button button button .'\n '. . . . . . . . . . . . . .';\n }\n }\n\n @media ", " {\n & {\n grid-template-areas:\n '. title title title title title title title title title title logo logo .'\n '. text text text text text text text text text button button button .';\n }\n }\n"])), devices.mobile, devices.tablet);
|
|
6834
|
+
var TitleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$w || (_templateObject3$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: title;\n margin-top: 80px;\n\n ", ";\n\n @media ", " {\n & {\n margin-top: 0;\n }\n }\n"])), function (_ref3) {
|
|
6547
6835
|
var isPageHeadingWithoutTitle = _ref3.isPageHeadingWithoutTitle;
|
|
6548
6836
|
return isPageHeadingWithoutTitle && "\n margin-top: 42px;\n ";
|
|
6549
6837
|
}, devices.mobile);
|
|
6550
|
-
var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
6838
|
+
var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 20px;\n width: fit-content;\n height: 36px;\n\n ", ";\n\n @media ", " {\n & {\n height: 30px;\n }\n }\n"])), function (_ref4) {
|
|
6551
6839
|
var isPageHeadingWithoutTitle = _ref4.isPageHeadingWithoutTitle;
|
|
6552
6840
|
return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
|
|
6553
6841
|
}, devices.mobile);
|
|
6554
|
-
var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
6555
|
-
var LogoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
6842
|
+
var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject5$i || (_templateObject5$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n align-self: end;\n margin-top: 12px;\n\n h6 {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
6843
|
+
var LogoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n justify-self: end;\n margin-top: 20px;\n position: relative;\n\n > div {\n position: absolute;\n top: 0;\n right: 0;\n }\n\n @media ", " {\n & {\n align-self: start;\n margin-top: 0;\n }\n }\n"])), devices.mobile);
|
|
6556
6844
|
var ButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject7$9 || (_templateObject7$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n justify-self: end;\n align-self: end;\n\n @media ", " {\n & {\n justify-self: center;\n align-self: center;\n width: 100%;\n margin-top: 16px;\n }\n }\n"])), devices.mobile);
|
|
6557
6845
|
var PageHeadingText = /*#__PURE__*/styled__default.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-family: var(--font-family-altHeader);\n text-transform: var(--text-transform-altHeader);\n word-break: var(--word-break-altHeader);\n"])));
|
|
6558
6846
|
|
|
6559
|
-
var _excluded$
|
|
6847
|
+
var _excluded$e = ["text"];
|
|
6560
6848
|
|
|
6561
6849
|
var PageHeading = function PageHeading(_ref) {
|
|
6562
6850
|
var title = _ref.title,
|
|
@@ -6568,7 +6856,7 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
6568
6856
|
|
|
6569
6857
|
var _ref2 = link || {},
|
|
6570
6858
|
linkText = _ref2.text,
|
|
6571
|
-
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
6859
|
+
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$e);
|
|
6572
6860
|
|
|
6573
6861
|
var truncatedText = text == null ? void 0 : text.substring(0, 250);
|
|
6574
6862
|
var truncatedTitle = title && title.substring(0, 40);
|
|
@@ -6596,11 +6884,11 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
6596
6884
|
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restLink), linkText)) : null));
|
|
6597
6885
|
};
|
|
6598
6886
|
|
|
6599
|
-
var _excluded$
|
|
6887
|
+
var _excluded$f = ["link"];
|
|
6600
6888
|
|
|
6601
6889
|
var PageHeadingCore = function PageHeadingCore(_ref) {
|
|
6602
6890
|
var link = _ref.link,
|
|
6603
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
6891
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$f);
|
|
6604
6892
|
|
|
6605
6893
|
var coreLink = link && _extends({}, link, {
|
|
6606
6894
|
color: exports.Colors.White,
|
|
@@ -6614,11 +6902,11 @@ var PageHeadingCore = function PageHeadingCore(_ref) {
|
|
|
6614
6902
|
})));
|
|
6615
6903
|
};
|
|
6616
6904
|
|
|
6617
|
-
var _excluded$
|
|
6905
|
+
var _excluded$g = ["link"];
|
|
6618
6906
|
|
|
6619
6907
|
var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
6620
6908
|
var link = _ref.link,
|
|
6621
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
6909
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$g);
|
|
6622
6910
|
|
|
6623
6911
|
var cinemaLink = link && _extends({}, link, {
|
|
6624
6912
|
color: exports.Colors.Black,
|
|
@@ -6632,17 +6920,17 @@ var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
|
6632
6920
|
}), /*#__PURE__*/React__default.createElement(CinemaBadge, null)));
|
|
6633
6921
|
};
|
|
6634
6922
|
|
|
6635
|
-
var _templateObject$
|
|
6636
|
-
var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
6637
|
-
var ImpactHeaderImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
6638
|
-
var ImpactGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$
|
|
6639
|
-
var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
6640
|
-
var LogoWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
6641
|
-
var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
6923
|
+
var _templateObject$W, _templateObject2$F, _templateObject3$x, _templateObject4$q, _templateObject5$j, _templateObject6$f, _templateObject7$a, _templateObject8$7;
|
|
6924
|
+
var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n position: relative;\n display: flex;\n background: var(--base-color-black);\n\n @media ", " {\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n }\n"])), devices.mobile);
|
|
6925
|
+
var ImpactHeaderImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$F || (_templateObject2$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n overflow: hidden;\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n img {\n width: 100%;\n filter: brightness(0.7);\n opacity: 0.95;\n }\n\n @media ", " {\n height: fit-content;\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n\n img {\n height: 100%;\n object-fit: cover;\n }\n }\n"])), devices.mobile);
|
|
6926
|
+
var ImpactGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$x || (_templateObject3$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n align-self: center;\n width: 100%;\n z-index: ", ";\n gap: 0 var(--grid-column-gap);\n grid-template-rows: min-content min-content min-content;\n grid-template-areas:\n '. . . . . logo logo logo logo logo logo . . . . .'\n '. . . text text text text text text text text text text . . .'\n '. . . button button button button button button button button button button . . .';\n\n @media ", " {\n & {\n height: 100%;\n grid-template-rows: 1fr max-content 1fr;\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. text text text text text text text text text text text text .'\n '. button button button button button button button button button button button button .';\n }\n }\n\n @media ", " {\n align-content: center;\n\n & {\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. . text text text text text text text text text text . .'\n '. . button button button button button button button button button button . .';\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
6927
|
+
var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
|
|
6928
|
+
var LogoWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
|
|
6929
|
+
var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$f || (_templateObject6$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n color: var(--base-color-white);\n text-align: center;\n margin-top: 40px;\n max-height: calc(2 * var(--line-height-header-3));\n overflow: hidden;\n\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n max-height: calc(4 * var(--line-height-header-3));\n }\n }\n\n @media ", " {\n & {\n margin-top: 12px;\n max-height: calc(4 * var(--line-height-header-3));\n }\n\n h3 {\n font-size: var(--font-size-header-3);\n letter-spacing: var(--letter-spacing-header-5);\n line-height: var(--line-height-header-5);\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
6642
6930
|
var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n align-self: end;\n display: flex;\n justify-content: center;\n margin-top: 40px;\n\n @media ", " {\n & {\n margin-top: 0px;\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
6643
6931
|
var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject8$7 || (_templateObject8$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 20px;\n left: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
6644
6932
|
|
|
6645
|
-
var _excluded$
|
|
6933
|
+
var _excluded$h = ["text"];
|
|
6646
6934
|
|
|
6647
6935
|
var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
6648
6936
|
var children = _ref.children,
|
|
@@ -6660,7 +6948,7 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
6660
6948
|
|
|
6661
6949
|
var _ref2 = link || {},
|
|
6662
6950
|
linkText = _ref2.text,
|
|
6663
|
-
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
6951
|
+
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$h);
|
|
6664
6952
|
|
|
6665
6953
|
return /*#__PURE__*/React__default.createElement(ImpactWrapper, {
|
|
6666
6954
|
bgUrlDesktop: bgUrlDesktop,
|
|
@@ -6705,21 +6993,21 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
6705
6993
|
}, "Scroll Down")) : null);
|
|
6706
6994
|
};
|
|
6707
6995
|
|
|
6708
|
-
var _templateObject$
|
|
6709
|
-
var PanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
6996
|
+
var _templateObject$X, _templateObject2$G, _templateObject3$y, _templateObject4$r, _templateObject5$k;
|
|
6997
|
+
var PanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n grid-template-rows: 48px max-content max-content;\n }\n"])), function (_ref) {
|
|
6710
6998
|
var color = _ref.color;
|
|
6711
6999
|
return "\n background-color: " + (color ? "var(--base-color-" + color + ")" : 'var(--base-color-core)') + ";\n color: " + (color === exports.Colors.White ? 'var(--base-color-black)' : 'var(--base-color-white)') + ";\n ";
|
|
6712
7000
|
}, devices.mobileAndTablet);
|
|
6713
|
-
var LeftPanel = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
7001
|
+
var LeftPanel = /*#__PURE__*/styled__default.div(_templateObject2$G || (_templateObject2$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n box-sizing: border-box;\n height: 100%;\n display: grid;\n grid-auto-rows: 90% 1fr;\n gap: 0px 36px;\n align-items: center;\n\n @media ", " {\n grid-area: ", ";\n }\n"])), function (_ref2) {
|
|
6714
7002
|
var hasImage = _ref2.hasImage;
|
|
6715
7003
|
return hasImage ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
|
|
6716
7004
|
}, devices.mobileAndTablet, function (_ref3) {
|
|
6717
7005
|
var hasImage = _ref3.hasImage;
|
|
6718
7006
|
return hasImage ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
|
|
6719
7007
|
});
|
|
6720
|
-
var RightPanel = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
6721
|
-
var InfoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
6722
|
-
var ScrollDownWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
7008
|
+
var RightPanel = /*#__PURE__*/styled__default.div(_templateObject3$y || (_templateObject3$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--base-color-black);\n\n @media ", " {\n grid-area: 2 / 1 / 3 / 15;\n }\n"])), devices.mobileAndTablet);
|
|
7009
|
+
var InfoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$r || (_templateObject4$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 36px;\n max-height: 33vw;\n overflow: hidden;\n\n :first-child * {\n margin-block-start: 0;\n }\n\n @media ", " {\n margin: 36px 20px;\n max-height: unset;\n }\n"])), devices.mobileAndTablet);
|
|
7010
|
+
var ScrollDownWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0 0 25px 36px;\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
|
|
6723
7011
|
|
|
6724
7012
|
var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
6725
7013
|
var _image$src, _image$alt;
|
|
@@ -6750,14 +7038,14 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
6750
7038
|
}))));
|
|
6751
7039
|
};
|
|
6752
7040
|
|
|
6753
|
-
var _templateObject$
|
|
6754
|
-
var StreamWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
7041
|
+
var _templateObject$Y;
|
|
7042
|
+
var StreamWrapper = /*#__PURE__*/styled__default.div(_templateObject$Y || (_templateObject$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2::selection,\n div::selection {\n color: #1866dc;\n background-color: #fff;\n }\n"])));
|
|
6755
7043
|
|
|
6756
|
-
var _excluded$
|
|
7044
|
+
var _excluded$i = ["link"];
|
|
6757
7045
|
|
|
6758
7046
|
var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
6759
7047
|
var link = _ref.link,
|
|
6760
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
7048
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$i);
|
|
6761
7049
|
|
|
6762
7050
|
var streamLink = link && _extends({}, link, {
|
|
6763
7051
|
color: exports.Colors.Black,
|
|
@@ -6771,12 +7059,12 @@ var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
|
6771
7059
|
}), /*#__PURE__*/React__default.createElement(StreamBadge, null))));
|
|
6772
7060
|
};
|
|
6773
7061
|
|
|
6774
|
-
var _templateObject$
|
|
6775
|
-
var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$
|
|
6776
|
-
var BrandingTextBody = /*#__PURE__*/styled__default.p(_templateObject2$
|
|
6777
|
-
var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
6778
|
-
var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
6779
|
-
var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$
|
|
7062
|
+
var _templateObject$Z, _templateObject2$H, _templateObject3$z, _templateObject5$l, _templateObject6$g, _templateObject7$b, _templateObject8$8, _templateObject9$3, _templateObject10$3;
|
|
7063
|
+
var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-overline-4);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
|
|
7064
|
+
var BrandingTextBody = /*#__PURE__*/styled__default.p(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
|
|
7065
|
+
var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
|
|
7066
|
+
var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$l || (_templateObject5$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 37.5vw;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-color: #000;\n img {\n position: relative;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n video {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: contain;\n @media ", " {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n margin: auto;\n height: auto;\n max-height: 100vh;\n width: 100%;\n object-fit: contain;\n }\n }\n @media ", " {\n height: 85vw;\n max-height: 100vh;\n }\n"])), devices.mobile, devices.mobile);
|
|
7067
|
+
var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 160px;\n grid-template-rows: min-content min-content;\n grid-template-rows: min-content min-content;\n grid-template-columns: [logo] 1fr [title] 3fr [cta] 1fr;\n align-content: center;\n gap: 0;\n background-color: ", ";\n color: ", ";\n\n svg {\n max-width: 155px;\n fill: ", ";\n }\n\n h1::selection,\n div::selection {\n ", ";\n }\n\n @media ", " {\n display: flex;\n flex-direction: column;\n height: auto;\n padding: 32px 20px;\n }\n"])), function (_ref) {
|
|
6780
7068
|
var invert = _ref.invert,
|
|
6781
7069
|
theme = _ref.theme;
|
|
6782
7070
|
return invert ? theme.colors.white : theme.colors.primary;
|
|
@@ -6906,7 +7194,7 @@ var CompactHeaderBranding = function CompactHeaderBranding(_ref) {
|
|
|
6906
7194
|
var isIOS = function isIOS() {
|
|
6907
7195
|
try {
|
|
6908
7196
|
console.warn('Do not use this on server side rendering, it may throw an error.');
|
|
6909
|
-
if (typeof navigator === undefined) return false;
|
|
7197
|
+
if (typeof navigator === 'undefined') return false;
|
|
6910
7198
|
return ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) || // iPad on iOS 13 detection
|
|
6911
7199
|
navigator.userAgent.includes('Mac') && 'ontouchend' in document;
|
|
6912
7200
|
} catch (e) {
|
|
@@ -6922,7 +7210,7 @@ var useIOS = function useIOS() {
|
|
|
6922
7210
|
setIOS = _useState[1];
|
|
6923
7211
|
|
|
6924
7212
|
React.useEffect(function () {
|
|
6925
|
-
if (typeof navigator === undefined) return;
|
|
7213
|
+
if (typeof navigator === 'undefined') return;
|
|
6926
7214
|
setIOS(isIOS());
|
|
6927
7215
|
}, []);
|
|
6928
7216
|
return IOS;
|
|
@@ -6951,7 +7239,7 @@ var useMobile = function useMobile() {
|
|
|
6951
7239
|
return mobile;
|
|
6952
7240
|
};
|
|
6953
7241
|
|
|
6954
|
-
var _excluded$
|
|
7242
|
+
var _excluded$j = ["text"];
|
|
6955
7243
|
|
|
6956
7244
|
var useResponsiveVideo = function useResponsiveVideo(video, poster) {
|
|
6957
7245
|
var mobileVideo = video.mobile || video.desktop;
|
|
@@ -7067,7 +7355,7 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
7067
7355
|
|
|
7068
7356
|
var _ref5 = link || {},
|
|
7069
7357
|
linkText = _ref5.text,
|
|
7070
|
-
restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$
|
|
7358
|
+
restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$j);
|
|
7071
7359
|
|
|
7072
7360
|
var titleSize = title && title.length > 20 ? 4 : 3;
|
|
7073
7361
|
var video = {
|
|
@@ -7106,15 +7394,15 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
7106
7394
|
}), linkText))));
|
|
7107
7395
|
};
|
|
7108
7396
|
|
|
7109
|
-
var _templateObject$
|
|
7110
|
-
var MorePages = /*#__PURE__*/styled__default.span(_templateObject$
|
|
7111
|
-
var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject2$
|
|
7397
|
+
var _templateObject$_, _templateObject2$I, _templateObject3$A, _templateObject4$s;
|
|
7398
|
+
var MorePages = /*#__PURE__*/styled__default.span(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n pointer-events: none;\n"])));
|
|
7399
|
+
var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-top: 40px;\n margin-bottom: 40px;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: 1px solid rgba(0, 0, 0, 0);\n }\n"]))); // PageNumber extends bodyText but uses subtitle-1 font size
|
|
7112
7400
|
|
|
7113
|
-
var PageNumber = /*#__PURE__*/styled__default.a(_templateObject3$
|
|
7401
|
+
var PageNumber = /*#__PURE__*/styled__default.a(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: inherit;\n margin: 0;\n border-bottom: 1px solid transparent;\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n :hover {\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n /* active state - string used because react returns error for bool */\n ", "\n"])), function (_ref) {
|
|
7114
7402
|
var active = _ref.active;
|
|
7115
7403
|
return active === 'true' && " \n color: var(--base-color-core);\n ";
|
|
7116
7404
|
});
|
|
7117
|
-
var NextPage = /*#__PURE__*/styled__default(PageNumber)(_templateObject4$
|
|
7405
|
+
var NextPage = /*#__PURE__*/styled__default(PageNumber)(_templateObject4$s || (_templateObject4$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n width: 25px;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n span {\n height: 1.5em;\n svg > path {\n fill: var(--base-color-dark-grey);\n }\n }\n"])));
|
|
7118
7406
|
|
|
7119
7407
|
var reducePages = function reducePages(pages, currentPage) {
|
|
7120
7408
|
// If there are less than 6 pages, return all pages
|
|
@@ -7183,13 +7471,13 @@ var Pagination = function Pagination(_ref) {
|
|
|
7183
7471
|
}))));
|
|
7184
7472
|
};
|
|
7185
7473
|
|
|
7186
|
-
var _templateObject
|
|
7187
|
-
var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject
|
|
7188
|
-
var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
7189
|
-
var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
7190
|
-
var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
7191
|
-
var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
7192
|
-
var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$
|
|
7474
|
+
var _templateObject$$, _templateObject2$J, _templateObject3$B, _templateObject4$t, _templateObject5$m, _templateObject6$h;
|
|
7475
|
+
var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n p {\n margin: 0;\n }\n\n grid-template-columns: 1fr 1fr 1fr;\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n"])), devices.mobile, devices.tablet, devices.largeDesktop);
|
|
7476
|
+
var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject2$J || (_templateObject2$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
|
|
7477
|
+
var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
|
|
7478
|
+
var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
|
|
7479
|
+
var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$m || (_templateObject5$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n"])));
|
|
7480
|
+
var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$h || (_templateObject6$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
|
|
7193
7481
|
|
|
7194
7482
|
var Person = function Person(_ref) {
|
|
7195
7483
|
var person = _ref.person,
|
|
@@ -7240,11 +7528,11 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
7240
7528
|
}));
|
|
7241
7529
|
};
|
|
7242
7530
|
|
|
7243
|
-
var _templateObject$
|
|
7244
|
-
var ReplacementWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
7245
|
-
var CreditListingWrapper = /*#__PURE__*/styled__default(PeopleListingGrid)(_templateObject2$
|
|
7246
|
-
var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
7247
|
-
var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
7531
|
+
var _templateObject$10, _templateObject2$K, _templateObject3$C, _templateObject4$u;
|
|
7532
|
+
var ReplacementWrapper = /*#__PURE__*/styled__default.div(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
|
|
7533
|
+
var CreditListingWrapper = /*#__PURE__*/styled__default(PeopleListingGrid)(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n"])));
|
|
7534
|
+
var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 1.5;\n margin-bottom: 4px;\n }\n"])));
|
|
7535
|
+
var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n"])));
|
|
7248
7536
|
|
|
7249
7537
|
var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
|
|
7250
7538
|
return array.reduce(function (acc, item) {
|
|
@@ -7255,12 +7543,18 @@ var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop)
|
|
|
7255
7543
|
var concatenateMusicTitle = function concatenateMusicTitle(musicTitle) {
|
|
7256
7544
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, musicTitle.map(function (title, index) {
|
|
7257
7545
|
if (musicTitle.length > 1 && index === musicTitle.length - 1) {
|
|
7258
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i",
|
|
7546
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i", {
|
|
7547
|
+
key: index
|
|
7548
|
+
}, title));
|
|
7259
7549
|
} else if (index > 0) {
|
|
7260
|
-
return /*#__PURE__*/React__default.createElement("i",
|
|
7550
|
+
return /*#__PURE__*/React__default.createElement("i", {
|
|
7551
|
+
key: index
|
|
7552
|
+
}, ", ", title);
|
|
7261
7553
|
}
|
|
7262
7554
|
|
|
7263
|
-
return /*#__PURE__*/React__default.createElement("i",
|
|
7555
|
+
return /*#__PURE__*/React__default.createElement("i", {
|
|
7556
|
+
key: index
|
|
7557
|
+
}, title);
|
|
7264
7558
|
}));
|
|
7265
7559
|
};
|
|
7266
7560
|
|
|
@@ -7312,14 +7606,14 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
7312
7606
|
}));
|
|
7313
7607
|
};
|
|
7314
7608
|
|
|
7315
|
-
var _templateObject
|
|
7609
|
+
var _templateObject$11, _templateObject2$L, _templateObject3$D, _templateObject4$v, _templateObject5$n, _templateObject6$i, _templateObject7$c, _templateObject8$9, _templateObject9$4, _templateObject10$4, _templateObject11$2, _templateObject12$1, _templateObject13$1, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
|
|
7316
7610
|
var LENGTH_TEXT = 28;
|
|
7317
7611
|
var LENGTH_TEXT_TABLET$1 = 12;
|
|
7318
7612
|
var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
|
|
7319
7613
|
var GridTemplateImageToRight = "'. . left left left left left . right right right right right right right right'";
|
|
7320
7614
|
var GridTemplateAsCard = "'. . left left left left left right right right right right right right . . '";
|
|
7321
7615
|
var GridTemplateAsCardTablet = "'. . left left left left left left left right right right right right . . '";
|
|
7322
|
-
var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject
|
|
7616
|
+
var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n grid-template-areas: ", ";\n }\n }\n\n @media ", " {\n & {\n grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n grid-template-rows: min-content 24px min-content;\n gap: 0;\n grid-template-areas:\n 'row1 row1 row1'\n '. . .'\n '. row2 .';\n }\n }\n\n /* Overwrite template for card */\n ", "\n"])), function (_ref) {
|
|
7323
7617
|
var imageToLeft = _ref.imageToLeft;
|
|
7324
7618
|
return imageToLeft ? GridTemplateImageToLeft : GridTemplateImageToRight;
|
|
7325
7619
|
}, devices.tablet, function (_ref2) {
|
|
@@ -7329,8 +7623,8 @@ var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$$ ||
|
|
|
7329
7623
|
var asCard = _ref3.asCard;
|
|
7330
7624
|
return asCard ? "\n grid-template-areas: " + GridTemplateAsCard + ";\n @media " + devices.tablet + " {\n grid-template-areas: " + GridTemplateAsCardTablet + ";\n }\n " : "";
|
|
7331
7625
|
});
|
|
7332
|
-
var PromoWithTagsSubtitle = /*#__PURE__*/styled__default.span(_templateObject2$
|
|
7333
|
-
var PromoWithTagsText = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
7626
|
+
var PromoWithTagsSubtitle = /*#__PURE__*/styled__default.span(_templateObject2$L || (_templateObject2$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n margin-bottom: var(--editorial-subtitle-margin-bottom);\n display: block;\n overflow-wrap: break-word;\n"])));
|
|
7627
|
+
var PromoWithTagsText = /*#__PURE__*/styled__default.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n }\n }\n"])), function (_ref4) {
|
|
7334
7628
|
var theme = _ref4.theme;
|
|
7335
7629
|
return theme.colors.black;
|
|
7336
7630
|
}, function (_ref5) {
|
|
@@ -7340,7 +7634,7 @@ var PromoWithTagsText = /*#__PURE__*/styled__default.div(_templateObject3$B || (
|
|
|
7340
7634
|
var theme = _ref6.theme;
|
|
7341
7635
|
return theme.colors.primary;
|
|
7342
7636
|
});
|
|
7343
|
-
var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
7637
|
+
var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 24px;\n\n ", ";\n\n ", "\n\n @media ", " {\n gap: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref7) {
|
|
7344
7638
|
var hasTextLinks = _ref7.hasTextLinks;
|
|
7345
7639
|
return "margin-top: " + (hasTextLinks ? '0' : '24px') + ";";
|
|
7346
7640
|
}, function (_ref8) {
|
|
@@ -7368,18 +7662,18 @@ var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$t ||
|
|
|
7368
7662
|
|
|
7369
7663
|
return '';
|
|
7370
7664
|
});
|
|
7371
|
-
var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
7665
|
+
var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n"])), function (_ref10) {
|
|
7372
7666
|
var marginBottom = _ref10.marginBottom;
|
|
7373
7667
|
return marginBottom + "px";
|
|
7374
7668
|
});
|
|
7375
|
-
var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$
|
|
7669
|
+
var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
|
|
7376
7670
|
var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject7$c || (_templateObject7$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
|
|
7377
7671
|
var TextLinkWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject8$9 || (_templateObject8$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
|
|
7378
7672
|
var ExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject9$4 || (_templateObject9$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
|
|
7379
7673
|
var IconWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject10$4 || (_templateObject10$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n position: absolute;\n top: 25px;\n right: 35px;\n width: 24px;\n height: 24px;\n\n @media ", " {\n top: 30px;\n right: 30px;\n }\n\n @media ", " {\n top: 3px;\n right: 20px;\n }\n"])), devices.tablet, devices.mobile);
|
|
7380
7674
|
var PrimaryButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject11$2 || (_templateObject11$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--button-height);\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
|
|
7381
7675
|
var MobileTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject12$1 || (_templateObject12$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n margin: 0 50px 0 20px;\n\n h2,\n h3 {\n margin: 0;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
7382
|
-
var PromoWithTagsTypeTags = /*#__PURE__*/styled__default(TypeTags)(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
7676
|
+
var PromoWithTagsTypeTags = /*#__PURE__*/styled__default(TypeTags)(_templateObject13$1 || (_templateObject13$1 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
7383
7677
|
var PromoWithTagsHeader = /*#__PURE__*/styled__default(Header)(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
7384
7678
|
var PromoWithTagsTextLink = /*#__PURE__*/styled__default(TextLink)(_templateObject15 || (_templateObject15 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
7385
7679
|
var asCardOverrides = /*#__PURE__*/styled.css(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", " {\n font-size: var(--font-size-subtitle-2);\n }\n\n ", " {\n font-size: var(--font-size-overline-1);\n }\n\n ", " {\n flex-direction: row;\n @media ", " {\n flex-direction: row;\n }\n }\n\n ", " {\n font-size: var(--font-size-overline-2);\n font-weight: var(--font-weight-overline-2);\n line-height: var(--line-height-overline-2);\n letter-spacing: var(--letter-spacing-overline-2);\n }\n"])), PromoWithTagsSubtitle, PromoWithTagsTypeTags, ButtonsContainer$2, devices.tablet, PromoWithTagsTextLink);
|
|
@@ -7401,7 +7695,7 @@ var PromoWithTagsContainer = /*#__PURE__*/styled__default.div(_templateObject19
|
|
|
7401
7695
|
var TimerWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject20 || (_templateObject20 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n"])));
|
|
7402
7696
|
var EndDateText = /*#__PURE__*/styled__default.div(_templateObject21 || (_templateObject21 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid var(--base-color-black);\n padding-bottom: 32px;\n margin-bottom: 32px;\n\n @media ", " {\n padding-bottom: 20px;\n margin-bottom: 20px;\n }\n"])), devices.mobile);
|
|
7403
7697
|
|
|
7404
|
-
var _excluded$
|
|
7698
|
+
var _excluded$k = ["text"],
|
|
7405
7699
|
_excluded2$2 = ["text"],
|
|
7406
7700
|
_excluded3 = ["text"];
|
|
7407
7701
|
|
|
@@ -7475,7 +7769,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
7475
7769
|
var _ref2 = firstButton || {},
|
|
7476
7770
|
_ref2$text = _ref2.text,
|
|
7477
7771
|
firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
7478
|
-
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
7772
|
+
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$k);
|
|
7479
7773
|
|
|
7480
7774
|
var primaryButtonTextTruncate = truncate(firstButtonText, LENGTH_TEXT$1);
|
|
7481
7775
|
var secondButton = links == null ? void 0 : links[1];
|
|
@@ -7594,27 +7888,27 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
7594
7888
|
}))));
|
|
7595
7889
|
};
|
|
7596
7890
|
|
|
7597
|
-
var _templateObject$
|
|
7891
|
+
var _templateObject$12, _templateObject2$M, _templateObject3$E, _templateObject4$w, _templateObject5$o, _templateObject6$j, _templateObject7$d;
|
|
7598
7892
|
var LENGTH_TEXT$2 = 28;
|
|
7599
7893
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
7600
|
-
var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
7894
|
+
var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$12 || (_templateObject$12 = /*#__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) {
|
|
7601
7895
|
var imageToLeft = _ref.imageToLeft;
|
|
7602
7896
|
return imageToLeft ? "'left left left left left left left left . right right right right right . .'" : "'. . left left left left left . right right right right right right right right'";
|
|
7603
7897
|
}, devices.tablet, function (_ref2) {
|
|
7604
7898
|
var imageToLeft = _ref2.imageToLeft;
|
|
7605
7899
|
return imageToLeft ? "'left left left left left left left right right right right right right .'" : "'. left left left left left left right right right right right right right'";
|
|
7606
7900
|
}, devices.mobile);
|
|
7607
|
-
var PromoWithTitleImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
7901
|
+
var PromoWithTitleImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$M || (_templateObject2$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref3) {
|
|
7608
7902
|
var imageToLeft = _ref3.imageToLeft;
|
|
7609
7903
|
return imageToLeft ? 'left' : 'right';
|
|
7610
7904
|
}, devices.mobile);
|
|
7611
|
-
var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
7905
|
+
var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n }\n"])), function (_ref4) {
|
|
7612
7906
|
var imageToLeft = _ref4.imageToLeft;
|
|
7613
7907
|
return imageToLeft ? 'right' : 'left';
|
|
7614
7908
|
}, devices.mobile);
|
|
7615
|
-
var PromoWithTitleContainer = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
7616
|
-
var PromoWithTitleSubtitle = /*#__PURE__*/styled__default.span(_templateObject5$
|
|
7617
|
-
var PromoWithTitleText = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
7909
|
+
var PromoWithTitleContainer = /*#__PURE__*/styled__default.div(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2,\n h3 {\n margin: 0 0 32px;\n\n @media ", " {\n & {\n margin: 0 0 24px;\n }\n }\n }\n"])), devices.mobile);
|
|
7910
|
+
var PromoWithTitleSubtitle = /*#__PURE__*/styled__default.span(_templateObject5$o || (_templateObject5$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n margin-bottom: var(--editorial-subtitle-margin-bottom);\n display: block;\n overflow-wrap: break-word;\n"])));
|
|
7911
|
+
var PromoWithTitleText = /*#__PURE__*/styled__default.div(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n }\n }\n"])), function (_ref5) {
|
|
7618
7912
|
var theme = _ref5.theme;
|
|
7619
7913
|
return theme.colors.black;
|
|
7620
7914
|
}, function (_ref6) {
|
|
@@ -7650,7 +7944,7 @@ var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$d ||
|
|
|
7650
7944
|
return '';
|
|
7651
7945
|
});
|
|
7652
7946
|
|
|
7653
|
-
var _excluded$
|
|
7947
|
+
var _excluded$l = ["text"],
|
|
7654
7948
|
_excluded2$3 = ["text"];
|
|
7655
7949
|
var LENGTH_TEXT$3 = 28;
|
|
7656
7950
|
|
|
@@ -7677,7 +7971,7 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
7677
7971
|
var _ref2 = primaryButton || {},
|
|
7678
7972
|
_ref2$text = _ref2.text,
|
|
7679
7973
|
primaryButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
7680
|
-
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
7974
|
+
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$l);
|
|
7681
7975
|
|
|
7682
7976
|
var primaryButtonTextTruncate = truncate(primaryButtonText, LENGTH_TEXT$3);
|
|
7683
7977
|
var tertiaryButton = links == null ? void 0 : links[1];
|
|
@@ -7711,8 +8005,12 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
7711
8005
|
}, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? /*#__PURE__*/React__default.createElement(Button$1, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate) : null) : null));
|
|
7712
8006
|
};
|
|
7713
8007
|
|
|
7714
|
-
var _templateObject$
|
|
7715
|
-
var RadioGroupContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8008
|
+
var _templateObject$13;
|
|
8009
|
+
var RadioGroupContainer = /*#__PURE__*/styled__default.div(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 30px;\n"])));
|
|
8010
|
+
|
|
8011
|
+
/**
|
|
8012
|
+
* DEPRECATED. Use RadioGroup2 instead
|
|
8013
|
+
*/
|
|
7716
8014
|
|
|
7717
8015
|
var RadioGroup = function RadioGroup(_ref) {
|
|
7718
8016
|
var radios = _ref.radios,
|
|
@@ -7766,10 +8064,100 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
7766
8064
|
})));
|
|
7767
8065
|
};
|
|
7768
8066
|
|
|
7769
|
-
var _templateObject$
|
|
7770
|
-
var
|
|
7771
|
-
var
|
|
7772
|
-
var
|
|
8067
|
+
var _templateObject$14, _templateObject2$N, _templateObject3$F;
|
|
8068
|
+
var Container$3 = /*#__PURE__*/styled__default.div(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
8069
|
+
var RadioGroup$1 = /*#__PURE__*/styled__default.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
|
|
8070
|
+
var horizontalMode = _ref.horizontalMode;
|
|
8071
|
+
if (horizontalMode) return 'row';
|
|
8072
|
+
return 'column';
|
|
8073
|
+
}, function (_ref2) {
|
|
8074
|
+
var gap = _ref2.gap;
|
|
8075
|
+
return gap + "px";
|
|
8076
|
+
});
|
|
8077
|
+
var ErrorLabel$3 = /*#__PURE__*/styled__default.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref3) {
|
|
8078
|
+
var darkMode = _ref3.darkMode;
|
|
8079
|
+
if (darkMode) return 'var(--base-color-white)';
|
|
8080
|
+
return 'var(--base-color-errorstate)';
|
|
8081
|
+
});
|
|
8082
|
+
|
|
8083
|
+
/**
|
|
8084
|
+
* A RadioGroup component, that renders set of Radio2 components inside.
|
|
8085
|
+
* `name` prop should be specified and will be passed as a `name` to each
|
|
8086
|
+
* radio to combine them in one group.
|
|
8087
|
+
*
|
|
8088
|
+
* # Radios
|
|
8089
|
+
* `radios` prop is an array of radios that should be renderet. This is an
|
|
8090
|
+
* array of objects `{content: ReactNode, value: string | number}`.
|
|
8091
|
+
*
|
|
8092
|
+
* # Default value
|
|
8093
|
+
* `defaultValue` prop can be specified to make one of radios checked inittially.
|
|
8094
|
+
* This should be equal to `value` of one of `radios`.
|
|
8095
|
+
*
|
|
8096
|
+
* # Error state
|
|
8097
|
+
* An error label will be shown below the radios if the `error` prop exists.
|
|
8098
|
+
* Also radios will be rendered with a red border. An empty string can be passed to
|
|
8099
|
+
* render only error state without error message.
|
|
8100
|
+
*
|
|
8101
|
+
* # Horizontal mode
|
|
8102
|
+
* If `horizontalMode` prop is true radios will be placed in a row instead of column.
|
|
8103
|
+
*
|
|
8104
|
+
* # Distance between radios
|
|
8105
|
+
* `gap` prop allow to control distance between radios in pixels. This works in default and
|
|
8106
|
+
* horizontal modes.
|
|
8107
|
+
*
|
|
8108
|
+
* # Light / Dark mode
|
|
8109
|
+
* The component can also adapt its styles for light / dark mode. If you want this component
|
|
8110
|
+
* to be rendered on a dark / coloured background, you can use the `darkMode` prop.
|
|
8111
|
+
*
|
|
8112
|
+
* # Black box mode
|
|
8113
|
+
* If `blackBox` prop is true checked state will be styled as black box with white tick icon.
|
|
8114
|
+
* This style was used before as a default. Not preferred in new components.
|
|
8115
|
+
* This will be ignored if `darkMode` is true.
|
|
8116
|
+
*/
|
|
8117
|
+
|
|
8118
|
+
var RadioGroup2 = function RadioGroup2(_ref) {
|
|
8119
|
+
var radios = _ref.radios,
|
|
8120
|
+
name = _ref.name,
|
|
8121
|
+
_ref$horizontalMode = _ref.horizontalMode,
|
|
8122
|
+
horizontalMode = _ref$horizontalMode === void 0 ? false : _ref$horizontalMode,
|
|
8123
|
+
_ref$gap = _ref.gap,
|
|
8124
|
+
gap = _ref$gap === void 0 ? 30 : _ref$gap,
|
|
8125
|
+
error = _ref.error,
|
|
8126
|
+
darkMode = _ref.darkMode,
|
|
8127
|
+
blackBox = _ref.blackBox,
|
|
8128
|
+
onChange = _ref.onChange,
|
|
8129
|
+
defaultValue = _ref.defaultValue;
|
|
8130
|
+
|
|
8131
|
+
var changeHandler = function changeHandler(e) {
|
|
8132
|
+
onChange == null ? void 0 : onChange(e.target.value);
|
|
8133
|
+
};
|
|
8134
|
+
|
|
8135
|
+
return /*#__PURE__*/React__default.createElement(Container$3, null, /*#__PURE__*/React__default.createElement(RadioGroup$1, {
|
|
8136
|
+
gap: gap,
|
|
8137
|
+
horizontalMode: horizontalMode
|
|
8138
|
+
}, radios.map(function (radio, idx) {
|
|
8139
|
+
return /*#__PURE__*/React__default.createElement(Radio2, {
|
|
8140
|
+
key: radio.value + "-" + idx,
|
|
8141
|
+
name: name,
|
|
8142
|
+
value: radio.value,
|
|
8143
|
+
blackBox: blackBox,
|
|
8144
|
+
darkMode: darkMode,
|
|
8145
|
+
defaultChecked: radio.value === defaultValue,
|
|
8146
|
+
error: error !== undefined ? '' : undefined,
|
|
8147
|
+
onChange: changeHandler
|
|
8148
|
+
}, radio.content);
|
|
8149
|
+
})), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$3, {
|
|
8150
|
+
darkMode: darkMode,
|
|
8151
|
+
"data-testid": "radio-group-error-label"
|
|
8152
|
+
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
8153
|
+
level: 6
|
|
8154
|
+
}, error)));
|
|
8155
|
+
};
|
|
8156
|
+
|
|
8157
|
+
var _templateObject$15, _templateObject2$O, _templateObject3$G;
|
|
8158
|
+
var StatusBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-lightgrey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
|
|
8159
|
+
var ContentContainer$3 = /*#__PURE__*/styled__default.div(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.3s ease-in-out;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n"])));
|
|
8160
|
+
var SvgContainer$3 = /*#__PURE__*/styled__default.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: end;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n padding-left: 50px;\n }\n\n cursor: pointer;\n\n @media ", " {\n padding-left: 20px;\n }\n"])), devices.mobile);
|
|
7773
8161
|
|
|
7774
8162
|
var StatusBanner = function StatusBanner(_ref) {
|
|
7775
8163
|
var statusText = _ref.statusText,
|
|
@@ -7831,8 +8219,8 @@ var StatusBanner = function StatusBanner(_ref) {
|
|
|
7831
8219
|
})))));
|
|
7832
8220
|
};
|
|
7833
8221
|
|
|
7834
|
-
var _templateObject$
|
|
7835
|
-
var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8222
|
+
var _templateObject$16;
|
|
8223
|
+
var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 30px 0;\n\n & > div {\n row-gap: 0;\n }\n\n & h1,\n & h2 {\n margin: 16px 0;\n white-space: pre-wrap;\n }\n\n @media ", " {\n & h1,\n & h2 {\n margin: 12px 0;\n }\n }\n\n & div {\n font-size: var(--font-size-title-description);\n line-height: var(--line-height-title-description);\n margin-block-start: 0;\n }\n"])), devices.mobile);
|
|
7836
8224
|
|
|
7837
8225
|
var SectionTitle = function SectionTitle(_ref) {
|
|
7838
8226
|
var title = _ref.title,
|
|
@@ -7858,8 +8246,8 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
7858
8246
|
}, description))));
|
|
7859
8247
|
};
|
|
7860
8248
|
|
|
7861
|
-
var _templateObject$
|
|
7862
|
-
var stateStyles = /*#__PURE__*/styled.css(_templateObject$
|
|
8249
|
+
var _templateObject$17, _templateObject2$P, _templateObject3$H, _templateObject4$x, _templateObject5$p, _templateObject6$k, _templateObject7$e, _templateObject8$a, _templateObject9$5, _templateObject10$5, _templateObject11$3;
|
|
8250
|
+
var stateStyles = /*#__PURE__*/styled.css(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &:focus,\n &.focus {\n outline: ", ";\n }\n\n &.disabled {\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n cursor: none;\n }\n"])), function (_ref) {
|
|
7863
8251
|
var theme = _ref.theme;
|
|
7864
8252
|
return "3px solid " + theme.colors.lapisLazuli;
|
|
7865
8253
|
}, function (_ref2) {
|
|
@@ -7869,12 +8257,12 @@ var stateStyles = /*#__PURE__*/styled.css(_templateObject$14 || (_templateObject
|
|
|
7869
8257
|
var theme = _ref3.theme;
|
|
7870
8258
|
return theme.colors.lightgrey;
|
|
7871
8259
|
});
|
|
7872
|
-
var borderStyles = /*#__PURE__*/styled.css(_templateObject2$
|
|
8260
|
+
var borderStyles = /*#__PURE__*/styled.css(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-radius: 0;\n outline: 1px solid ", ";\n"])), function (_ref4) {
|
|
7873
8261
|
var theme = _ref4.theme;
|
|
7874
8262
|
return theme.colors.darkgrey;
|
|
7875
8263
|
});
|
|
7876
|
-
var noMarginAndPaddingStyles = /*#__PURE__*/styled.css(_templateObject3$
|
|
7877
|
-
var listItemStyles = /*#__PURE__*/styled.css(_templateObject4$
|
|
8264
|
+
var noMarginAndPaddingStyles = /*#__PURE__*/styled.css(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
|
|
8265
|
+
var listItemStyles = /*#__PURE__*/styled.css(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style: none;\n user-select: none;\n"])));
|
|
7878
8266
|
var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
|
|
7879
8267
|
var theme = _ref5.theme;
|
|
7880
8268
|
return {
|
|
@@ -7882,8 +8270,8 @@ var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
|
|
|
7882
8270
|
color: theme.colors.black,
|
|
7883
8271
|
title: 'Select Arrow'
|
|
7884
8272
|
};
|
|
7885
|
-
})(_templateObject5$
|
|
7886
|
-
var Wrapper$5 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
8273
|
+
})(_templateObject5$p || (_templateObject5$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n pointer-events: none;\n\n max-width: 24px;\n max-height: 24px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n"])));
|
|
8274
|
+
var Wrapper$5 = /*#__PURE__*/styled__default.div(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
|
|
7887
8275
|
var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
|
|
7888
8276
|
var Options = /*#__PURE__*/styled__default.div(_templateObject8$a || (_templateObject8$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
|
|
7889
8277
|
var Option = /*#__PURE__*/styled__default.li(_templateObject9$5 || (_templateObject9$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
|
|
@@ -8280,8 +8668,8 @@ function Select(_ref3) {
|
|
|
8280
8668
|
}))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
|
|
8281
8669
|
}
|
|
8282
8670
|
|
|
8283
|
-
var _templateObject$
|
|
8284
|
-
var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8671
|
+
var _templateObject$18;
|
|
8672
|
+
var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1,\n h2,\n h3,\n h4 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n }\n\n p {\n margin: 30px 0;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & strong {\n font-weight: bold;\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n & ul {\n padding: 0;\n list-style: none;\n margin: 0 0 0 30px;\n\n li {\n text-indent: -20px;\n line-height: var(--line-height-listing);\n }\n }\n\n & ol {\n padding: 0;\n margin: 0 0 0 20px;\n\n li {\n line-height: var(--line-height-listing);\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n width: 0px;\n margin-left: 12px;\n margin-right: 8px;\n }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
|
|
8285
8673
|
var theme = _ref.theme;
|
|
8286
8674
|
return theme.colors.primary;
|
|
8287
8675
|
});
|
|
@@ -8309,8 +8697,8 @@ var TextOnly = function TextOnly(_ref) {
|
|
|
8309
8697
|
})));
|
|
8310
8698
|
};
|
|
8311
8699
|
|
|
8312
|
-
var _templateObject$
|
|
8313
|
-
var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8700
|
+
var _templateObject$19, _templateObject2$Q;
|
|
8701
|
+
var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n height: 100%;\n width: fit-content;\n\n ", " {\n height: calc(100% - 12px - var(--line-height-body-2));\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), ImageAspectRatioWrapper, function (_ref) {
|
|
8314
8702
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
8315
8703
|
aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
|
|
8316
8704
|
return aspectRatio;
|
|
@@ -8320,7 +8708,7 @@ var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$16 || (_templat
|
|
|
8320
8708
|
height = _ref2.height;
|
|
8321
8709
|
return "calc(calc(" + height + "px - 12px - var(--line-height-body-2)) * " + AspectRatioWidth[aspectRatio] + ")";
|
|
8322
8710
|
});
|
|
8323
|
-
var CaptionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8711
|
+
var CaptionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 12px;\n height: var(--line-height-body-2);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-2);\n font-weight: var(--font-weight-body-2);\n letter-spacing: var(--letter-spacing-body-2);\n line-height: var(--line-height-body-2);\n text-transform: var(--text-transform-body-2);\n word-break: var(--word-break-body-2);\n font-style: italic;\n"])));
|
|
8324
8712
|
|
|
8325
8713
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
8326
8714
|
var caption = _ref.caption,
|
|
@@ -8358,13 +8746,13 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
8358
8746
|
}, children), /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
8359
8747
|
};
|
|
8360
8748
|
|
|
8361
|
-
var _templateObject$
|
|
8362
|
-
var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8363
|
-
var AttributionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8749
|
+
var _templateObject$1a, _templateObject2$R, _templateObject3$I;
|
|
8750
|
+
var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
|
|
8751
|
+
var AttributionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
8364
8752
|
var displayAttribution = _ref.displayAttribution;
|
|
8365
8753
|
return "display: " + (displayAttribution ? 'block' : 'none') + ";";
|
|
8366
8754
|
});
|
|
8367
|
-
var Line$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8755
|
+
var Line$1 = /*#__PURE__*/styled__default.div(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n height: 2px;\n width: 62px;\n margin: 32px 0;\n\n @media ", " {\n height: 1px;\n width: 46px;\n margin: 24px 0;\n }\n"])), devices.mobile);
|
|
8368
8756
|
|
|
8369
8757
|
var Quote = function Quote(_ref) {
|
|
8370
8758
|
var text = _ref.text,
|
|
@@ -8388,13 +8776,13 @@ var Quote = function Quote(_ref) {
|
|
|
8388
8776
|
}, attribution))));
|
|
8389
8777
|
};
|
|
8390
8778
|
|
|
8391
|
-
var _templateObject$
|
|
8392
|
-
var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8393
|
-
var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8394
|
-
var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$
|
|
8395
|
-
var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8396
|
-
var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
8397
|
-
var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
8779
|
+
var _templateObject$1b, _templateObject2$S, _templateObject3$J, _templateObject4$y, _templateObject5$q, _templateObject6$l;
|
|
8780
|
+
var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1b || (_templateObject$1b = /*#__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"])));
|
|
8781
|
+
var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
8782
|
+
var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
8783
|
+
var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
8784
|
+
var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$q || (_templateObject5$q = /*#__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);
|
|
8785
|
+
var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$l || (_templateObject6$l = /*#__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);
|
|
8398
8786
|
|
|
8399
8787
|
var MiniCard = function MiniCard(_ref) {
|
|
8400
8788
|
var _ref$title = _ref.title,
|
|
@@ -8432,11 +8820,11 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
8432
8820
|
}, title)))));
|
|
8433
8821
|
};
|
|
8434
8822
|
|
|
8435
|
-
var _templateObject$
|
|
8436
|
-
var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8437
|
-
var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8438
|
-
var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8439
|
-
var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8823
|
+
var _templateObject$1c, _templateObject2$T, _templateObject3$K, _templateObject4$z;
|
|
8824
|
+
var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0px 0px 12px 0px !important;\n }\n width: 100%;\n"])));
|
|
8825
|
+
var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n"])));
|
|
8826
|
+
var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
8827
|
+
var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n"])));
|
|
8440
8828
|
|
|
8441
8829
|
var keyDown = function keyDown(e, toggleFunction) {
|
|
8442
8830
|
if (e.key === 'Enter' || e.key === 'Space') {
|
|
@@ -8534,101 +8922,19 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
8534
8922
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText)));
|
|
8535
8923
|
};
|
|
8536
8924
|
|
|
8537
|
-
var _templateObject$
|
|
8538
|
-
var
|
|
8539
|
-
var
|
|
8540
|
-
|
|
8541
|
-
return mobileOpen ? "block" : 'none';
|
|
8542
|
-
}, exports.Colors.White, exports.Colors.DarkGrey);
|
|
8543
|
-
var MenuItem$1 = /*#__PURE__*/styled__default.button(_templateObject3$I || (_templateObject3$I = /*#__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 20px 15px 5px;\n border: 0;\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n @media ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), exports.Colors.Black, function (_ref2) {
|
|
8544
|
-
var active = _ref2.active;
|
|
8545
|
-
return active ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
|
|
8546
|
-
}, exports.Colors.MidGrey, devices.mobile);
|
|
8547
|
-
var MobileButton = /*#__PURE__*/styled__default.button(_templateObject4$y || (_templateObject4$y = /*#__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: none;\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 @media ", " {\n display: block;\n }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey, devices.mobile);
|
|
8548
|
-
|
|
8549
|
-
/**
|
|
8550
|
-
* Vertical menu component uses for navigation
|
|
8551
|
-
* inside website chapter. It looks like a vertical
|
|
8552
|
-
* list with clickable items on desktop and dropdown
|
|
8553
|
-
* list on mobile.
|
|
8554
|
-
*
|
|
8555
|
-
* ## Menu items
|
|
8556
|
-
* Menu items should be passed as `items` prop. This
|
|
8557
|
-
* should be an array of objects. Each object should
|
|
8558
|
-
* have `text` (text displayed as a menu item) and
|
|
8559
|
-
* `onClick` (click handler function)
|
|
8560
|
-
*
|
|
8561
|
-
* ## Active menu item
|
|
8562
|
-
* Active menu item should be passed as component `activeItem`
|
|
8563
|
-
* prop. This indicates on which menu item should be highlighted
|
|
8564
|
-
* as active one. Should be equal to `text` prop from one of the `items`
|
|
8565
|
-
*/
|
|
8566
|
-
|
|
8567
|
-
var AuxiliaryNav = function AuxiliaryNav(_ref) {
|
|
8568
|
-
var items = _ref.items,
|
|
8569
|
-
activeItem = _ref.activeItem;
|
|
8570
|
-
|
|
8571
|
-
var _useState = React.useState(false),
|
|
8572
|
-
mobileOpen = _useState[0],
|
|
8573
|
-
setMobileOpen = _useState[1];
|
|
8574
|
-
|
|
8575
|
-
var containerRef = React.useRef(null);
|
|
8576
|
-
|
|
8577
|
-
var mobileButtonClickHandler = function mobileButtonClickHandler() {
|
|
8578
|
-
setMobileOpen(function (prev) {
|
|
8579
|
-
return !prev;
|
|
8580
|
-
});
|
|
8581
|
-
};
|
|
8582
|
-
|
|
8583
|
-
var outsideClickHandler = function outsideClickHandler(event) {
|
|
8584
|
-
if (containerRef.current && !containerRef.current.contains(event.target)) {
|
|
8585
|
-
setMobileOpen(false);
|
|
8586
|
-
}
|
|
8587
|
-
};
|
|
8588
|
-
|
|
8589
|
-
React.useEffect(function () {
|
|
8590
|
-
document.addEventListener('mousedown', outsideClickHandler);
|
|
8591
|
-
return function () {
|
|
8592
|
-
document.removeEventListener('mousedown', outsideClickHandler);
|
|
8593
|
-
};
|
|
8594
|
-
}, [containerRef]);
|
|
8595
|
-
return /*#__PURE__*/React__default.createElement(MenuContainer$2, {
|
|
8596
|
-
ref: containerRef,
|
|
8597
|
-
"data-testid": "nav-menu-container"
|
|
8598
|
-
}, /*#__PURE__*/React__default.createElement(MobileButton, {
|
|
8599
|
-
mobileOpen: mobileOpen,
|
|
8600
|
-
onClick: mobileButtonClickHandler,
|
|
8601
|
-
"data-testid": "nav-menu-mobile-button"
|
|
8602
|
-
}, activeItem, /*#__PURE__*/React__default.createElement(Icon, {
|
|
8603
|
-
iconName: "DropdownArrow",
|
|
8604
|
-
direction: mobileOpen ? 'left' : 'right'
|
|
8605
|
-
})), /*#__PURE__*/React__default.createElement(MenuList, {
|
|
8606
|
-
mobileOpen: mobileOpen,
|
|
8607
|
-
"data-testid": "nav-menu-list"
|
|
8608
|
-
}, items.map(function (item, idx) {
|
|
8609
|
-
return /*#__PURE__*/React__default.createElement("li", {
|
|
8610
|
-
key: item.text + "-" + idx
|
|
8611
|
-
}, /*#__PURE__*/React__default.createElement(MenuItem$1, {
|
|
8612
|
-
onClick: item.onClick,
|
|
8613
|
-
active: item.text === activeItem,
|
|
8614
|
-
"data-testid": "nav-menu-item" + (item.text === activeItem ? '-active' : '')
|
|
8615
|
-
}, item.text));
|
|
8616
|
-
})));
|
|
8617
|
-
};
|
|
8618
|
-
|
|
8619
|
-
var _templateObject$1b, _templateObject2$S, _templateObject3$J, _templateObject4$z, _templateObject5$p, _templateObject6$k;
|
|
8620
|
-
var Container$1 = /*#__PURE__*/styled__default.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
8621
|
-
var Sections = /*#__PURE__*/styled__default.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
8622
|
-
var Section = /*#__PURE__*/styled__default.div(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
8925
|
+
var _templateObject$1d, _templateObject2$U, _templateObject3$L, _templateObject4$A, _templateObject5$r, _templateObject6$m;
|
|
8926
|
+
var Container$4 = /*#__PURE__*/styled__default.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
8927
|
+
var Sections = /*#__PURE__*/styled__default.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
8928
|
+
var Section = /*#__PURE__*/styled__default.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
8623
8929
|
var color = _ref.color;
|
|
8624
8930
|
return "var(--base-color-" + color + ")";
|
|
8625
8931
|
});
|
|
8626
|
-
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8627
|
-
var Text = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
8932
|
+
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
8933
|
+
var Text = /*#__PURE__*/styled__default.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
8628
8934
|
var color = _ref2.color;
|
|
8629
8935
|
return "var(--base-color-" + color + ")";
|
|
8630
8936
|
});
|
|
8631
|
-
var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
8937
|
+
var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
|
|
8632
8938
|
var color = _ref3.color;
|
|
8633
8939
|
return "var(--base-color-" + color + ")";
|
|
8634
8940
|
});
|
|
@@ -8689,7 +8995,7 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
8689
8995
|
return index < activeSections ? 'password-strength-section-active' : 'password-strength-section';
|
|
8690
8996
|
};
|
|
8691
8997
|
|
|
8692
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
8998
|
+
return /*#__PURE__*/React__default.createElement(Container$4, {
|
|
8693
8999
|
"data-testid": "password-strength-container"
|
|
8694
9000
|
}, /*#__PURE__*/React__default.createElement(Sections, {
|
|
8695
9001
|
"data-testid": "password-strength-sections"
|
|
@@ -8714,6 +9020,88 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
8714
9020
|
}, strengthLabel))));
|
|
8715
9021
|
};
|
|
8716
9022
|
|
|
9023
|
+
var _templateObject$1e, _templateObject2$V, _templateObject3$M, _templateObject4$B;
|
|
9024
|
+
var MenuContainer$2 = /*#__PURE__*/styled__default.menu(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
9025
|
+
var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$V || (_templateObject2$V = /*#__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 @media ", " {\n margin-left: 0px;\n }\n }\n @media ", " {\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n }\n"])), exports.Colors.LightGrey, devices.mobile, devices.mobile, function (_ref) {
|
|
9026
|
+
var mobileOpen = _ref.mobileOpen;
|
|
9027
|
+
return mobileOpen ? "block" : 'none';
|
|
9028
|
+
}, exports.Colors.White, exports.Colors.DarkGrey);
|
|
9029
|
+
var MenuItem$1 = /*#__PURE__*/styled__default.button(_templateObject3$M || (_templateObject3$M = /*#__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 20px 15px 5px;\n border: 0;\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n @media ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), exports.Colors.Black, function (_ref2) {
|
|
9030
|
+
var active = _ref2.active;
|
|
9031
|
+
return active ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
|
|
9032
|
+
}, exports.Colors.MidGrey, devices.mobile);
|
|
9033
|
+
var MobileButton = /*#__PURE__*/styled__default.button(_templateObject4$B || (_templateObject4$B = /*#__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: none;\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 @media ", " {\n display: block;\n }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey, devices.mobile);
|
|
9034
|
+
|
|
9035
|
+
/**
|
|
9036
|
+
* Vertical menu component uses for navigation
|
|
9037
|
+
* inside website chapter. It looks like a vertical
|
|
9038
|
+
* list with clickable items on desktop and dropdown
|
|
9039
|
+
* list on mobile.
|
|
9040
|
+
*
|
|
9041
|
+
* ## Menu items
|
|
9042
|
+
* Menu items should be passed as `items` prop. This
|
|
9043
|
+
* should be an array of objects. Each object should
|
|
9044
|
+
* have `text` (text displayed as a menu item) and
|
|
9045
|
+
* `onClick` (click handler function)
|
|
9046
|
+
*
|
|
9047
|
+
* ## Active menu item
|
|
9048
|
+
* Active menu item should be passed as component `activeItem`
|
|
9049
|
+
* prop. This indicates on which menu item should be highlighted
|
|
9050
|
+
* as active one. Should be equal to `text` prop from one of the `items`
|
|
9051
|
+
*/
|
|
9052
|
+
|
|
9053
|
+
var AuxiliaryNav = function AuxiliaryNav(_ref) {
|
|
9054
|
+
var items = _ref.items,
|
|
9055
|
+
activeItem = _ref.activeItem;
|
|
9056
|
+
|
|
9057
|
+
var _useState = React.useState(false),
|
|
9058
|
+
mobileOpen = _useState[0],
|
|
9059
|
+
setMobileOpen = _useState[1];
|
|
9060
|
+
|
|
9061
|
+
var containerRef = React.useRef(null);
|
|
9062
|
+
|
|
9063
|
+
var mobileButtonClickHandler = function mobileButtonClickHandler() {
|
|
9064
|
+
setMobileOpen(function (prev) {
|
|
9065
|
+
return !prev;
|
|
9066
|
+
});
|
|
9067
|
+
};
|
|
9068
|
+
|
|
9069
|
+
var outsideClickHandler = function outsideClickHandler(event) {
|
|
9070
|
+
if (containerRef.current && !containerRef.current.contains(event.target)) {
|
|
9071
|
+
setMobileOpen(false);
|
|
9072
|
+
}
|
|
9073
|
+
};
|
|
9074
|
+
|
|
9075
|
+
React.useEffect(function () {
|
|
9076
|
+
document.addEventListener('mousedown', outsideClickHandler);
|
|
9077
|
+
return function () {
|
|
9078
|
+
document.removeEventListener('mousedown', outsideClickHandler);
|
|
9079
|
+
};
|
|
9080
|
+
}, [containerRef]);
|
|
9081
|
+
return /*#__PURE__*/React__default.createElement(MenuContainer$2, {
|
|
9082
|
+
ref: containerRef,
|
|
9083
|
+
"data-testid": "nav-menu-container"
|
|
9084
|
+
}, /*#__PURE__*/React__default.createElement(MobileButton, {
|
|
9085
|
+
mobileOpen: mobileOpen,
|
|
9086
|
+
onClick: mobileButtonClickHandler,
|
|
9087
|
+
"data-testid": "nav-menu-mobile-button"
|
|
9088
|
+
}, activeItem, /*#__PURE__*/React__default.createElement(Icon, {
|
|
9089
|
+
iconName: "DropdownArrow",
|
|
9090
|
+
direction: mobileOpen ? 'left' : 'right'
|
|
9091
|
+
})), /*#__PURE__*/React__default.createElement(MenuList, {
|
|
9092
|
+
mobileOpen: mobileOpen,
|
|
9093
|
+
"data-testid": "nav-menu-list"
|
|
9094
|
+
}, items.map(function (item, idx) {
|
|
9095
|
+
return /*#__PURE__*/React__default.createElement("li", {
|
|
9096
|
+
key: item.text + "-" + idx
|
|
9097
|
+
}, /*#__PURE__*/React__default.createElement(MenuItem$1, {
|
|
9098
|
+
onClick: item.onClick,
|
|
9099
|
+
active: item.text === activeItem,
|
|
9100
|
+
"data-testid": "nav-menu-item" + (item.text === activeItem ? '-active' : '')
|
|
9101
|
+
}, item.text));
|
|
9102
|
+
})));
|
|
9103
|
+
};
|
|
9104
|
+
|
|
8717
9105
|
var UpsellSection = function UpsellSection(_ref) {
|
|
8718
9106
|
var title = _ref.title,
|
|
8719
9107
|
richText = _ref.richText,
|
|
@@ -8802,9 +9190,9 @@ var LiveChat = function LiveChat() {
|
|
|
8802
9190
|
});
|
|
8803
9191
|
};
|
|
8804
9192
|
|
|
8805
|
-
var _templateObject$
|
|
8806
|
-
var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8807
|
-
var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
9193
|
+
var _templateObject$1f, _templateObject2$W;
|
|
9194
|
+
var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--base-color-white);\n"])), zIndexes.anchor);
|
|
9195
|
+
var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$W || (_templateObject2$W = /*#__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) {
|
|
8808
9196
|
var hideBottomBorder = _ref.hideBottomBorder;
|
|
8809
9197
|
return !hideBottomBorder && 'border-bottom: 2px solid var(--base-color-lightgrey);';
|
|
8810
9198
|
}, devices.mobileAndTablet, devices.mobile);
|
|
@@ -8832,13 +9220,13 @@ var StickyBar = function StickyBar(_ref) {
|
|
|
8832
9220
|
}, children)));
|
|
8833
9221
|
};
|
|
8834
9222
|
|
|
8835
|
-
var _templateObject$
|
|
8836
|
-
var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8837
|
-
var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$
|
|
8838
|
-
var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8839
|
-
var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$
|
|
9223
|
+
var _templateObject$1g, _templateObject2$X, _templateObject3$N, _templateObject4$C;
|
|
9224
|
+
var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$1g || (_templateObject$1g = /*#__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);
|
|
9225
|
+
var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$X || (_templateObject2$X = /*#__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);
|
|
9226
|
+
var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
9227
|
+
var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$C || (_templateObject4$C = /*#__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"])));
|
|
8840
9228
|
|
|
8841
|
-
var _excluded$
|
|
9229
|
+
var _excluded$m = ["isOpen", "setIsOpen", "children", "appElementId"];
|
|
8842
9230
|
var MAX_Z_INDEX = 9999999999;
|
|
8843
9231
|
|
|
8844
9232
|
if (Modal.defaultStyles.content) {
|
|
@@ -8915,7 +9303,7 @@ var ModalWindow = function ModalWindow(_ref) {
|
|
|
8915
9303
|
setIsOpen = _ref.setIsOpen,
|
|
8916
9304
|
children = _ref.children,
|
|
8917
9305
|
appElementId = _ref.appElementId,
|
|
8918
|
-
modalProps = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
9306
|
+
modalProps = _objectWithoutPropertiesLoose(_ref, _excluded$m);
|
|
8919
9307
|
|
|
8920
9308
|
var isMobile = useMobile();
|
|
8921
9309
|
var customStyles = {
|
|
@@ -8957,8 +9345,8 @@ var ModalWindow = function ModalWindow(_ref) {
|
|
|
8957
9345
|
})), /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, children))), /*#__PURE__*/React__default.createElement(ScrollLock, null)));
|
|
8958
9346
|
};
|
|
8959
9347
|
|
|
8960
|
-
var _templateObject$
|
|
8961
|
-
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1e || (_templateObject$1e = /*#__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\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\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
9348
|
+
var _templateObject$1h;
|
|
9349
|
+
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1h || (_templateObject$1h = /*#__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\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\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
8962
9350
|
var theme = _ref.theme;
|
|
8963
9351
|
return theme.colors.primary;
|
|
8964
9352
|
}, function (_ref2) {
|
|
@@ -9943,7 +10331,9 @@ exports.PromoWithTags = PromoWithTags;
|
|
|
9943
10331
|
exports.PromoWithTitle = PromoWithTitle;
|
|
9944
10332
|
exports.Quote = Quote;
|
|
9945
10333
|
exports.Radio = Radio;
|
|
10334
|
+
exports.Radio2 = Radio2;
|
|
9946
10335
|
exports.RadioGroup = RadioGroup;
|
|
10336
|
+
exports.RadioGroup2 = RadioGroup2;
|
|
9947
10337
|
exports.ReadMore = ReadMore;
|
|
9948
10338
|
exports.RotatorButtons = RotatorButtons;
|
|
9949
10339
|
exports.SearchBar = SearchBar;
|
|
@@ -9968,6 +10358,7 @@ exports.TextLink = TextLink;
|
|
|
9968
10358
|
exports.TextOnly = TextOnly;
|
|
9969
10359
|
exports.ThemeProvider = Theme;
|
|
9970
10360
|
exports.Tickbox = Tickbox;
|
|
10361
|
+
exports.Tickbox2 = Tickbox2;
|
|
9971
10362
|
exports.Timer = Timer;
|
|
9972
10363
|
exports.TitleWithCTA = TitleWithCTA;
|
|
9973
10364
|
exports.TypeTags = TypeTags;
|