@royaloperahouse/chord 0.5.10 → 0.7.1
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 +17 -0
- package/README.md +2 -2
- package/dist/chord.cjs.development.js +426 -341
- 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 +426 -343
- package/dist/chord.esm.js.map +1 -1
- package/dist/components/atoms/Tickbox/Tickbox.d.ts +4 -0
- package/dist/components/atoms/Tickbox/Tickbox.style.d.ts +4 -0
- package/dist/components/atoms/Tickbox/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/PeopleListing/PeopleListing.d.ts +1 -1
- package/dist/components/molecules/PeopleListing/PeopleListing.style.d.ts +3 -2
- package/dist/components/molecules/PeopleListing/Person.d.ts +7 -0
- package/dist/components/organisms/AnchorTapBar/AnchorTapBar.style.d.ts +0 -6
- package/dist/components/organisms/TitleWithCTA/TitleWithCTA.d.ts +4 -0
- package/dist/components/organisms/TitleWithCTA/TitleWithCTA.style.d.ts +9 -0
- package/dist/components/organisms/TitleWithCTA/index.d.ts +2 -0
- package/dist/components/organisms/index.d.ts +2 -1
- package/dist/index.d.ts +3 -3
- package/dist/types/index.d.ts +2 -1
- package/dist/types/navigation.d.ts +16 -10
- package/dist/types/tickbox.d.ts +40 -0
- package/dist/types/types.d.ts +29 -4
- package/package.json +1 -1
- package/dist/components/atoms/IndividualListing/IndividualListing.d.ts +0 -3
- package/dist/components/atoms/IndividualListing/IndividualListing.style.d.ts +0 -2
- package/dist/components/atoms/IndividualListing/index.d.ts +0 -2
|
@@ -2670,92 +2670,40 @@ var TabLink = function TabLink(_ref) {
|
|
|
2670
2670
|
})) : null, children);
|
|
2671
2671
|
};
|
|
2672
2672
|
|
|
2673
|
-
var _templateObject$g;
|
|
2674
|
-
var
|
|
2675
|
-
|
|
2676
|
-
var
|
|
2677
|
-
|
|
2678
|
-
|
|
2679
|
-
|
|
2680
|
-
|
|
2681
|
-
|
|
2682
|
-
key: t
|
|
2683
|
-
}, t);
|
|
2684
|
-
}));
|
|
2685
|
-
};
|
|
2686
|
-
|
|
2687
|
-
var _templateObject$h, _templateObject2$4, _templateObject3;
|
|
2688
|
-
var ButtonsContainer = /*#__PURE__*/styled__default.div(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n"])));
|
|
2689
|
-
var IconWrapper = /*#__PURE__*/styled__default.div(_templateObject2$4 || (_templateObject2$4 = /*#__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) {
|
|
2690
|
-
var theme = _ref.theme;
|
|
2691
|
-
return theme.colors.primary;
|
|
2692
|
-
}, devices.mobileAndTablet);
|
|
2693
|
-
var IconUnavailableWrapper = /*#__PURE__*/styled__default.div(_templateObject3 || (_templateObject3 = /*#__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.mobileAndTablet);
|
|
2694
|
-
|
|
2695
|
-
var RotatorButtons = function RotatorButtons(_ref) {
|
|
2696
|
-
var onClickPrev = _ref.onClickPrev,
|
|
2697
|
-
onClickNext = _ref.onClickNext,
|
|
2698
|
-
_ref$availablePrev = _ref.availablePrev,
|
|
2699
|
-
availablePrev = _ref$availablePrev === void 0 ? true : _ref$availablePrev,
|
|
2700
|
-
_ref$availableNext = _ref.availableNext,
|
|
2701
|
-
availableNext = _ref$availableNext === void 0 ? true : _ref$availableNext;
|
|
2702
|
-
|
|
2703
|
-
var onClickLeftHandler = function onClickLeftHandler() {
|
|
2704
|
-
if (onClickPrev) {
|
|
2705
|
-
onClickPrev();
|
|
2706
|
-
}
|
|
2707
|
-
};
|
|
2708
|
-
|
|
2709
|
-
var onPrevKeyDownHandler = function onPrevKeyDownHandler(e) {
|
|
2710
|
-
if (e.key === 'Enter') {
|
|
2711
|
-
onClickLeftHandler();
|
|
2712
|
-
}
|
|
2713
|
-
};
|
|
2714
|
-
|
|
2715
|
-
var onClickRightHandler = function onClickRightHandler() {
|
|
2716
|
-
if (onClickNext) {
|
|
2717
|
-
onClickNext();
|
|
2718
|
-
}
|
|
2719
|
-
};
|
|
2720
|
-
|
|
2721
|
-
var onNextKeyDownHandler = function onNextKeyDownHandler(e) {
|
|
2722
|
-
if (e.key === 'Enter') {
|
|
2723
|
-
onClickRightHandler();
|
|
2724
|
-
}
|
|
2725
|
-
};
|
|
2673
|
+
var _templateObject$g, _templateObject2$4;
|
|
2674
|
+
var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$g || (_templateObject$g = /*#__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) {
|
|
2675
|
+
var iconName = _ref.iconName;
|
|
2676
|
+
return iconName ? 'calc(var(--text-link-underline-offset) - 4px)' : 'var(--text-link-underline-offset)';
|
|
2677
|
+
}, function (_ref2) {
|
|
2678
|
+
var color = _ref2.color;
|
|
2679
|
+
return color;
|
|
2680
|
+
});
|
|
2681
|
+
var TextLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$4 || (_templateObject2$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-left: var(--button-icon-margin);\n"])));
|
|
2726
2682
|
|
|
2727
|
-
|
|
2728
|
-
return /*#__PURE__*/React__default.createElement(Icon, {
|
|
2729
|
-
iconName: 'CarouselArrow',
|
|
2730
|
-
direction: "reverse"
|
|
2731
|
-
});
|
|
2732
|
-
};
|
|
2683
|
+
var _excluded$5 = ["children", "iconName", "iconDirection", "color"];
|
|
2733
2684
|
|
|
2734
|
-
|
|
2735
|
-
|
|
2736
|
-
iconName
|
|
2737
|
-
|
|
2738
|
-
|
|
2685
|
+
var TextLink = function TextLink(_ref) {
|
|
2686
|
+
var children = _ref.children,
|
|
2687
|
+
iconName = _ref.iconName,
|
|
2688
|
+
iconDirection = _ref.iconDirection,
|
|
2689
|
+
color = _ref.color,
|
|
2690
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
2739
2691
|
|
|
2740
|
-
|
|
2741
|
-
|
|
2742
|
-
|
|
2743
|
-
|
|
2744
|
-
|
|
2745
|
-
|
|
2746
|
-
|
|
2747
|
-
|
|
2748
|
-
|
|
2749
|
-
|
|
2750
|
-
|
|
2751
|
-
"data-testid": "iconnext"
|
|
2752
|
-
}, renderNextIcon()) : /*#__PURE__*/React__default.createElement(IconUnavailableWrapper, {
|
|
2753
|
-
"data-testid": "iconnextnoavailable"
|
|
2754
|
-
}, renderNextIcon()));
|
|
2692
|
+
var truncatedString = children.substring(0, 30);
|
|
2693
|
+
return /*#__PURE__*/React__default.createElement(TextLinkWrapper, Object.assign({
|
|
2694
|
+
color: color,
|
|
2695
|
+
iconName: iconName
|
|
2696
|
+
}, rest), truncatedString, iconName ? /*#__PURE__*/React__default.createElement(TextLinkIconWrapper, {
|
|
2697
|
+
"data-testid": "text-link-icon"
|
|
2698
|
+
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
2699
|
+
iconName: iconName,
|
|
2700
|
+
direction: iconDirection,
|
|
2701
|
+
color: color
|
|
2702
|
+
})) : null);
|
|
2755
2703
|
};
|
|
2756
2704
|
|
|
2757
|
-
var _templateObject$
|
|
2758
|
-
var Wrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
2705
|
+
var _templateObject$h;
|
|
2706
|
+
var Wrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-", ");\n font-feature-settings: var(--font-feature-settings-", ");\n font-size: var(--font-size-", "-", ");\n font-weight: var(--font-weight-", "-", ");\n letter-spacing: var(--letter-spacing-", "-", ");\n line-height: var(--line-height-", "-", ");\n text-transform: var(--text-transform-", ");\n word-break: var(--word-break-", ");\n"])), function (_ref) {
|
|
2759
2707
|
var typography = _ref.typography;
|
|
2760
2708
|
return typography;
|
|
2761
2709
|
}, function (_ref2) {
|
|
@@ -2861,16 +2809,159 @@ var Subtitle = function Subtitle(_ref6) {
|
|
|
2861
2809
|
}, children);
|
|
2862
2810
|
};
|
|
2863
2811
|
|
|
2812
|
+
var _templateObject$i, _templateObject2$5, _templateObject3;
|
|
2813
|
+
var TickboxLabel = /*#__PURE__*/styled__default.label(_templateObject$i || (_templateObject$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n width: fit-content;\n position: relative;\n padding-left: 32px;\n color: var(--base-color-", ");\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n"])), function (_ref) {
|
|
2814
|
+
var dark = _ref.dark;
|
|
2815
|
+
return dark ? 'white' : 'black';
|
|
2816
|
+
});
|
|
2817
|
+
var TickboxCheckmark = /*#__PURE__*/styled__default.span(_templateObject2$5 || (_templateObject2$5 = /*#__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 var(--base-color-", ");\n\n svg {\n display: none;\n }\n\n @media ", " {\n top: 0;\n }\n"])), function (_ref2) {
|
|
2818
|
+
var dark = _ref2.dark;
|
|
2819
|
+
return dark ? 'white' : 'black';
|
|
2820
|
+
}, devices.mobile);
|
|
2821
|
+
var TickboxInput = /*#__PURE__*/styled__default.input(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n opacity: 0;\n cursor: pointer;\n height: 0;\n width: 0;\n\n &:checked ~ ", " {\n background-color: var(--base-color-", ");\n & svg {\n display: block;\n path {\n fill: var(--base-color-", ");\n }\n }\n }\n"])), TickboxCheckmark, function (_ref3) {
|
|
2822
|
+
var dark = _ref3.dark;
|
|
2823
|
+
return dark ? 'white' : 'black';
|
|
2824
|
+
}, function (_ref4) {
|
|
2825
|
+
var dark = _ref4.dark;
|
|
2826
|
+
return dark ? 'black' : 'white';
|
|
2827
|
+
});
|
|
2828
|
+
|
|
2829
|
+
(function (TickboxMode) {
|
|
2830
|
+
TickboxMode["Dark"] = "dark";
|
|
2831
|
+
TickboxMode["Light"] = "light";
|
|
2832
|
+
})(exports.TickboxMode || (exports.TickboxMode = {}));
|
|
2833
|
+
|
|
2834
|
+
var Tickbox = function Tickbox(_ref) {
|
|
2835
|
+
var children = _ref.children,
|
|
2836
|
+
_ref$mode = _ref.mode,
|
|
2837
|
+
mode = _ref$mode === void 0 ? 'light' : _ref$mode,
|
|
2838
|
+
onChange = _ref.onChange,
|
|
2839
|
+
_ref$checked = _ref.checked,
|
|
2840
|
+
checked = _ref$checked === void 0 ? false : _ref$checked;
|
|
2841
|
+
|
|
2842
|
+
var _useState = React.useState(checked),
|
|
2843
|
+
selected = _useState[0],
|
|
2844
|
+
setSelected = _useState[1];
|
|
2845
|
+
|
|
2846
|
+
var onInputChange = function onInputChange(e) {
|
|
2847
|
+
var inputChecked = e.target.checked;
|
|
2848
|
+
setSelected(inputChecked);
|
|
2849
|
+
onChange == null ? void 0 : onChange(inputChecked);
|
|
2850
|
+
};
|
|
2851
|
+
|
|
2852
|
+
var isDarkMode = mode === exports.TickboxMode.Dark;
|
|
2853
|
+
return /*#__PURE__*/React__default.createElement(TickboxLabel, {
|
|
2854
|
+
dark: isDarkMode,
|
|
2855
|
+
"data-testid": "tickbox"
|
|
2856
|
+
}, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
2857
|
+
level: 1,
|
|
2858
|
+
tag: "span"
|
|
2859
|
+
}, children), /*#__PURE__*/React__default.createElement(TickboxInput, {
|
|
2860
|
+
type: "checkbox",
|
|
2861
|
+
checked: selected,
|
|
2862
|
+
dark: isDarkMode,
|
|
2863
|
+
onChange: onInputChange
|
|
2864
|
+
}), /*#__PURE__*/React__default.createElement(TickboxCheckmark, {
|
|
2865
|
+
dark: isDarkMode
|
|
2866
|
+
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
2867
|
+
iconName: "Tick"
|
|
2868
|
+
})));
|
|
2869
|
+
};
|
|
2870
|
+
|
|
2871
|
+
var _templateObject$j;
|
|
2872
|
+
var TypeTagsContainer = /*#__PURE__*/styled__default.ul(_templateObject$j || (_templateObject$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n\n & li {\n color: var(--base-color-black);\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"])));
|
|
2873
|
+
|
|
2874
|
+
var TypeTags = function TypeTags(_ref) {
|
|
2875
|
+
var list = _ref.list;
|
|
2876
|
+
return /*#__PURE__*/React__default.createElement(TypeTagsContainer, null, list.map(function (t) {
|
|
2877
|
+
return /*#__PURE__*/React__default.createElement(Overline, {
|
|
2878
|
+
level: 1,
|
|
2879
|
+
tag: "li",
|
|
2880
|
+
key: t
|
|
2881
|
+
}, t);
|
|
2882
|
+
}));
|
|
2883
|
+
};
|
|
2884
|
+
|
|
2885
|
+
var _templateObject$k, _templateObject2$6, _templateObject3$1;
|
|
2886
|
+
var ButtonsContainer = /*#__PURE__*/styled__default.div(_templateObject$k || (_templateObject$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n"])));
|
|
2887
|
+
var IconWrapper = /*#__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) {
|
|
2888
|
+
var theme = _ref.theme;
|
|
2889
|
+
return theme.colors.primary;
|
|
2890
|
+
}, devices.mobileAndTablet);
|
|
2891
|
+
var IconUnavailableWrapper = /*#__PURE__*/styled__default.div(_templateObject3$1 || (_templateObject3$1 = /*#__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.mobileAndTablet);
|
|
2892
|
+
|
|
2893
|
+
var RotatorButtons = function RotatorButtons(_ref) {
|
|
2894
|
+
var onClickPrev = _ref.onClickPrev,
|
|
2895
|
+
onClickNext = _ref.onClickNext,
|
|
2896
|
+
_ref$availablePrev = _ref.availablePrev,
|
|
2897
|
+
availablePrev = _ref$availablePrev === void 0 ? true : _ref$availablePrev,
|
|
2898
|
+
_ref$availableNext = _ref.availableNext,
|
|
2899
|
+
availableNext = _ref$availableNext === void 0 ? true : _ref$availableNext;
|
|
2900
|
+
|
|
2901
|
+
var onClickLeftHandler = function onClickLeftHandler() {
|
|
2902
|
+
if (onClickPrev) {
|
|
2903
|
+
onClickPrev();
|
|
2904
|
+
}
|
|
2905
|
+
};
|
|
2906
|
+
|
|
2907
|
+
var onPrevKeyDownHandler = function onPrevKeyDownHandler(e) {
|
|
2908
|
+
if (e.key === 'Enter') {
|
|
2909
|
+
onClickLeftHandler();
|
|
2910
|
+
}
|
|
2911
|
+
};
|
|
2912
|
+
|
|
2913
|
+
var onClickRightHandler = function onClickRightHandler() {
|
|
2914
|
+
if (onClickNext) {
|
|
2915
|
+
onClickNext();
|
|
2916
|
+
}
|
|
2917
|
+
};
|
|
2918
|
+
|
|
2919
|
+
var onNextKeyDownHandler = function onNextKeyDownHandler(e) {
|
|
2920
|
+
if (e.key === 'Enter') {
|
|
2921
|
+
onClickRightHandler();
|
|
2922
|
+
}
|
|
2923
|
+
};
|
|
2924
|
+
|
|
2925
|
+
var renderPrevIcon = function renderPrevIcon() {
|
|
2926
|
+
return /*#__PURE__*/React__default.createElement(Icon, {
|
|
2927
|
+
iconName: 'CarouselArrow',
|
|
2928
|
+
direction: "reverse"
|
|
2929
|
+
});
|
|
2930
|
+
};
|
|
2931
|
+
|
|
2932
|
+
var renderNextIcon = function renderNextIcon() {
|
|
2933
|
+
return /*#__PURE__*/React__default.createElement(Icon, {
|
|
2934
|
+
iconName: 'CarouselArrow'
|
|
2935
|
+
});
|
|
2936
|
+
};
|
|
2937
|
+
|
|
2938
|
+
return /*#__PURE__*/React__default.createElement(ButtonsContainer, null, availablePrev ? /*#__PURE__*/React__default.createElement(IconWrapper, {
|
|
2939
|
+
onClick: onClickLeftHandler,
|
|
2940
|
+
onKeyDown: onPrevKeyDownHandler,
|
|
2941
|
+
tabIndex: 0,
|
|
2942
|
+
"data-testid": "iconprev"
|
|
2943
|
+
}, renderPrevIcon()) : /*#__PURE__*/React__default.createElement(IconUnavailableWrapper, {
|
|
2944
|
+
"data-testid": "iconprevnoavailable"
|
|
2945
|
+
}, renderPrevIcon()), availableNext ? /*#__PURE__*/React__default.createElement(IconWrapper, {
|
|
2946
|
+
onClick: onClickRightHandler,
|
|
2947
|
+
onKeyDown: onNextKeyDownHandler,
|
|
2948
|
+
tabIndex: 0,
|
|
2949
|
+
"data-testid": "iconnext"
|
|
2950
|
+
}, renderNextIcon()) : /*#__PURE__*/React__default.createElement(IconUnavailableWrapper, {
|
|
2951
|
+
"data-testid": "iconnextnoavailable"
|
|
2952
|
+
}, renderNextIcon()));
|
|
2953
|
+
};
|
|
2954
|
+
|
|
2864
2955
|
var zLevels = ['base', 'content', 'contentOverlay', 'anchor', 'searchOverlay', 'navigation', 'search', 'menu', 'overlay', 'popup'];
|
|
2865
2956
|
var zIndexes = {};
|
|
2866
2957
|
zLevels.forEach(function (name, index) {
|
|
2867
2958
|
zIndexes[name] = index;
|
|
2868
2959
|
});
|
|
2869
2960
|
|
|
2870
|
-
var _templateObject$
|
|
2871
|
-
var FullScreenContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
2872
|
-
var NavigationGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
2873
|
-
var SearchBackground = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
2961
|
+
var _templateObject$l, _templateObject2$7, _templateObject3$2, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
|
|
2962
|
+
var FullScreenContainer = /*#__PURE__*/styled__default.div(_templateObject$l || (_templateObject$l = /*#__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);
|
|
2963
|
+
var NavigationGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$7 || (_templateObject2$7 = /*#__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);
|
|
2964
|
+
var SearchBackground = /*#__PURE__*/styled__default.div(_templateObject3$2 || (_templateObject3$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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: 80px;\n top: 80px;\n }\n"])), zIndexes.search, devices.mobile);
|
|
2874
2965
|
var GridItemSearch = /*#__PURE__*/styled__default(GridItem)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-white);\n border-top: 1px solid var(--base-color-light-grey);\n height: 100px;\n width: 100%\n position: absolute;\n top: 140px;\n z-index: ", ";\n \n @media ", " {\n height: 80px;\n top: 80px;\n }\n"])), zIndexes.search, devices.mobile);
|
|
2875
2966
|
var NavigationGridMobile = /*#__PURE__*/styled__default(Grid)(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n display: grid;\n background-color: var(--base-color-white);\n padding-bottom: var(--navigation-large-margin);\n }\n"])), devices.mobileAndTablet);
|
|
2876
2967
|
var LogoContainer = /*#__PURE__*/styled__default.div(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 140px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n\n &&& .logoImg {\n height: 96px;\n width: 66px;\n }\n\n @media ", " {\n height: 80px;\n\n &&& .logoImg {\n width: 100%;\n height: 64px;\n }\n }\n"])), devices.mobile);
|
|
@@ -2879,8 +2970,8 @@ var NavContainer = /*#__PURE__*/styled__default.div(_templateObject8 || (_templa
|
|
|
2879
2970
|
var NavContainerGridItem = /*#__PURE__*/styled__default(GridItem)(_templateObject9 || (_templateObject9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 3 / span 14;\n }\n"])), devices.desktop);
|
|
2880
2971
|
var NavTopContainer = /*#__PURE__*/styled__default.div(_templateObject10 || (_templateObject10 = /*#__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);
|
|
2881
2972
|
|
|
2882
|
-
var _templateObject$
|
|
2883
|
-
var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
2973
|
+
var _templateObject$m;
|
|
2974
|
+
var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject$m || (_templateObject$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 66px;\n height: auto;\n cursor: pointer;\n & img {\n width: auto;\n height: 100%;\n }\n"])));
|
|
2884
2975
|
|
|
2885
2976
|
var Logo = function Logo(_ref) {
|
|
2886
2977
|
var _ref$id = _ref.id,
|
|
@@ -2909,11 +3000,11 @@ var Logo = function Logo(_ref) {
|
|
|
2909
3000
|
}))));
|
|
2910
3001
|
};
|
|
2911
3002
|
|
|
2912
|
-
var _templateObject$
|
|
2913
|
-
var NavTopContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3003
|
+
var _templateObject$n;
|
|
3004
|
+
var NavTopContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$n || (_templateObject$n = /*#__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);
|
|
2914
3005
|
|
|
2915
|
-
var _templateObject$
|
|
2916
|
-
var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3006
|
+
var _templateObject$o, _templateObject2$8, _templateObject3$3, _templateObject4$1;
|
|
3007
|
+
var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$o || (_templateObject$o = /*#__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"])), function (_ref) {
|
|
2917
3008
|
var selected = _ref.selected,
|
|
2918
3009
|
colorPrimary = _ref.colorPrimary;
|
|
2919
3010
|
|
|
@@ -2932,8 +3023,8 @@ var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$m || (_te
|
|
|
2932
3023
|
var colorPrimary = _ref4.colorPrimary;
|
|
2933
3024
|
return colorPrimary;
|
|
2934
3025
|
});
|
|
2935
|
-
var SvgContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
2936
|
-
var NumContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
3026
|
+
var SvgContainer = /*#__PURE__*/styled__default.div(_templateObject2$8 || (_templateObject2$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n"])));
|
|
3027
|
+
var NumContainer = /*#__PURE__*/styled__default.div(_templateObject3$3 || (_templateObject3$3 = /*#__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"])));
|
|
2937
3028
|
var BasketText = /*#__PURE__*/styled__default.a(_templateObject4$1 || (_templateObject4$1 = /*#__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\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
2938
3029
|
|
|
2939
3030
|
var Basket$1 = function Basket(_ref) {
|
|
@@ -2976,8 +3067,8 @@ var Basket$1 = function Basket(_ref) {
|
|
|
2976
3067
|
}, text) : ''));
|
|
2977
3068
|
};
|
|
2978
3069
|
|
|
2979
|
-
var _templateObject$
|
|
2980
|
-
var SearchContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3070
|
+
var _templateObject$p, _templateObject2$9;
|
|
3071
|
+
var SearchContainer = /*#__PURE__*/styled__default.div(_templateObject$p || (_templateObject$p = /*#__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) {
|
|
2981
3072
|
var selected = _ref.selected,
|
|
2982
3073
|
colorPrimary = _ref.colorPrimary;
|
|
2983
3074
|
|
|
@@ -2993,7 +3084,7 @@ var SearchContainer = /*#__PURE__*/styled__default.div(_templateObject$n || (_te
|
|
|
2993
3084
|
var colorPrimary = _ref3.colorPrimary;
|
|
2994
3085
|
return colorPrimary;
|
|
2995
3086
|
});
|
|
2996
|
-
var SvgContainer$1 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3087
|
+
var SvgContainer$1 = /*#__PURE__*/styled__default.div(_templateObject2$9 || (_templateObject2$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n }\n"])));
|
|
2997
3088
|
|
|
2998
3089
|
var Search$1 = function Search(_ref) {
|
|
2999
3090
|
var _ref$selected = _ref.selected,
|
|
@@ -3020,13 +3111,13 @@ var Search$1 = function Search(_ref) {
|
|
|
3020
3111
|
})));
|
|
3021
3112
|
};
|
|
3022
3113
|
|
|
3023
|
-
var _templateObject$
|
|
3024
|
-
var TabContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3025
|
-
var OptionItem = /*#__PURE__*/styled__default.a(_templateObject2$
|
|
3114
|
+
var _templateObject$q, _templateObject2$a, _templateObject3$4;
|
|
3115
|
+
var TabContainer = /*#__PURE__*/styled__default.div(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: column;\n position: relative;\n"])));
|
|
3116
|
+
var OptionItem = /*#__PURE__*/styled__default.a(_templateObject2$a || (_templateObject2$a = /*#__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 text-decoration: none;\n cursor: pointer;\n text-transform: uppercase;\n\n :hover,\n :focus {\n color: var(--base-color-", ");\n }\n"])), function (_ref) {
|
|
3026
3117
|
var colorPrimary = _ref.colorPrimary;
|
|
3027
3118
|
return colorPrimary;
|
|
3028
3119
|
});
|
|
3029
|
-
var OptionsContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
3120
|
+
var OptionsContainer = /*#__PURE__*/styled__default.div(_templateObject3$4 || (_templateObject3$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-white);\n border: 1px solid var(--base-color-light-grey);\n border-top-color: var(--base-color-", ");\n display: flex;\n flex-direction: column;\n row-gap: var(--navigation-small-gap);\n padding: var(--navigation-middle-gap);\n position: absolute;\n top: 24px;\n min-width: calc(100% - calc(2 * var(--navigation-middle-gap)));\n max-width: max-content;\n white-space: nowrap;\n z-index: ", ";\n\n ", "\n\n @media ", " {\n padding-left: 0px;\n padding-bottom: 0px;\n row-gap: var(--navigation-large-gap);\n border: 0;\n background-color: none;\n\n ", "\n }\n"])), function (_ref2) {
|
|
3030
3121
|
var colorPrimary = _ref2.colorPrimary;
|
|
3031
3122
|
return colorPrimary;
|
|
3032
3123
|
}, zIndexes.menu, function (props) {
|
|
@@ -3285,16 +3376,16 @@ var NavTop = function NavTop(_ref) {
|
|
|
3285
3376
|
}));
|
|
3286
3377
|
};
|
|
3287
3378
|
|
|
3288
|
-
var _templateObject$
|
|
3289
|
-
var TabsContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3290
|
-
var ItemsContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3379
|
+
var _templateObject$r, _templateObject2$b, _templateObject3$5, _templateObject4$2;
|
|
3380
|
+
var TabsContainer = /*#__PURE__*/styled__default.div(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
|
|
3381
|
+
var ItemsContainer = /*#__PURE__*/styled__default.div(_templateObject2$b || (_templateObject2$b = /*#__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 ", "\n }\n"])), devices.desktop, devices.mobileAndTablet, function (props) {
|
|
3291
3382
|
if (props.showMenu) {
|
|
3292
3383
|
return "\n display: flex;\n flex-direction: column;\n row-gap: 32px;\n ";
|
|
3293
3384
|
}
|
|
3294
3385
|
|
|
3295
3386
|
return "display: none;";
|
|
3296
3387
|
});
|
|
3297
|
-
var MenuContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
3388
|
+
var MenuContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$5 || (_templateObject3$5 = /*#__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) {
|
|
3298
3389
|
var colorPrimary = _ref.colorPrimary;
|
|
3299
3390
|
return colorPrimary;
|
|
3300
3391
|
}, function (_ref2) {
|
|
@@ -3303,9 +3394,9 @@ var MenuContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$4 || (_t
|
|
|
3303
3394
|
}, devices.mobileAndTablet);
|
|
3304
3395
|
var MenuItem = /*#__PURE__*/styled__default.div(_templateObject4$2 || (_templateObject4$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n a {\n margin-left: 20px;\n }\n }\n"])), devices.mobileAndTablet);
|
|
3305
3396
|
|
|
3306
|
-
var _templateObject$
|
|
3307
|
-
var ControlledDropdownWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3308
|
-
var ControlledDropdownHeaderContainer = /*#__PURE__*/styled__default.span(_templateObject2$
|
|
3397
|
+
var _templateObject$s, _templateObject2$c, _templateObject3$6, _templateObject4$3;
|
|
3398
|
+
var ControlledDropdownWrapper = /*#__PURE__*/styled__default.div(_templateObject$s || (_templateObject$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: fit-content;\n"])));
|
|
3399
|
+
var ControlledDropdownHeaderContainer = /*#__PURE__*/styled__default.span(_templateObject2$c || (_templateObject2$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 6px;\n border-bottom: 1px solid transparent;\n height: 24px;\n line-height: 24px;\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 text-transform: uppercase;\n cursor: pointer;\n\n ", "\n"])), function (_ref) {
|
|
3309
3400
|
var active = _ref.active,
|
|
3310
3401
|
activeColor = _ref.activeColor;
|
|
3311
3402
|
|
|
@@ -3317,7 +3408,7 @@ var ControlledDropdownHeaderContainer = /*#__PURE__*/styled__default.span(_templ
|
|
|
3317
3408
|
});
|
|
3318
3409
|
var ControlledDropdownHeaderContainerLink = /*#__PURE__*/styled__default(ControlledDropdownHeaderContainer).attrs({
|
|
3319
3410
|
as: 'a'
|
|
3320
|
-
})(_templateObject3$
|
|
3411
|
+
})(_templateObject3$6 || (_templateObject3$6 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
3321
3412
|
var IconWrapper$1 = /*#__PURE__*/styled__default.span(_templateObject4$3 || (_templateObject4$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n"])));
|
|
3322
3413
|
|
|
3323
3414
|
var ControlledDropdown = function ControlledDropdown(_ref) {
|
|
@@ -3564,46 +3655,14 @@ var Tabs = function Tabs(_ref) {
|
|
|
3564
3655
|
}, "MENU"))));
|
|
3565
3656
|
};
|
|
3566
3657
|
|
|
3567
|
-
var _templateObject$
|
|
3568
|
-
var SearchBarContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3569
|
-
var SvgContainerSearch = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3570
|
-
var SvgContainerClose = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
3658
|
+
var _templateObject$t, _templateObject2$d, _templateObject3$7, _templateObject4$4, _templateObject5$1, _templateObject6$1;
|
|
3659
|
+
var SearchBarContainer = /*#__PURE__*/styled__default.div(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n column-gap: 64px;\n justify-content: space-between;\n align-items: center;\n height: 100px;\n background-color: var(--base-color-white);\n\n @media ", " {\n column-gap: 12px;\n height: 80px;\n }\n"])), devices.mobile);
|
|
3660
|
+
var SvgContainerSearch = /*#__PURE__*/styled__default.div(_templateObject2$d || (_templateObject2$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n width: var(--navigation-xlarge-gap);\n height: var(--navigation-xlarge-gap);\n }\n"])));
|
|
3661
|
+
var SvgContainerClose = /*#__PURE__*/styled__default.div(_templateObject3$7 || (_templateObject3$7 = /*#__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"])));
|
|
3571
3662
|
var InputContainer = /*#__PURE__*/styled__default.div(_templateObject4$4 || (_templateObject4$4 = /*#__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);
|
|
3572
3663
|
var SearchLinkContainer = /*#__PURE__*/styled__default.div(_templateObject5$1 || (_templateObject5$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
3573
3664
|
var SearchArrowContainer = /*#__PURE__*/styled__default.a(_templateObject6$1 || (_templateObject6$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n height: 24px;\n width: 24px;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
3574
3665
|
|
|
3575
|
-
var _templateObject$s, _templateObject2$c;
|
|
3576
|
-
var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$s || (_templateObject$s = /*#__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) {
|
|
3577
|
-
var iconName = _ref.iconName;
|
|
3578
|
-
return iconName ? 'calc(var(--text-link-underline-offset) - 4px)' : 'var(--text-link-underline-offset)';
|
|
3579
|
-
}, function (_ref2) {
|
|
3580
|
-
var color = _ref2.color;
|
|
3581
|
-
return color;
|
|
3582
|
-
});
|
|
3583
|
-
var TextLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$c || (_templateObject2$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-left: var(--button-icon-margin);\n"])));
|
|
3584
|
-
|
|
3585
|
-
var _excluded$5 = ["children", "iconName", "iconDirection", "color"];
|
|
3586
|
-
|
|
3587
|
-
var TextLink = function TextLink(_ref) {
|
|
3588
|
-
var children = _ref.children,
|
|
3589
|
-
iconName = _ref.iconName,
|
|
3590
|
-
iconDirection = _ref.iconDirection,
|
|
3591
|
-
color = _ref.color,
|
|
3592
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
3593
|
-
|
|
3594
|
-
var truncatedString = children.substring(0, 30);
|
|
3595
|
-
return /*#__PURE__*/React__default.createElement(TextLinkWrapper, Object.assign({
|
|
3596
|
-
color: color,
|
|
3597
|
-
iconName: iconName
|
|
3598
|
-
}, rest), truncatedString, iconName ? /*#__PURE__*/React__default.createElement(TextLinkIconWrapper, {
|
|
3599
|
-
"data-testid": "text-link-icon"
|
|
3600
|
-
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
3601
|
-
iconName: iconName,
|
|
3602
|
-
direction: iconDirection,
|
|
3603
|
-
color: color
|
|
3604
|
-
})) : null);
|
|
3605
|
-
};
|
|
3606
|
-
|
|
3607
3666
|
var SearchBar = function SearchBar(_ref) {
|
|
3608
3667
|
var onClick = _ref.onClick,
|
|
3609
3668
|
onClose = _ref.onClose;
|
|
@@ -3818,18 +3877,18 @@ var Navigation = function Navigation(_ref) {
|
|
|
3818
3877
|
})))));
|
|
3819
3878
|
};
|
|
3820
3879
|
|
|
3821
|
-
var _templateObject$
|
|
3822
|
-
var FooterSection = /*#__PURE__*/styled__default.section(_templateObject$
|
|
3823
|
-
var FooterContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3824
|
-
var PolicyLinksRow = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
3880
|
+
var _templateObject$u, _templateObject2$e, _templateObject3$8, _templateObject4$5, _templateObject5$2, _templateObject6$2;
|
|
3881
|
+
var FooterSection = /*#__PURE__*/styled__default.section(_templateObject$u || (_templateObject$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n color: var(--base-color-white);\n"])));
|
|
3882
|
+
var FooterContainer = /*#__PURE__*/styled__default.div(_templateObject2$e || (_templateObject2$e = /*#__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"])));
|
|
3883
|
+
var PolicyLinksRow = /*#__PURE__*/styled__default.div(_templateObject3$8 || (_templateObject3$8 = /*#__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);
|
|
3825
3884
|
var ContactNewsletterRow = /*#__PURE__*/styled__default.div(_templateObject4$5 || (_templateObject4$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row2;\n\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), devices.mobile);
|
|
3826
3885
|
var ArtsLogoRow = /*#__PURE__*/styled__default.div(_templateObject5$2 || (_templateObject5$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: row3;\n justify-self: center;\n\n @media ", " {\n justify-self: start;\n }\n"])), devices.mobile);
|
|
3827
3886
|
var AdditionalInfo = /*#__PURE__*/styled__default.p(_templateObject6$2 || (_templateObject6$2 = /*#__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);
|
|
3828
3887
|
|
|
3829
|
-
var _templateObject$
|
|
3830
|
-
var PolicyLinksList = /*#__PURE__*/styled__default.ul(_templateObject$
|
|
3831
|
-
var PolicyLinkItem = /*#__PURE__*/styled__default.li(_templateObject2$
|
|
3832
|
-
var PolicyLink = /*#__PURE__*/styled__default.a(_templateObject3$
|
|
3888
|
+
var _templateObject$v, _templateObject2$f, _templateObject3$9;
|
|
3889
|
+
var PolicyLinksList = /*#__PURE__*/styled__default.ul(_templateObject$v || (_templateObject$v = /*#__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);
|
|
3890
|
+
var PolicyLinkItem = /*#__PURE__*/styled__default.li(_templateObject2$f || (_templateObject2$f = /*#__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);
|
|
3891
|
+
var PolicyLink = /*#__PURE__*/styled__default.a(_templateObject3$9 || (_templateObject3$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: fit-content;\n text-decoration: none;\n text-transform: uppercase;\n color: var(--base-color-white);\n cursor: pointer;\n"])));
|
|
3833
3892
|
|
|
3834
3893
|
var PolicyLinks = function PolicyLinks(_ref) {
|
|
3835
3894
|
var _ref$items = _ref.items,
|
|
@@ -3845,10 +3904,10 @@ var PolicyLinks = function PolicyLinks(_ref) {
|
|
|
3845
3904
|
}));
|
|
3846
3905
|
};
|
|
3847
3906
|
|
|
3848
|
-
var _templateObject$
|
|
3849
|
-
var ContactNewsletterWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3850
|
-
var ContactNewsletterSeparator = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
3851
|
-
var SignUpWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
3907
|
+
var _templateObject$w, _templateObject2$g, _templateObject3$a, _templateObject4$6, _templateObject5$3, _templateObject6$3, _templateObject7$1, _templateObject8$1;
|
|
3908
|
+
var ContactNewsletterWrapper = /*#__PURE__*/styled__default.div(_templateObject$w || (_templateObject$w = /*#__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);
|
|
3909
|
+
var ContactNewsletterSeparator = /*#__PURE__*/styled__default.div(_templateObject2$g || (_templateObject2$g = /*#__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);
|
|
3910
|
+
var SignUpWrapper = /*#__PURE__*/styled__default.div(_templateObject3$a || (_templateObject3$a = /*#__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);
|
|
3852
3911
|
var SignUpText = /*#__PURE__*/styled__default.p(_templateObject4$6 || (_templateObject4$6 = /*#__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);
|
|
3853
3912
|
var ContactWrapper = /*#__PURE__*/styled__default.div(_templateObject5$3 || (_templateObject5$3 = /*#__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);
|
|
3854
3913
|
var MediaLinksWrapper = /*#__PURE__*/styled__default.div(_templateObject6$3 || (_templateObject6$3 = /*#__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);
|
|
@@ -3919,14 +3978,11 @@ var Footer = function Footer(_ref) {
|
|
|
3919
3978
|
}, additionalInfo)))));
|
|
3920
3979
|
};
|
|
3921
3980
|
|
|
3922
|
-
var _templateObject$
|
|
3923
|
-
var AnchorTapbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
3924
|
-
var
|
|
3925
|
-
var
|
|
3926
|
-
var
|
|
3927
|
-
var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject5$4 || (_templateObject5$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
|
|
3928
|
-
var TabsWrapper = /*#__PURE__*/styled__default.div(_templateObject6$4 || (_templateObject6$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
3929
|
-
var TabsList = /*#__PURE__*/styled__default.ul(_templateObject7$2 || (_templateObject7$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n display: flex;\n gap: 32px;\n justify-content: ", ";\n align-items: center;\n list-style: none;\n padding: 0;\n margin: 0;\n height: var(--anchor-tabs-height);\n white-space: nowrap;\n overflow: scroll;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n scroll-behavior: smooth;\n\n @media ", " {\n & {\n width: ", ";\n }\n }\n"])), function (_ref) {
|
|
3981
|
+
var _templateObject$x, _templateObject2$h, _templateObject3$b, _templateObject4$7, _templateObject5$4, _templateObject6$4;
|
|
3982
|
+
var AnchorTapbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$x || (_templateObject$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n top: 0;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), zIndexes.anchor);
|
|
3983
|
+
var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$h || (_templateObject2$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--anchor-tabs-height);\n"])));
|
|
3984
|
+
var TabsWrapper = /*#__PURE__*/styled__default.div(_templateObject3$b || (_templateObject3$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
3985
|
+
var TabsList = /*#__PURE__*/styled__default.ul(_templateObject4$7 || (_templateObject4$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: ", ";\n display: flex;\n gap: 32px;\n justify-content: ", ";\n align-items: center;\n list-style: none;\n padding: 0;\n margin: 0;\n height: var(--anchor-tabs-height);\n white-space: nowrap;\n overflow: scroll;\n scrollbar-width: none;\n ::-webkit-scrollbar {\n display: none;\n }\n scroll-behavior: smooth;\n\n @media ", " {\n & {\n width: ", ";\n }\n }\n"])), function (_ref) {
|
|
3930
3986
|
var tabsOverflow = _ref.tabsOverflow;
|
|
3931
3987
|
return tabsOverflow ? 'calc(100% - 74px)' : '100%';
|
|
3932
3988
|
}, function (_ref2) {
|
|
@@ -3936,31 +3992,13 @@ var TabsList = /*#__PURE__*/styled__default.ul(_templateObject7$2 || (_templateO
|
|
|
3936
3992
|
var tabsOverflow = _ref3.tabsOverflow;
|
|
3937
3993
|
return tabsOverflow ? 'calc(100% - 50px)' : '100%';
|
|
3938
3994
|
});
|
|
3939
|
-
var ArrowsContainer = /*#__PURE__*/styled__default.div(
|
|
3940
|
-
var ArrowWrapper = /*#__PURE__*/styled__default.div(
|
|
3941
|
-
var ButtonsMobileWrapper = /*#__PURE__*/styled__default.div(_templateObject10$1 || (_templateObject10$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: block;\n }\n }\n"])), devices.mobile);
|
|
3942
|
-
var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n"])), function (_ref4) {
|
|
3943
|
-
var theme = _ref4.theme;
|
|
3944
|
-
return theme.colors.primaryButtonReverseBg;
|
|
3945
|
-
}, function (_ref5) {
|
|
3946
|
-
var theme = _ref5.theme;
|
|
3947
|
-
return theme.colors.primaryButtonReverseBg;
|
|
3948
|
-
}, function (_ref6) {
|
|
3949
|
-
var theme = _ref6.theme;
|
|
3950
|
-
return theme.colors.primaryButtonReverse;
|
|
3951
|
-
}, function (_ref7) {
|
|
3952
|
-
var theme = _ref7.theme;
|
|
3953
|
-
return theme.colors.primaryButtonReverse;
|
|
3954
|
-
});
|
|
3995
|
+
var ArrowsContainer = /*#__PURE__*/styled__default.div(_templateObject5$4 || (_templateObject5$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 74px;\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"])));
|
|
3996
|
+
var ArrowWrapper = /*#__PURE__*/styled__default.div(_templateObject6$4 || (_templateObject6$4 = /*#__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"])));
|
|
3955
3997
|
|
|
3956
|
-
var _excluded$7 = ["text"]
|
|
3957
|
-
_excluded2 = ["text"],
|
|
3958
|
-
_excluded3 = ["id", "text"];
|
|
3998
|
+
var _excluded$7 = ["id", "text"];
|
|
3959
3999
|
|
|
3960
4000
|
var AnchorTapBar = function AnchorTapBar(_ref) {
|
|
3961
4001
|
var tabs = _ref.tabs,
|
|
3962
|
-
title = _ref.title,
|
|
3963
|
-
links = _ref.links,
|
|
3964
4002
|
onTabClick = _ref.onTabClick,
|
|
3965
4003
|
activeTab = _ref.activeTab;
|
|
3966
4004
|
var tabListRef = React.useRef(null);
|
|
@@ -3981,8 +4019,6 @@ var AnchorTapBar = function AnchorTapBar(_ref) {
|
|
|
3981
4019
|
canScrollToRight = _useState4[0],
|
|
3982
4020
|
setCanScrollToRight = _useState4[1];
|
|
3983
4021
|
|
|
3984
|
-
var hasTitleOrLinks = title || links;
|
|
3985
|
-
|
|
3986
4022
|
var isSelectedItem = function isSelectedItem(id) {
|
|
3987
4023
|
return id === selectedItem;
|
|
3988
4024
|
};
|
|
@@ -4004,7 +4040,7 @@ var AnchorTapBar = function AnchorTapBar(_ref) {
|
|
|
4004
4040
|
}, [tabListRef]);
|
|
4005
4041
|
React.useEffect(function () {
|
|
4006
4042
|
var scrollTriggerCheck = function scrollTriggerCheck() {
|
|
4007
|
-
var elementGap =
|
|
4043
|
+
var elementGap = 100;
|
|
4008
4044
|
var reachedItem = tabs == null ? void 0 : tabs.find(function (item) {
|
|
4009
4045
|
var targetSectionElement = document.getElementById(item.id);
|
|
4010
4046
|
if (!targetSectionElement) return false;
|
|
@@ -4041,18 +4077,10 @@ var AnchorTapBar = function AnchorTapBar(_ref) {
|
|
|
4041
4077
|
return function () {
|
|
4042
4078
|
return document.removeEventListener('scroll', scrollTriggerCheck);
|
|
4043
4079
|
};
|
|
4044
|
-
}, [tabs, selectedItem,
|
|
4080
|
+
}, [tabs, selectedItem, tabListRef]);
|
|
4045
4081
|
var tabsColumnStart = tabsOverflow ? !canScrollToLeft ? 2 : 1 : 3;
|
|
4046
4082
|
var tabsColumnSpan = tabsOverflow ? !canScrollToLeft ? 14 : 15 : 13;
|
|
4047
4083
|
|
|
4048
|
-
var _ref3 = (links == null ? void 0 : links[0]) || {},
|
|
4049
|
-
primaryButtonText = _ref3.text,
|
|
4050
|
-
primaryButtonProps = _objectWithoutPropertiesLoose(_ref3, _excluded$7);
|
|
4051
|
-
|
|
4052
|
-
var _ref4 = (links == null ? void 0 : links[1]) || {},
|
|
4053
|
-
secondaryButtonText = _ref4.text,
|
|
4054
|
-
secondaryButtonProps = _objectWithoutPropertiesLoose(_ref4, _excluded2);
|
|
4055
|
-
|
|
4056
4084
|
var scrollToRight = function scrollToRight() {
|
|
4057
4085
|
if (tabListRef.current) {
|
|
4058
4086
|
var scroll = tabListRef.current.scrollLeft;
|
|
@@ -4070,34 +4098,19 @@ var AnchorTapBar = function AnchorTapBar(_ref) {
|
|
|
4070
4098
|
};
|
|
4071
4099
|
|
|
4072
4100
|
var onTabsScroll = function onTabsScroll() {
|
|
4073
|
-
var
|
|
4074
|
-
|
|
4075
|
-
scrollLeft =
|
|
4076
|
-
|
|
4077
|
-
clientWidth =
|
|
4078
|
-
|
|
4079
|
-
scrollWidth =
|
|
4101
|
+
var _ref3 = (tabListRef == null ? void 0 : tabListRef.current) || {},
|
|
4102
|
+
_ref3$scrollLeft = _ref3.scrollLeft,
|
|
4103
|
+
scrollLeft = _ref3$scrollLeft === void 0 ? 0 : _ref3$scrollLeft,
|
|
4104
|
+
_ref3$clientWidth = _ref3.clientWidth,
|
|
4105
|
+
clientWidth = _ref3$clientWidth === void 0 ? 0 : _ref3$clientWidth,
|
|
4106
|
+
_ref3$scrollWidth = _ref3.scrollWidth,
|
|
4107
|
+
scrollWidth = _ref3$scrollWidth === void 0 ? 0 : _ref3$scrollWidth;
|
|
4080
4108
|
|
|
4081
4109
|
setCanScrollToLeft(scrollLeft > 0);
|
|
4082
4110
|
setCanScrollToRight(scrollLeft + clientWidth < scrollWidth);
|
|
4083
4111
|
};
|
|
4084
4112
|
|
|
4085
|
-
return /*#__PURE__*/React__default.createElement(AnchorTapbarWrapper, null,
|
|
4086
|
-
columnStartDesktop: 2,
|
|
4087
|
-
columnSpanDesktop: 9,
|
|
4088
|
-
columnStartDevice: 2,
|
|
4089
|
-
columnSpanDevice: 12
|
|
4090
|
-
}, /*#__PURE__*/React__default.createElement(AnchorTitle, {
|
|
4091
|
-
"data-testid": "anchor-title"
|
|
4092
|
-
}, /*#__PURE__*/React__default.createElement(Header, {
|
|
4093
|
-
level: 5
|
|
4094
|
-
}, title))) : null, links != null && links[0] ? /*#__PURE__*/React__default.createElement(ButtonsDesktopGridItem, {
|
|
4095
|
-
columnStartDesktop: 12,
|
|
4096
|
-
columnSpanDesktop: 5,
|
|
4097
|
-
columnStartDevice: 2,
|
|
4098
|
-
columnSpanDevice: 12,
|
|
4099
|
-
"data-testid": "anchor-ctas"
|
|
4100
|
-
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, primaryButtonProps), primaryButtonText), links != null && links[1] ? /*#__PURE__*/React__default.createElement(PrimaryButtonReverse, Object.assign({}, secondaryButtonProps), secondaryButtonText) : null) : null)) : null, /*#__PURE__*/React__default.createElement(TabsGrid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
4113
|
+
return /*#__PURE__*/React__default.createElement(AnchorTapbarWrapper, null, /*#__PURE__*/React__default.createElement(TabsGrid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
4101
4114
|
columnStartDesktop: tabsColumnStart,
|
|
4102
4115
|
columnSpanDesktop: tabsColumnSpan,
|
|
4103
4116
|
columnStartDevice: 2,
|
|
@@ -4108,10 +4121,10 @@ var AnchorTapBar = function AnchorTapBar(_ref) {
|
|
|
4108
4121
|
ref: tabListRef,
|
|
4109
4122
|
tabsOverflow: tabsOverflow,
|
|
4110
4123
|
onScroll: onTabsScroll
|
|
4111
|
-
}, tabs.map(function (
|
|
4112
|
-
var id =
|
|
4113
|
-
text =
|
|
4114
|
-
rest = _objectWithoutPropertiesLoose(
|
|
4124
|
+
}, tabs.map(function (_ref4) {
|
|
4125
|
+
var id = _ref4.id,
|
|
4126
|
+
text = _ref4.text,
|
|
4127
|
+
rest = _objectWithoutPropertiesLoose(_ref4, _excluded$7);
|
|
4115
4128
|
|
|
4116
4129
|
return /*#__PURE__*/React__default.createElement("li", {
|
|
4117
4130
|
key: id
|
|
@@ -4132,7 +4145,7 @@ var AnchorTapBar = function AnchorTapBar(_ref) {
|
|
|
4132
4145
|
onClick: scrollToRight
|
|
4133
4146
|
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
4134
4147
|
iconName: "Arrow"
|
|
4135
|
-
})) : null) : null)))
|
|
4148
|
+
})) : null) : null))));
|
|
4136
4149
|
};
|
|
4137
4150
|
|
|
4138
4151
|
(function (CarouselType) {
|
|
@@ -4141,8 +4154,8 @@ var AnchorTapBar = function AnchorTapBar(_ref) {
|
|
|
4141
4154
|
CarouselType["LargeCard"] = "LargeCard";
|
|
4142
4155
|
})(exports.CarouselType || (exports.CarouselType = {}));
|
|
4143
4156
|
|
|
4144
|
-
var _templateObject$
|
|
4145
|
-
var CarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4157
|
+
var _templateObject$y, _templateObject2$i, _templateObject3$c, _templateObject4$8;
|
|
4158
|
+
var CarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject$y || (_templateObject$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: none;\n\n ", "\n\n @media ", " {\n ", "\n }\n"])), function (_ref) {
|
|
4146
4159
|
var type = _ref.type,
|
|
4147
4160
|
imagesHeightDesktop = _ref.imagesHeightDesktop;
|
|
4148
4161
|
|
|
@@ -4174,8 +4187,8 @@ var CarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject$x || (_te
|
|
|
4174
4187
|
return "\n &&& {\n .swiper-slide > div{\n height: calc(" + imagesHeightDevice + "px + var(--line-height-body-2) + 12px);\n }\n }";
|
|
4175
4188
|
}
|
|
4176
4189
|
});
|
|
4177
|
-
var TitleButtonsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
4178
|
-
var TitleWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4190
|
+
var TitleButtonsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$i || (_templateObject2$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 28px;\n\n @media ", " {\n margin-bottom: 20px;\n }\n"])), devices.mobile);
|
|
4191
|
+
var TitleWrapper = /*#__PURE__*/styled__default.div(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: center;\n user-select: text;\n\n h4 {\n padding: 0;\n margin: 0;\n }\n"])));
|
|
4179
4192
|
var ButtonsWrapper = /*#__PURE__*/styled__default.div(_templateObject4$8 || (_templateObject4$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n align-items: start;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
|
|
4180
4193
|
|
|
4181
4194
|
var Carousel = function Carousel(_ref) {
|
|
@@ -4283,9 +4296,9 @@ var Carousel = function Carousel(_ref) {
|
|
|
4283
4296
|
})))));
|
|
4284
4297
|
};
|
|
4285
4298
|
|
|
4286
|
-
var _templateObject$
|
|
4287
|
-
var HighlightsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
4288
|
-
var CarouselTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4299
|
+
var _templateObject$z, _templateObject2$j, _templateObject3$d, _templateObject4$9, _templateObject5$5, _templateObject6$5, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1;
|
|
4300
|
+
var HighlightsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$z || (_templateObject$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-template-rows: max-content minmax(0, 1fr);\n gap: 0 var(--grid-column-gap);\n background-color: var(--base-color-black);\n color: var(--base-color-white);\n user-select: none;\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
|
|
4301
|
+
var CarouselTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$j || (_templateObject2$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 1 / 1 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n padding-top: 40px;\n padding-left: 50px;\n padding-right: 36px;\n user-select: text;\n\n h4 {\n margin: 0;\n padding: 0;\n }\n\n h5 {\n display: none;\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 12;\n padding: 12px 0 12px var(--grid-margin);\n min-height: 64px;\n box-sizing: border-box;\n width: 100%;\n\n h4 {\n display: none;\n }\n\n h5 {\n margin: 0;\n padding: 0;\n display: block;\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: 40px;\n }\n }\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 11;\n width: 100%;\n padding: 8px 0 8px 20px;\n min-height: var(--line-height-altHeader-5);\n\n h4 {\n display: none;\n }\n\n h5 {\n margin: 0;\n padding: 0;\n display: block;\n }\n }\n }\n"])), devices.tablet, function (_ref) {
|
|
4289
4302
|
var theme = _ref.theme;
|
|
4290
4303
|
return theme.fonts.mobile.sizes.altHeaders[5];
|
|
4291
4304
|
}, function (_ref2) {
|
|
@@ -4295,7 +4308,7 @@ var CarouselTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$i |
|
|
|
4295
4308
|
var theme = _ref3.theme;
|
|
4296
4309
|
return theme.fonts.mobile.letterSpacing.altHeaders[5];
|
|
4297
4310
|
}, devices.mobile);
|
|
4298
|
-
var InfoWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4311
|
+
var InfoWrapper = /*#__PURE__*/styled__default.div(_templateObject3$d || (_templateObject3$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 2 / 1 / 2 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n align-self: center;\n padding: 36px 36px 36px 50px;\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 2 / 7;\n padding: 0 12px 12px var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n grid-area: 3 / 1 / 4 / 15;\n width: 100%;\n padding: 0 20px;\n margin: 24px 0;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
4299
4312
|
var InfoLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n width: 132px;\n height: 36px;\n\n @media ", " {\n & {\n margin-bottom: 16px;\n width: 102px;\n height: 28px;\n }\n }\n\n @media ", " {\n & {\n margin-bottom: 20px;\n width: 102px;\n height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
4300
4313
|
var InfoTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject5$5 || (_templateObject5$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n h3 {\n padding: 0;\n margin: 0 0 8px 0;\n }\n\n h6 {\n padding: 0;\n margin: 0;\n }\n\n @media ", " {\n & {\n h3 {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n\n h6 {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n }\n }\n"])), devices.tablet, function (_ref4) {
|
|
4301
4314
|
var theme = _ref4.theme;
|
|
@@ -4347,10 +4360,10 @@ var InfoTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$5 || (_t
|
|
|
4347
4360
|
var theme = _ref19.theme;
|
|
4348
4361
|
return theme.fonts.mobile.lineHeights.body[1];
|
|
4349
4362
|
}, devices.mobile);
|
|
4350
|
-
var InfoLinkWrapper = /*#__PURE__*/styled__default.div(_templateObject7$
|
|
4351
|
-
var CarouselWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject8$
|
|
4352
|
-
var RotatorButtonsWrapper = /*#__PURE__*/styled__default.div(_templateObject9$
|
|
4353
|
-
var RotatorButtonsWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject10$
|
|
4363
|
+
var InfoLinkWrapper = /*#__PURE__*/styled__default.div(_templateObject7$2 || (_templateObject7$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n\n @media ", " {\n & {\n margin-top: 16px;\n }\n }\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
4364
|
+
var CarouselWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject8$2 || (_templateObject8$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n\n .swiper-slide {\n width: calc(100% - 50px - var(--rotator-button-width));\n -webkit-transform: translate3d(0, 0, 0);\n }\n\n @media ", " {\n & {\n grid-area: 2 / 7 / 3 / 15;\n\n .swiper-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 3 / 15;\n\n .swiper-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
4365
|
+
var RotatorButtonsWrapper = /*#__PURE__*/styled__default.div(_templateObject9$1 || (_templateObject9$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: 50px;\n top: calc(50% - calc(var(--rotator-button-width) / 2));\n z-index: 2;\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.mobileAndTablet);
|
|
4366
|
+
var RotatorButtonsWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject10$1 || (_templateObject10$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: flex;\n grid-area: 1 / 12 / 2 / 14;\n align-self: center;\n justify-content: flex-end;\n }\n }\n\n @media ", " {\n & {\n display: flex;\n grid-area: 1 / 11 / 2 / 14;\n align-self: center;\n justify-content: flex-end;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
4354
4367
|
|
|
4355
4368
|
var _excluded$8 = ["text"];
|
|
4356
4369
|
|
|
@@ -4510,12 +4523,73 @@ var HighlightsStream = function HighlightsStream(_ref) {
|
|
|
4510
4523
|
})));
|
|
4511
4524
|
};
|
|
4512
4525
|
|
|
4513
|
-
var _templateObject$
|
|
4514
|
-
var
|
|
4515
|
-
var
|
|
4516
|
-
|
|
4517
|
-
|
|
4518
|
-
var
|
|
4526
|
+
var _templateObject$A, _templateObject2$k, _templateObject3$e, _templateObject4$a, _templateObject5$6, _templateObject6$6, _templateObject7$3;
|
|
4527
|
+
var TitleCTAGridWrapper = /*#__PURE__*/styled__default.div(_templateObject$A || (_templateObject$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: -1px;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), function (_ref) {
|
|
4528
|
+
var sticky = _ref.sticky;
|
|
4529
|
+
return sticky ? 'sticky' : 'initial';
|
|
4530
|
+
}, zIndexes.anchor);
|
|
4531
|
+
var CTAGridWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject2$k || (_templateObject2$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: solid 2px var(--base-color-lightgrey);\n"])));
|
|
4532
|
+
var AnchorTitle = /*#__PURE__*/styled__default.div(_templateObject3$e || (_templateObject3$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: var(--button-height);\n\n h5 {\n padding: 0;\n margin: 0;\n }\n\n @media ", " {\n & {\n height: 50px;\n }\n }\n"])), devices.mobile);
|
|
4533
|
+
var GridItemTitleWrapper = /*#__PURE__*/styled__default(GridItem)(_templateObject4$a || (_templateObject4$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n {\n grid-column: 2 / span 9;\n }\n }\n"])), devices.tablet);
|
|
4534
|
+
var ButtonsDesktopGridItem = /*#__PURE__*/styled__default(GridItem)(_templateObject5$6 || (_templateObject5$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n\n @media ", " {\n display: none;\n }\n\n @media ", " {\n {\n grid-column: 12 / span 3;\n }\n }\n"])), devices.mobile, devices.tablet);
|
|
4535
|
+
var ButtonsMobileWrapper = /*#__PURE__*/styled__default.div(_templateObject6$6 || (_templateObject6$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: block;\n }\n }\n"])), devices.mobile);
|
|
4536
|
+
var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject7$3 || (_templateObject7$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n"])), function (_ref2) {
|
|
4537
|
+
var theme = _ref2.theme;
|
|
4538
|
+
return theme.colors.primaryButtonReverseBg;
|
|
4539
|
+
}, function (_ref3) {
|
|
4540
|
+
var theme = _ref3.theme;
|
|
4541
|
+
return theme.colors.primaryButtonReverseBg;
|
|
4542
|
+
}, function (_ref4) {
|
|
4543
|
+
var theme = _ref4.theme;
|
|
4544
|
+
return theme.colors.primaryButtonReverse;
|
|
4545
|
+
}, function (_ref5) {
|
|
4546
|
+
var theme = _ref5.theme;
|
|
4547
|
+
return theme.colors.primaryButtonReverse;
|
|
4548
|
+
});
|
|
4549
|
+
|
|
4550
|
+
var _excluded$b = ["text"],
|
|
4551
|
+
_excluded2 = ["text"];
|
|
4552
|
+
|
|
4553
|
+
var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
4554
|
+
var title = _ref.title,
|
|
4555
|
+
links = _ref.links,
|
|
4556
|
+
_ref$sticky = _ref.sticky,
|
|
4557
|
+
sticky = _ref$sticky === void 0 ? false : _ref$sticky;
|
|
4558
|
+
|
|
4559
|
+
var _ref2 = (links == null ? void 0 : links[0]) || {},
|
|
4560
|
+
primaryButtonText = _ref2.text,
|
|
4561
|
+
primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, _excluded$b);
|
|
4562
|
+
|
|
4563
|
+
var _ref3 = (links == null ? void 0 : links[1]) || {},
|
|
4564
|
+
secondaryButtonText = _ref3.text,
|
|
4565
|
+
secondaryButtonProps = _objectWithoutPropertiesLoose(_ref3, _excluded2);
|
|
4566
|
+
|
|
4567
|
+
return /*#__PURE__*/React__default.createElement(TitleCTAGridWrapper, {
|
|
4568
|
+
sticky: sticky
|
|
4569
|
+
}, /*#__PURE__*/React__default.createElement(CTAGridWrapper, null, title ? /*#__PURE__*/React__default.createElement(GridItemTitleWrapper, {
|
|
4570
|
+
columnStartDesktop: 2,
|
|
4571
|
+
columnSpanDesktop: 9,
|
|
4572
|
+
columnStartDevice: 2,
|
|
4573
|
+
columnSpanDevice: 12
|
|
4574
|
+
}, /*#__PURE__*/React__default.createElement(AnchorTitle, {
|
|
4575
|
+
"data-testid": "anchor-title"
|
|
4576
|
+
}, /*#__PURE__*/React__default.createElement(Header, {
|
|
4577
|
+
level: 5
|
|
4578
|
+
}, title))) : null, links != null && links[0] ? /*#__PURE__*/React__default.createElement(ButtonsDesktopGridItem, {
|
|
4579
|
+
columnStartDesktop: 12,
|
|
4580
|
+
columnSpanDesktop: 5,
|
|
4581
|
+
columnStartDevice: 2,
|
|
4582
|
+
columnSpanDevice: 12,
|
|
4583
|
+
"data-testid": "anchor-ctas"
|
|
4584
|
+
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, primaryButtonProps), primaryButtonText), links != null && links[1] ? /*#__PURE__*/React__default.createElement(PrimaryButtonReverse, Object.assign({}, secondaryButtonProps), secondaryButtonText) : null) : null), links != null && links[0] ? /*#__PURE__*/React__default.createElement(ButtonsMobileWrapper, null, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, primaryButtonProps), primaryButtonText)) : null);
|
|
4585
|
+
};
|
|
4586
|
+
|
|
4587
|
+
var _templateObject$B, _templateObject2$l, _templateObject3$f, _templateObject4$b, _templateObject5$7;
|
|
4588
|
+
var AccordionContainer = /*#__PURE__*/styled__default.div(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
4589
|
+
var LineContainer = /*#__PURE__*/styled__default.div(_templateObject2$l || (_templateObject2$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 2px;\n background-color: var(--base-color-lightgrey);\n width: 100%;\n"])));
|
|
4590
|
+
var ChildrenContainer = /*#__PURE__*/styled__default.div(_templateObject3$f || (_templateObject3$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n"])), devices.mobile);
|
|
4591
|
+
var TitleContainer$1 = /*#__PURE__*/styled__default.div(_templateObject4$b || (_templateObject4$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n\n && a {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-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: 28px 20px;\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);
|
|
4592
|
+
var ContentContainer = /*#__PURE__*/styled__default.div(_templateObject5$7 || (_templateObject5$7 = /*#__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"])));
|
|
4519
4593
|
|
|
4520
4594
|
var Accordion = function Accordion(_ref) {
|
|
4521
4595
|
var _ref$title = _ref.title,
|
|
@@ -4557,8 +4631,8 @@ var Accordion = function Accordion(_ref) {
|
|
|
4557
4631
|
}, /*#__PURE__*/React__default.createElement(ChildrenContainer, null, children)), showLine && /*#__PURE__*/React__default.createElement(LineContainer, null));
|
|
4558
4632
|
};
|
|
4559
4633
|
|
|
4560
|
-
var _templateObject$
|
|
4561
|
-
var AccordionsContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4634
|
+
var _templateObject$C;
|
|
4635
|
+
var AccordionsContainer = /*#__PURE__*/styled__default.div(_templateObject$C || (_templateObject$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
4562
4636
|
|
|
4563
4637
|
var Accordions = function Accordions(_ref) {
|
|
4564
4638
|
var _ref$items = _ref.items,
|
|
@@ -4577,25 +4651,25 @@ var Accordions = function Accordions(_ref) {
|
|
|
4577
4651
|
}));
|
|
4578
4652
|
};
|
|
4579
4653
|
|
|
4580
|
-
var _templateObject$
|
|
4654
|
+
var _templateObject$D, _templateObject2$m, _templateObject3$g, _templateObject4$c, _templateObject5$8, _templateObject6$7, _templateObject7$4, _templateObject8$3, _templateObject9$2;
|
|
4581
4655
|
var LENGTH_LARGE_TEXT = 28;
|
|
4582
4656
|
var LENGTH_SMALL_TEXT = 19;
|
|
4583
4657
|
var LENGTH_TEXT_TABLET = 10;
|
|
4584
|
-
var CardContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4585
|
-
var HoverContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4586
|
-
var ProgressContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4587
|
-
var ContentContainer$1 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
4658
|
+
var CardContainer = /*#__PURE__*/styled__default.div(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n .targetLink {\n text-decoration: none;\n color: inherit;\n }\n\n :hover {\n cursor: pointer;\n }\n"])));
|
|
4659
|
+
var HoverContainer = /*#__PURE__*/styled__default.div(_templateObject2$m || (_templateObject2$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--editorial-spacing-hover);\n background-color: var(--base-color-primary);\n position: absolute;\n width: 100%;\n z-index: ", ";\n"])), zIndexes.contentOverlay);
|
|
4660
|
+
var ProgressContainer = /*#__PURE__*/styled__default.div(_templateObject3$g || (_templateObject3$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: -10px;\n"])));
|
|
4661
|
+
var ContentContainer$1 = /*#__PURE__*/styled__default.div(_templateObject4$c || (_templateObject4$c = /*#__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 (_ref) {
|
|
4588
4662
|
var fullWidth = _ref.fullWidth;
|
|
4589
4663
|
return fullWidth ? '0' : '20px';
|
|
4590
4664
|
}, function (_ref2) {
|
|
4591
4665
|
var fullWidth = _ref2.fullWidth;
|
|
4592
4666
|
return fullWidth ? '0' : '20px';
|
|
4593
4667
|
});
|
|
4594
|
-
var TitleContainer$2 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
4595
|
-
var TitleContainerMobile = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
4668
|
+
var TitleContainer$2 = /*#__PURE__*/styled__default.div(_templateObject5$8 || (_templateObject5$8 = /*#__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.mobile);
|
|
4669
|
+
var TitleContainerMobile = /*#__PURE__*/styled__default.div(_templateObject6$7 || (_templateObject6$7 = /*#__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.mobile);
|
|
4596
4670
|
var TextContainer = /*#__PURE__*/styled__default.div(_templateObject7$4 || (_templateObject7$4 = /*#__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"])));
|
|
4597
|
-
var SubtitleContainer = /*#__PURE__*/styled__default.span(_templateObject8$
|
|
4598
|
-
var ButtonsContainer$1 = /*#__PURE__*/styled__default.div(_templateObject9$
|
|
4671
|
+
var SubtitleContainer = /*#__PURE__*/styled__default.span(_templateObject8$3 || (_templateObject8$3 = /*#__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"])));
|
|
4672
|
+
var ButtonsContainer$1 = /*#__PURE__*/styled__default.div(_templateObject9$2 || (_templateObject9$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n opacity: 0;\n display: flex;\n gap: 16px;\n margin-top: var(--editorial-margin-between);\n\n ", "\n\n @media ", " {\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref3) {
|
|
4599
4673
|
var size = _ref3.size,
|
|
4600
4674
|
primaryButtonTextLength = _ref3.primaryButtonTextLength,
|
|
4601
4675
|
tertiaryButtonTextLength = _ref3.tertiaryButtonTextLength;
|
|
@@ -4618,13 +4692,13 @@ var ButtonsContainer$1 = /*#__PURE__*/styled__default.div(_templateObject9$3 ||
|
|
|
4618
4692
|
return '';
|
|
4619
4693
|
});
|
|
4620
4694
|
|
|
4621
|
-
var _templateObject$
|
|
4622
|
-
var ProgressView = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4623
|
-
var ElapsedProgressView = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4695
|
+
var _templateObject$E, _templateObject2$n, _templateObject3$h;
|
|
4696
|
+
var ProgressView = /*#__PURE__*/styled__default.div(_templateObject$E || (_templateObject$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n"])));
|
|
4697
|
+
var ElapsedProgressView = /*#__PURE__*/styled__default.div(_templateObject2$n || (_templateObject2$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-progress);\n flex: ", ";\n"])), function (_ref) {
|
|
4624
4698
|
var progress = _ref.progress;
|
|
4625
4699
|
return progress;
|
|
4626
4700
|
});
|
|
4627
|
-
var PendingProgressView = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4701
|
+
var PendingProgressView = /*#__PURE__*/styled__default.div(_templateObject3$h || (_templateObject3$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-white);\n opacity: 0.5;\n flex: ", ";\n"])), function (_ref2) {
|
|
4628
4702
|
var progress = _ref2.progress;
|
|
4629
4703
|
return progress;
|
|
4630
4704
|
});
|
|
@@ -4641,7 +4715,7 @@ var Progress = function Progress(_ref) {
|
|
|
4641
4715
|
}));
|
|
4642
4716
|
};
|
|
4643
4717
|
|
|
4644
|
-
var _excluded$
|
|
4718
|
+
var _excluded$c = ["text"],
|
|
4645
4719
|
_excluded2$1 = ["text"];
|
|
4646
4720
|
var LENGTH_LARGE_TEXT$1 = 28;
|
|
4647
4721
|
var LENGTH_SMALL_TEXT$1 = 19;
|
|
@@ -4680,7 +4754,7 @@ var Card = function Card(_ref) {
|
|
|
4680
4754
|
var _ref2 = primaryButton || {},
|
|
4681
4755
|
_ref2$text = _ref2.text,
|
|
4682
4756
|
primaryButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
4683
|
-
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
4757
|
+
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$c);
|
|
4684
4758
|
|
|
4685
4759
|
var primaryButtonTextTruncate = size === 'small' ? truncate(primaryButtonText, LENGTH_SMALL_TEXT$1) : truncate(primaryButtonText, LENGTH_LARGE_TEXT$1);
|
|
4686
4760
|
var tertiaryButton = links == null ? void 0 : links[1];
|
|
@@ -4750,9 +4824,9 @@ var Card = function Card(_ref) {
|
|
|
4750
4824
|
}, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? /*#__PURE__*/React__default.createElement(Button$1, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate) : null) : null));
|
|
4751
4825
|
};
|
|
4752
4826
|
|
|
4753
|
-
var _templateObject$
|
|
4754
|
-
var CardsContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
4755
|
-
var GridItemContainer = /*#__PURE__*/styled__default(GridItem)(_templateObject2$
|
|
4827
|
+
var _templateObject$F, _templateObject2$o;
|
|
4828
|
+
var CardsContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n @media ", " {\n {\n grid-row-gap: var(--cards-spacing-stack);\n }\n }\n"])), devices.mobile);
|
|
4829
|
+
var GridItemContainer = /*#__PURE__*/styled__default(GridItem)(_templateObject2$o || (_templateObject2$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n {\n grid-column: 1 / span 14;\n }\n }\n"])), devices.mobile);
|
|
4756
4830
|
|
|
4757
4831
|
var Cards = function Cards(_ref) {
|
|
4758
4832
|
var cards = _ref.cards,
|
|
@@ -4789,21 +4863,21 @@ var Cards = function Cards(_ref) {
|
|
|
4789
4863
|
}));
|
|
4790
4864
|
};
|
|
4791
4865
|
|
|
4792
|
-
var _templateObject$
|
|
4793
|
-
var EditorialGrid = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4866
|
+
var _templateObject$G, _templateObject2$p, _templateObject3$i, _templateObject4$d, _templateObject5$9;
|
|
4867
|
+
var EditorialGrid = /*#__PURE__*/styled__default.div(_templateObject$G || (_templateObject$G = /*#__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) {
|
|
4794
4868
|
var imageToLeft = _ref.imageToLeft;
|
|
4795
4869
|
return imageToLeft ? "'left left left left left . right right right right right right'" : "'left left left left left left . right right right right right'";
|
|
4796
4870
|
}, devices.mobile);
|
|
4797
|
-
var EditorialImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
4871
|
+
var EditorialImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$p || (_templateObject2$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n @media ", " {\n & {\n grid-area: row1;\n }\n"])), function (_ref2) {
|
|
4798
4872
|
var imageToLeft = _ref2.imageToLeft;
|
|
4799
4873
|
return imageToLeft ? 'left' : 'right';
|
|
4800
4874
|
}, devices.mobile);
|
|
4801
|
-
var EditorialTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4875
|
+
var EditorialTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$i || (_templateObject3$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n"])), function (_ref3) {
|
|
4802
4876
|
var imageToLeft = _ref3.imageToLeft;
|
|
4803
4877
|
return imageToLeft ? 'right' : 'left';
|
|
4804
4878
|
}, devices.mobile);
|
|
4805
|
-
var EditorialSubtitle = /*#__PURE__*/styled__default.span(_templateObject4$
|
|
4806
|
-
var EditorialText = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
4879
|
+
var EditorialSubtitle = /*#__PURE__*/styled__default.span(_templateObject4$d || (_templateObject4$d = /*#__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"])));
|
|
4880
|
+
var EditorialText = /*#__PURE__*/styled__default.div(_templateObject5$9 || (_templateObject5$9 = /*#__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"])));
|
|
4807
4881
|
|
|
4808
4882
|
var Editorial = function Editorial(_ref) {
|
|
4809
4883
|
var _ref$imagePosition = _ref.imagePosition,
|
|
@@ -4834,19 +4908,19 @@ var Editorial = function Editorial(_ref) {
|
|
|
4834
4908
|
})))));
|
|
4835
4909
|
};
|
|
4836
4910
|
|
|
4837
|
-
var _templateObject$
|
|
4838
|
-
var PageHeadingWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4911
|
+
var _templateObject$H, _templateObject2$q, _templateObject3$j, _templateObject4$e, _templateObject5$a, _templateObject6$8, _templateObject7$5;
|
|
4912
|
+
var PageHeadingWrapper = /*#__PURE__*/styled__default.div(_templateObject$H || (_templateObject$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n h2 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
4839
4913
|
var theme = _ref.theme;
|
|
4840
4914
|
return theme.colors.primary;
|
|
4841
4915
|
}, devices.mobile);
|
|
4842
|
-
var PageHeadingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
4843
|
-
var TitleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4844
|
-
var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
4845
|
-
var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
4846
|
-
var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
4916
|
+
var PageHeadingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$q || (_templateObject2$q = /*#__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);
|
|
4917
|
+
var TitleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: title;\n margin-top: 80px;\n\n @media ", " {\n & {\n margin-top: 0;\n }\n }\n"])), devices.mobile);
|
|
4918
|
+
var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 20px;\n width: fit-content;\n height: 36px;\n\n @media ", " {\n & {\n height: 30px;\n }\n }\n"])), devices.mobile);
|
|
4919
|
+
var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject5$a || (_templateObject5$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n align-self: end;\n margin-top: 12px;\n h6 {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
4920
|
+
var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$8 || (_templateObject6$8 = /*#__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);
|
|
4847
4921
|
var ButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject7$5 || (_templateObject7$5 = /*#__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);
|
|
4848
4922
|
|
|
4849
|
-
var _excluded$
|
|
4923
|
+
var _excluded$d = ["text"];
|
|
4850
4924
|
|
|
4851
4925
|
var PageHeading = function PageHeading(_ref) {
|
|
4852
4926
|
var title = _ref.title,
|
|
@@ -4858,7 +4932,7 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
4858
4932
|
|
|
4859
4933
|
var _ref2 = link || {},
|
|
4860
4934
|
linkText = _ref2.text,
|
|
4861
|
-
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
4935
|
+
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$d);
|
|
4862
4936
|
|
|
4863
4937
|
var truncatedText = text == null ? void 0 : text.substring(0, 250);
|
|
4864
4938
|
var truncatedTitle = title.substring(0, 40);
|
|
@@ -4870,18 +4944,20 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
4870
4944
|
level: 2
|
|
4871
4945
|
}, truncatedTitle)), text ? /*#__PURE__*/React__default.createElement(TextWrapper, {
|
|
4872
4946
|
"data-testid": "page-heading-text"
|
|
4873
|
-
},
|
|
4947
|
+
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
4948
|
+
level: 6
|
|
4949
|
+
}, truncatedText)) : null, sponsor ? /*#__PURE__*/React__default.createElement(LogoWrapper$1, {
|
|
4874
4950
|
"data-testid": "page-heading-sponsor"
|
|
4875
4951
|
}, /*#__PURE__*/React__default.createElement(Sponsorship, null)) : null, link ? /*#__PURE__*/React__default.createElement(ButtonWrapper$1, {
|
|
4876
4952
|
"data-testid": "page-heading-link"
|
|
4877
4953
|
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restLink), linkText)) : null));
|
|
4878
4954
|
};
|
|
4879
4955
|
|
|
4880
|
-
var _excluded$
|
|
4956
|
+
var _excluded$e = ["link"];
|
|
4881
4957
|
|
|
4882
4958
|
var PageHeadingCore = function PageHeadingCore(_ref) {
|
|
4883
4959
|
var link = _ref.link,
|
|
4884
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
4960
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$e);
|
|
4885
4961
|
|
|
4886
4962
|
var coreLink = link && _extends({}, link, {
|
|
4887
4963
|
color: exports.Colors.White,
|
|
@@ -4895,11 +4971,11 @@ var PageHeadingCore = function PageHeadingCore(_ref) {
|
|
|
4895
4971
|
})));
|
|
4896
4972
|
};
|
|
4897
4973
|
|
|
4898
|
-
var _excluded$
|
|
4974
|
+
var _excluded$f = ["link"];
|
|
4899
4975
|
|
|
4900
4976
|
var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
4901
4977
|
var link = _ref.link,
|
|
4902
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
4978
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$f);
|
|
4903
4979
|
|
|
4904
4980
|
var cinemaLink = link && _extends({}, link, {
|
|
4905
4981
|
color: exports.Colors.Black,
|
|
@@ -4913,8 +4989,8 @@ var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
|
4913
4989
|
}), /*#__PURE__*/React__default.createElement(CinemaBadge, null)));
|
|
4914
4990
|
};
|
|
4915
4991
|
|
|
4916
|
-
var _templateObject$
|
|
4917
|
-
var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
4992
|
+
var _templateObject$I, _templateObject2$r, _templateObject3$k, _templateObject4$f, _templateObject5$b, _templateObject6$9, _templateObject7$6;
|
|
4993
|
+
var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n background-image: url('", "');\n background-repeat: no-repeat;\n background-size: cover;\n position: relative;\n display: flex;\n align-items: center;\n\n ::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: var(--base-color-black);\n filter: opacity(40%);\n z-index: ", ";\n }\n\n @media ", " {\n & {\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n background-image: url('", "');\n background-position: center;\n display: flex;\n align-items: start;\n }\n }\n"])), function (_ref) {
|
|
4918
4994
|
var bgUrlDesktop = _ref.bgUrlDesktop;
|
|
4919
4995
|
return bgUrlDesktop;
|
|
4920
4996
|
}, zIndexes.content, devices.mobile, function (_ref2) {
|
|
@@ -4922,14 +4998,14 @@ var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$G || (_temp
|
|
|
4922
4998
|
bgUrlDevice = _ref2.bgUrlDevice;
|
|
4923
4999
|
return bgUrlDevice ? bgUrlDevice : bgUrlDesktop;
|
|
4924
5000
|
});
|
|
4925
|
-
var ImpactGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
4926
|
-
var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
4927
|
-
var LogoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
4928
|
-
var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$
|
|
4929
|
-
var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
5001
|
+
var ImpactGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$r || (_templateObject2$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\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 . . . . . .'\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 . . . .'\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 & {\n grid-template-areas:\n '. . . . . 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 . .';\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
5002
|
+
var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject3$k || (_templateObject3$k = /*#__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.contentOverlay, devices.mobileAndTablet);
|
|
5003
|
+
var LogoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
|
|
5004
|
+
var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$b || (_templateObject5$b = /*#__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(3 * var(--line-height-header-3));\n }\n }\n\n @media ", " {\n & {\n margin-top: 12px;\n max-height: calc(3 * var(--line-height-header-3));\n }\n\n h3 {\n font-size: var(--font-size-header-5);\n letter-spacing: var(--letter-spacing-header-5);\n line-height: var(--line-height-header-5);\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
5005
|
+
var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$9 || (_templateObject6$9 = /*#__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: 0;\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
4930
5006
|
var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject7$6 || (_templateObject7$6 = /*#__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 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);
|
|
4931
5007
|
|
|
4932
|
-
var _excluded$
|
|
5008
|
+
var _excluded$g = ["text"];
|
|
4933
5009
|
|
|
4934
5010
|
var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
4935
5011
|
var children = _ref.children,
|
|
@@ -4944,7 +5020,7 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
4944
5020
|
|
|
4945
5021
|
var _ref2 = link || {},
|
|
4946
5022
|
linkText = _ref2.text,
|
|
4947
|
-
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
5023
|
+
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$g);
|
|
4948
5024
|
|
|
4949
5025
|
return /*#__PURE__*/React__default.createElement(ImpactWrapper, {
|
|
4950
5026
|
bgUrlDesktop: bgUrlDesktop,
|
|
@@ -4971,11 +5047,11 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
4971
5047
|
}, "Scroll Down")) : null);
|
|
4972
5048
|
};
|
|
4973
5049
|
|
|
4974
|
-
var _excluded$
|
|
5050
|
+
var _excluded$h = ["link"];
|
|
4975
5051
|
|
|
4976
5052
|
var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
4977
5053
|
var link = _ref.link,
|
|
4978
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
5054
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$h);
|
|
4979
5055
|
|
|
4980
5056
|
var streamLink = link && _extends({}, link, {
|
|
4981
5057
|
color: exports.Colors.Black,
|
|
@@ -4989,67 +5065,72 @@ var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
|
4989
5065
|
}), /*#__PURE__*/React__default.createElement(StreamBadge, null)));
|
|
4990
5066
|
};
|
|
4991
5067
|
|
|
4992
|
-
var _templateObject$
|
|
4993
|
-
var
|
|
4994
|
-
var
|
|
4995
|
-
|
|
4996
|
-
|
|
4997
|
-
|
|
4998
|
-
|
|
4999
|
-
|
|
5000
|
-
|
|
5001
|
-
|
|
5002
|
-
|
|
5003
|
-
|
|
5004
|
-
|
|
5005
|
-
|
|
5006
|
-
href: link
|
|
5007
|
-
|
|
5008
|
-
}, name) : name));
|
|
5068
|
+
var _templateObject$J, _templateObject2$s, _templateObject3$l;
|
|
5069
|
+
var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n"])));
|
|
5070
|
+
var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$s || (_templateObject2$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n"])));
|
|
5071
|
+
var PersonLink = /*#__PURE__*/styled__default.a(_templateObject3$l || (_templateObject3$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\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"])));
|
|
5072
|
+
|
|
5073
|
+
var Person = function Person(_ref) {
|
|
5074
|
+
var person = _ref.person,
|
|
5075
|
+
withSeparator = _ref.withSeparator;
|
|
5076
|
+
var link = person.link,
|
|
5077
|
+
name = person.name,
|
|
5078
|
+
_person$separator = person.separator,
|
|
5079
|
+
separator = _person$separator === void 0 ? ', ' : _person$separator;
|
|
5080
|
+
var personSeparator = withSeparator ? separator : '';
|
|
5081
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, link ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(PersonLink, {
|
|
5082
|
+
href: link
|
|
5083
|
+
}, name), personSeparator ? /*#__PURE__*/React__default.createElement("span", null, separator) : null) : /*#__PURE__*/React__default.createElement("span", null, name, personSeparator));
|
|
5009
5084
|
};
|
|
5010
5085
|
|
|
5011
|
-
var _templateObject$I;
|
|
5012
|
-
var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n"])));
|
|
5013
|
-
|
|
5014
5086
|
var PeopleListing = function PeopleListing(_ref) {
|
|
5015
|
-
var
|
|
5016
|
-
return /*#__PURE__*/React__default.createElement(PeopleListingGrid, null,
|
|
5087
|
+
var roles = _ref.roles;
|
|
5088
|
+
return /*#__PURE__*/React__default.createElement(PeopleListingGrid, null, roles.map(function (role, index) {
|
|
5017
5089
|
return /*#__PURE__*/React__default.createElement(GridItem, {
|
|
5018
|
-
key:
|
|
5090
|
+
key: role.name + "-" + index,
|
|
5019
5091
|
columnStartDesktop: index % 4 * 3 + 3,
|
|
5020
5092
|
columnSpanDesktop: 3,
|
|
5021
5093
|
columnStartDevice: index % 2 * 6 + 2,
|
|
5022
5094
|
columnSpanDevice: 6
|
|
5023
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
5024
|
-
|
|
5025
|
-
|
|
5026
|
-
|
|
5027
|
-
|
|
5028
|
-
}))
|
|
5095
|
+
}, /*#__PURE__*/React__default.createElement(RoleWrapper, {
|
|
5096
|
+
title: "role",
|
|
5097
|
+
"data-roh": role.dataROH
|
|
5098
|
+
}, /*#__PURE__*/React__default.createElement(Overline, {
|
|
5099
|
+
level: 1
|
|
5100
|
+
}, role.name)), /*#__PURE__*/React__default.createElement(BodyText, {
|
|
5101
|
+
level: 1,
|
|
5102
|
+
tag: "p"
|
|
5103
|
+
}, role.people.map(function (person, personIndex) {
|
|
5104
|
+
return /*#__PURE__*/React__default.createElement(Person, {
|
|
5105
|
+
key: "" + person.name + personIndex,
|
|
5106
|
+
person: person,
|
|
5107
|
+
withSeparator: role.people.length !== personIndex + 1
|
|
5108
|
+
});
|
|
5109
|
+
})));
|
|
5029
5110
|
}));
|
|
5030
5111
|
};
|
|
5031
5112
|
|
|
5032
|
-
var _templateObject$
|
|
5113
|
+
var _templateObject$K, _templateObject2$t, _templateObject3$m, _templateObject4$g, _templateObject5$c, _templateObject6$a, _templateObject7$7;
|
|
5033
5114
|
var LENGTH_TEXT = 28;
|
|
5034
5115
|
var LENGTH_TEXT_TABLET$1 = 10;
|
|
5035
|
-
var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$
|
|
5116
|
+
var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$K || (_templateObject$K = /*#__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) {
|
|
5036
5117
|
var imageToLeft = _ref.imageToLeft;
|
|
5037
5118
|
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'";
|
|
5038
5119
|
}, devices.tablet, function (_ref2) {
|
|
5039
5120
|
var imageToLeft = _ref2.imageToLeft;
|
|
5040
5121
|
return imageToLeft ? "'left left left left left left left . right right right right right .'" : "'. left left left left left . right right right right right right right'";
|
|
5041
5122
|
}, devices.mobile);
|
|
5042
|
-
var PromoWithTitleImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
5123
|
+
var PromoWithTitleImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$t || (_templateObject2$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n @media ", " {\n & {\n grid-area: row1;\n }\n"])), function (_ref3) {
|
|
5043
5124
|
var imageToLeft = _ref3.imageToLeft;
|
|
5044
5125
|
return imageToLeft ? 'left' : 'right';
|
|
5045
5126
|
}, devices.mobile);
|
|
5046
|
-
var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
5127
|
+
var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObject3$m || (_templateObject3$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n"])), function (_ref4) {
|
|
5047
5128
|
var imageToLeft = _ref4.imageToLeft;
|
|
5048
5129
|
return imageToLeft ? 'right' : 'left';
|
|
5049
5130
|
}, devices.mobile);
|
|
5050
|
-
var PromoWithTitleContainer = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
5051
|
-
var PromoWithTitleSubtitle = /*#__PURE__*/styled__default.span(_templateObject5$
|
|
5052
|
-
var PromoWithTitleText = /*#__PURE__*/styled__default.div(_templateObject6$
|
|
5131
|
+
var PromoWithTitleContainer = /*#__PURE__*/styled__default.div(_templateObject4$g || (_templateObject4$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0 32px 0;\n\n h2,\n h3 {\n margin: 0;\n }\n\n @media ", " {\n & {\n margin: 0 0 24px 0;\n }\n }\n"])), devices.mobile);
|
|
5132
|
+
var PromoWithTitleSubtitle = /*#__PURE__*/styled__default.span(_templateObject5$c || (_templateObject5$c = /*#__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"])));
|
|
5133
|
+
var PromoWithTitleText = /*#__PURE__*/styled__default.div(_templateObject6$a || (_templateObject6$a = /*#__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\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) {
|
|
5053
5134
|
var theme = _ref5.theme;
|
|
5054
5135
|
return theme.colors.black;
|
|
5055
5136
|
}, function (_ref6) {
|
|
@@ -5085,7 +5166,7 @@ var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject7$7 ||
|
|
|
5085
5166
|
return '';
|
|
5086
5167
|
});
|
|
5087
5168
|
|
|
5088
|
-
var _excluded$
|
|
5169
|
+
var _excluded$i = ["text"],
|
|
5089
5170
|
_excluded2$2 = ["text"];
|
|
5090
5171
|
var LENGTH_TEXT$1 = 28;
|
|
5091
5172
|
|
|
@@ -5112,7 +5193,7 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
5112
5193
|
var _ref2 = primaryButton || {},
|
|
5113
5194
|
_ref2$text = _ref2.text,
|
|
5114
5195
|
primaryButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
5115
|
-
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
5196
|
+
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$i);
|
|
5116
5197
|
|
|
5117
5198
|
var primaryButtonTextTruncate = truncate(primaryButtonText, LENGTH_TEXT$1);
|
|
5118
5199
|
var tertiaryButton = links == null ? void 0 : links[1];
|
|
@@ -5146,8 +5227,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
5146
5227
|
}, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? /*#__PURE__*/React__default.createElement(Button$1, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate) : null) : null));
|
|
5147
5228
|
};
|
|
5148
5229
|
|
|
5149
|
-
var _templateObject$
|
|
5150
|
-
var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5230
|
+
var _templateObject$L;
|
|
5231
|
+
var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$L || (_templateObject$L = /*#__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);
|
|
5151
5232
|
|
|
5152
5233
|
var SectionTitle = function SectionTitle(_ref) {
|
|
5153
5234
|
var title = _ref.title,
|
|
@@ -5173,8 +5254,8 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
5173
5254
|
}, description))));
|
|
5174
5255
|
};
|
|
5175
5256
|
|
|
5176
|
-
var _templateObject$
|
|
5177
|
-
var TextContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5257
|
+
var _templateObject$M;
|
|
5258
|
+
var TextContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$M || (_templateObject$M = /*#__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 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 & ul {\n padding: 0;\n list-style: none;\n margin-left: 20px;\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n width: 0px;\n margin-left: 20px;\n }\n\n & li {\n text-indent: -20px;\n line-height: var(--line-height-listing);\n }\n"])));
|
|
5178
5259
|
|
|
5179
5260
|
var TextOnly = function TextOnly(_ref) {
|
|
5180
5261
|
var _ref$text = _ref.text,
|
|
@@ -5199,8 +5280,8 @@ var TextOnly = function TextOnly(_ref) {
|
|
|
5199
5280
|
})));
|
|
5200
5281
|
};
|
|
5201
5282
|
|
|
5202
|
-
var _templateObject$
|
|
5203
|
-
var Wrapper$2 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
5283
|
+
var _templateObject$N, _templateObject2$u;
|
|
5284
|
+
var Wrapper$2 = /*#__PURE__*/styled__default.div(_templateObject$N || (_templateObject$N = /*#__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) {
|
|
5204
5285
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
5205
5286
|
aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
|
|
5206
5287
|
return aspectRatio;
|
|
@@ -5210,7 +5291,7 @@ var Wrapper$2 = /*#__PURE__*/styled__default.div(_templateObject$M || (_template
|
|
|
5210
5291
|
height = _ref2.height;
|
|
5211
5292
|
return "calc(calc(" + height + "px - 12px - var(--line-height-body-2)) * " + AspectRatioWidth[aspectRatio] + ")";
|
|
5212
5293
|
});
|
|
5213
|
-
var CaptionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
5294
|
+
var CaptionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$u || (_templateObject2$u = /*#__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"])));
|
|
5214
5295
|
|
|
5215
5296
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
5216
5297
|
var caption = _ref.caption,
|
|
@@ -5248,8 +5329,8 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
5248
5329
|
}, children), /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
5249
5330
|
};
|
|
5250
5331
|
|
|
5251
|
-
var _templateObject$
|
|
5252
|
-
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$N || (_templateObject$N = /*#__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\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\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-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\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
5332
|
+
var _templateObject$O;
|
|
5333
|
+
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$O || (_templateObject$O = /*#__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\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\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-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\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
5253
5334
|
var theme = _ref.theme;
|
|
5254
5335
|
return theme.colors.primary;
|
|
5255
5336
|
}, function (_ref2) {
|
|
@@ -6172,11 +6253,15 @@ exports.SectionTitle = SectionTitle;
|
|
|
6172
6253
|
exports.Sponsorship = Sponsorship;
|
|
6173
6254
|
exports.StreamBadge = StreamBadge;
|
|
6174
6255
|
exports.Subtitle = Subtitle;
|
|
6256
|
+
exports.Tab = Tab;
|
|
6175
6257
|
exports.TabLink = TabLink;
|
|
6176
6258
|
exports.Tabs = Tabs;
|
|
6177
6259
|
exports.TertiaryButton = Button$1;
|
|
6260
|
+
exports.TextLink = TextLink;
|
|
6178
6261
|
exports.TextOnly = TextOnly;
|
|
6179
6262
|
exports.ThemeProvider = Theme;
|
|
6263
|
+
exports.Tickbox = Tickbox;
|
|
6264
|
+
exports.TitleWithCTA = TitleWithCTA;
|
|
6180
6265
|
exports.TypeTags = TypeTags;
|
|
6181
6266
|
exports.devices = devices;
|
|
6182
6267
|
//# sourceMappingURL=chord.cjs.development.js.map
|