@royaloperahouse/chord 0.5.6 → 0.5.10
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 +15 -0
- package/dist/chord.cjs.development.js +160 -64
- 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 +160 -64
- package/dist/chord.esm.js.map +1 -1
- package/dist/components/atoms/Icons/SvgIcons/Utility/Star.svg.d.ts +4 -0
- package/dist/components/atoms/Icons/SvgIcons/index.d.ts +1 -0
- package/dist/components/molecules/ImageWithCaption/ImageWithCaption.style.d.ts +2 -1
- package/dist/components/organisms/Navigation/Navigation.style.d.ts +1 -0
- package/dist/types/image.d.ts +23 -0
- package/package.json +1 -1
package/dist/chord.esm.js
CHANGED
|
@@ -461,7 +461,7 @@ var common = {
|
|
|
461
461
|
gap: '12px'
|
|
462
462
|
},
|
|
463
463
|
tablet: {
|
|
464
|
-
margin: '
|
|
464
|
+
margin: '32px',
|
|
465
465
|
outerMargin: '0',
|
|
466
466
|
gap: '20px'
|
|
467
467
|
},
|
|
@@ -1628,6 +1628,21 @@ var Refresh = (function (_ref) {
|
|
|
1628
1628
|
}));
|
|
1629
1629
|
});
|
|
1630
1630
|
|
|
1631
|
+
var Star = (function (_ref) {
|
|
1632
|
+
var _ref$color = _ref.color,
|
|
1633
|
+
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color;
|
|
1634
|
+
return /*#__PURE__*/createElement("svg", {
|
|
1635
|
+
width: "100%",
|
|
1636
|
+
height: "100%",
|
|
1637
|
+
viewBox: "0 0 48 46",
|
|
1638
|
+
fill: "none",
|
|
1639
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
1640
|
+
}, /*#__PURE__*/createElement("path", {
|
|
1641
|
+
d: "M24 0L30.0248 16.7076L47.7764 17.2746L33.7483 28.1674L38.6946 45.2254L24 35.25L9.30537 45.2254L14.2517 28.1674L0.223587 17.2746L17.9752 16.7076L24 0Z",
|
|
1642
|
+
fill: color
|
|
1643
|
+
}));
|
|
1644
|
+
});
|
|
1645
|
+
|
|
1631
1646
|
var AudioDescription = (function (_ref) {
|
|
1632
1647
|
var _ref$color = _ref.color,
|
|
1633
1648
|
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color;
|
|
@@ -1960,6 +1975,7 @@ var IconLibrary = {
|
|
|
1960
1975
|
Settings: Settings,
|
|
1961
1976
|
Shift: Shift,
|
|
1962
1977
|
Space: Space,
|
|
1978
|
+
Star: Star,
|
|
1963
1979
|
Subscribe: Subscribe,
|
|
1964
1980
|
Subtitles: Subtitles,
|
|
1965
1981
|
Tick: Tick,
|
|
@@ -2461,11 +2477,41 @@ var AspectRatio;
|
|
|
2461
2477
|
AspectRatio["16:9"] = "16 / 9";
|
|
2462
2478
|
})(AspectRatio || (AspectRatio = {}));
|
|
2463
2479
|
|
|
2480
|
+
var AspectRatioLegacy;
|
|
2481
|
+
|
|
2482
|
+
(function (AspectRatioLegacy) {
|
|
2483
|
+
AspectRatioLegacy["1 / 1"] = "100";
|
|
2484
|
+
AspectRatioLegacy["3 / 4"] = "133";
|
|
2485
|
+
AspectRatioLegacy["4 / 3"] = "75";
|
|
2486
|
+
AspectRatioLegacy["16 / 9"] = "56.25";
|
|
2487
|
+
})(AspectRatioLegacy || (AspectRatioLegacy = {}));
|
|
2488
|
+
|
|
2489
|
+
var AspectRatioWidth;
|
|
2490
|
+
|
|
2491
|
+
(function (AspectRatioWidth) {
|
|
2492
|
+
AspectRatioWidth["1 / 1"] = "1";
|
|
2493
|
+
AspectRatioWidth["3 / 4"] = "0.75";
|
|
2494
|
+
AspectRatioWidth["4 / 3"] = "1.33";
|
|
2495
|
+
AspectRatioWidth["16 / 9"] = "1.78";
|
|
2496
|
+
})(AspectRatioWidth || (AspectRatioWidth = {}));
|
|
2497
|
+
|
|
2464
2498
|
var _templateObject$d;
|
|
2465
|
-
var ImageAspectRatioWrapper = /*#__PURE__*/styled.div(_templateObject$d || (_templateObject$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: ", ";\n\n img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n"])), function (_ref) {
|
|
2499
|
+
var ImageAspectRatioWrapper = /*#__PURE__*/styled.div(_templateObject$d || (_templateObject$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n position: relative;\n width: 100%;\n padding-top: ", "%;\n }\n\n img {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n\n @supports not (aspect-ratio: ", ") {\n position: absolute;\n top: 0;\n left: 0;\n }\n }\n"])), function (_ref) {
|
|
2466
2500
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
2467
2501
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
2468
2502
|
return aspectRatio;
|
|
2503
|
+
}, function (_ref2) {
|
|
2504
|
+
var _ref2$aspectRatio = _ref2.aspectRatio,
|
|
2505
|
+
aspectRatio = _ref2$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref2$aspectRatio;
|
|
2506
|
+
return aspectRatio;
|
|
2507
|
+
}, function (_ref3) {
|
|
2508
|
+
var _ref3$aspectRatio = _ref3.aspectRatio,
|
|
2509
|
+
aspectRatio = _ref3$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref3$aspectRatio;
|
|
2510
|
+
return AspectRatioLegacy[aspectRatio];
|
|
2511
|
+
}, function (_ref4) {
|
|
2512
|
+
var _ref4$aspectRatio = _ref4.aspectRatio,
|
|
2513
|
+
aspectRatio = _ref4$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref4$aspectRatio;
|
|
2514
|
+
return aspectRatio;
|
|
2469
2515
|
});
|
|
2470
2516
|
|
|
2471
2517
|
var _templateObject$e, _templateObject2$2;
|
|
@@ -2641,8 +2687,8 @@ var ButtonsContainer = /*#__PURE__*/styled.div(_templateObject$h || (_templateOb
|
|
|
2641
2687
|
var IconWrapper = /*#__PURE__*/styled.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) {
|
|
2642
2688
|
var theme = _ref.theme;
|
|
2643
2689
|
return theme.colors.primary;
|
|
2644
|
-
}, devices.
|
|
2645
|
-
var IconUnavailableWrapper = /*#__PURE__*/styled.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.
|
|
2690
|
+
}, devices.mobileAndTablet);
|
|
2691
|
+
var IconUnavailableWrapper = /*#__PURE__*/styled.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);
|
|
2646
2692
|
|
|
2647
2693
|
var RotatorButtons = function RotatorButtons(_ref) {
|
|
2648
2694
|
var onClickPrev = _ref.onClickPrev,
|
|
@@ -2819,7 +2865,7 @@ zLevels.forEach(function (name, index) {
|
|
|
2819
2865
|
zIndexes[name] = index;
|
|
2820
2866
|
});
|
|
2821
2867
|
|
|
2822
|
-
var _templateObject$j, _templateObject2$5, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
|
|
2868
|
+
var _templateObject$j, _templateObject2$5, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
|
|
2823
2869
|
var FullScreenContainer = /*#__PURE__*/styled.div(_templateObject$j || (_templateObject$j = /*#__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);
|
|
2824
2870
|
var NavigationGrid = /*#__PURE__*/styled(Grid)(_templateObject2$5 || (_templateObject2$5 = /*#__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);
|
|
2825
2871
|
var SearchBackground = /*#__PURE__*/styled.div(_templateObject3$1 || (_templateObject3$1 = /*#__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);
|
|
@@ -2828,7 +2874,8 @@ var NavigationGridMobile = /*#__PURE__*/styled(Grid)(_templateObject5 || (_templ
|
|
|
2828
2874
|
var LogoContainer = /*#__PURE__*/styled.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);
|
|
2829
2875
|
var MenuContainer = /*#__PURE__*/styled.div(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: center;\n height: 140px;\n\n @media ", " {\n flex-direction: row;\n height: 80px;\n justify-content: flex-end;\n }\n"])), devices.mobileAndTablet);
|
|
2830
2876
|
var NavContainer = /*#__PURE__*/styled.div(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 40px;\n margin-top: auto;\n\n @media ", " {\n background-color: var(--base-color-white);\n height: auto;\n margin-top: 0px;\n }\n"])), devices.mobileAndTablet);
|
|
2831
|
-
var
|
|
2877
|
+
var NavContainerGridItem = /*#__PURE__*/styled(GridItem)(_templateObject9 || (_templateObject9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 3 / span 14;\n }\n"])), devices.desktop);
|
|
2878
|
+
var NavTopContainer = /*#__PURE__*/styled.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);
|
|
2832
2879
|
|
|
2833
2880
|
var _templateObject$k;
|
|
2834
2881
|
var LogoWrapper = /*#__PURE__*/styled.div(_templateObject$k || (_templateObject$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 66px;\n height: auto;\n cursor: pointer;\n & img {\n width: auto;\n height: 100%;\n }\n"])));
|
|
@@ -3238,7 +3285,7 @@ var NavTop = function NavTop(_ref) {
|
|
|
3238
3285
|
|
|
3239
3286
|
var _templateObject$p, _templateObject2$9, _templateObject3$4, _templateObject4$2;
|
|
3240
3287
|
var TabsContainer = /*#__PURE__*/styled.div(_templateObject$p || (_templateObject$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n"])));
|
|
3241
|
-
var ItemsContainer = /*#__PURE__*/styled.div(_templateObject2$9 || (_templateObject2$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n column-gap: 32px;\n\n @media ", " {\n ", "\n }\n"])), devices.mobileAndTablet, function (props) {
|
|
3288
|
+
var ItemsContainer = /*#__PURE__*/styled.div(_templateObject2$9 || (_templateObject2$9 = /*#__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) {
|
|
3242
3289
|
if (props.showMenu) {
|
|
3243
3290
|
return "\n display: flex;\n flex-direction: column;\n row-gap: 32px;\n ";
|
|
3244
3291
|
}
|
|
@@ -3728,7 +3775,7 @@ var Navigation = function Navigation(_ref) {
|
|
|
3728
3775
|
urlLink: logoLink,
|
|
3729
3776
|
desktopImage: desktopLogoUrl,
|
|
3730
3777
|
devicesImage: devicesLogoUrl
|
|
3731
|
-
}))), /*#__PURE__*/React__default.createElement(
|
|
3778
|
+
}))), /*#__PURE__*/React__default.createElement(NavContainerGridItem, {
|
|
3732
3779
|
columnStartDesktop: 3,
|
|
3733
3780
|
columnSpanDesktop: 12,
|
|
3734
3781
|
columnStartDevice: 4,
|
|
@@ -3870,7 +3917,7 @@ var Footer = function Footer(_ref) {
|
|
|
3870
3917
|
}, additionalInfo)))));
|
|
3871
3918
|
};
|
|
3872
3919
|
|
|
3873
|
-
var _templateObject$w, _templateObject2$g, _templateObject3$a, _templateObject4$7, _templateObject5$4, _templateObject6$4, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10, _templateObject11;
|
|
3920
|
+
var _templateObject$w, _templateObject2$g, _templateObject3$a, _templateObject4$7, _templateObject5$4, _templateObject6$4, _templateObject7$2, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11;
|
|
3874
3921
|
var AnchorTapbarWrapper = /*#__PURE__*/styled.div(_templateObject$w || (_templateObject$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n top: 0;\n background-color: var(--base-color-white);\n z-index: ", ";\n"])), zIndexes.anchor);
|
|
3875
3922
|
var TitleCTAGrid = /*#__PURE__*/styled(Grid)(_templateObject2$g || (_templateObject2$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: solid 2px var(--base-color-lightgrey);\n"])));
|
|
3876
3923
|
var AnchorTitle = /*#__PURE__*/styled.div(_templateObject3$a || (_templateObject3$a = /*#__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);
|
|
@@ -3889,7 +3936,7 @@ var TabsList = /*#__PURE__*/styled.ul(_templateObject7$2 || (_templateObject7$2
|
|
|
3889
3936
|
});
|
|
3890
3937
|
var ArrowsContainer = /*#__PURE__*/styled.div(_templateObject8$2 || (_templateObject8$2 = /*#__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"])));
|
|
3891
3938
|
var ArrowWrapper = /*#__PURE__*/styled.div(_templateObject9$1 || (_templateObject9$1 = /*#__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"])));
|
|
3892
|
-
var ButtonsMobileWrapper = /*#__PURE__*/styled.div(_templateObject10 || (_templateObject10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: block;\n }\n }\n"])), devices.mobile);
|
|
3939
|
+
var ButtonsMobileWrapper = /*#__PURE__*/styled.div(_templateObject10$1 || (_templateObject10$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n & {\n display: block;\n }\n }\n"])), devices.mobile);
|
|
3893
3940
|
var PrimaryButtonReverse = /*#__PURE__*/styled(PrimaryButton)(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n svg path {\n fill: ", ";\n }\n }\n"])), function (_ref4) {
|
|
3894
3941
|
var theme = _ref4.theme;
|
|
3895
3942
|
return theme.colors.primaryButtonReverseBg;
|
|
@@ -4157,7 +4204,7 @@ var Carousel = function Carousel(_ref) {
|
|
|
4157
4204
|
if (window.matchMedia(devices.mobile).matches) {
|
|
4158
4205
|
setSlidesOffsetBefore(20); // Mobile margin grid
|
|
4159
4206
|
} else if (window.matchMedia(devices.tablet).matches) {
|
|
4160
|
-
setSlidesOffsetBefore(
|
|
4207
|
+
setSlidesOffsetBefore(32); // Tablet margin grid
|
|
4161
4208
|
} else {
|
|
4162
4209
|
setSlidesOffsetBefore(Math.floor(window.innerWidth * 0.1) - 3); // 10% of width
|
|
4163
4210
|
}
|
|
@@ -4236,77 +4283,74 @@ var Carousel = function Carousel(_ref) {
|
|
|
4236
4283
|
})))));
|
|
4237
4284
|
};
|
|
4238
4285
|
|
|
4239
|
-
var _templateObject$y, _templateObject2$i, _templateObject3$c, _templateObject4$9, _templateObject5$5, _templateObject6$5, _templateObject7$3, _templateObject8$3, _templateObject9$2, _templateObject10$
|
|
4286
|
+
var _templateObject$y, _templateObject2$i, _templateObject3$c, _templateObject4$9, _templateObject5$5, _templateObject6$5, _templateObject7$3, _templateObject8$3, _templateObject9$2, _templateObject10$2;
|
|
4240
4287
|
var HighlightsGrid = /*#__PURE__*/styled(Grid)(_templateObject$y || (_templateObject$y = /*#__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);
|
|
4241
|
-
var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$i || (_templateObject2$i = /*#__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 /
|
|
4288
|
+
var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$i || (_templateObject2$i = /*#__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) {
|
|
4242
4289
|
var theme = _ref.theme;
|
|
4243
|
-
return theme.fonts.mobile.sizes.altHeaders[
|
|
4290
|
+
return theme.fonts.mobile.sizes.altHeaders[5];
|
|
4244
4291
|
}, function (_ref2) {
|
|
4245
4292
|
var theme = _ref2.theme;
|
|
4246
|
-
return theme.fonts.mobile.weights.altHeaders[
|
|
4293
|
+
return theme.fonts.mobile.weights.altHeaders[5];
|
|
4247
4294
|
}, function (_ref3) {
|
|
4248
4295
|
var theme = _ref3.theme;
|
|
4249
|
-
return theme.fonts.mobile.letterSpacing.altHeaders[
|
|
4250
|
-
}, function (_ref4) {
|
|
4251
|
-
var theme = _ref4.theme;
|
|
4252
|
-
return theme.fonts.mobile.lineHeights.altHeaders[4];
|
|
4296
|
+
return theme.fonts.mobile.letterSpacing.altHeaders[5];
|
|
4253
4297
|
}, devices.mobile);
|
|
4254
|
-
var InfoWrapper = /*#__PURE__*/styled.div(_templateObject3$c || (_templateObject3$c = /*#__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 /
|
|
4255
|
-
var InfoLogoWrapper = /*#__PURE__*/styled.div(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n width: 132px;\n height: 36px;\n\n @media ", " {\n & {\n margin-bottom: 20px;\n width: 102px;\n height: 28px;\n }\n }\n"])), devices.mobile);
|
|
4256
|
-
var InfoTitleWrapper = /*#__PURE__*/styled.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 (
|
|
4257
|
-
var theme =
|
|
4298
|
+
var InfoWrapper = /*#__PURE__*/styled.div(_templateObject3$c || (_templateObject3$c = /*#__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
|
+
var InfoLogoWrapper = /*#__PURE__*/styled.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
|
+
var InfoTitleWrapper = /*#__PURE__*/styled.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
|
+
var theme = _ref4.theme;
|
|
4258
4302
|
return theme.fonts.mobile.sizes.headers[3];
|
|
4303
|
+
}, function (_ref5) {
|
|
4304
|
+
var theme = _ref5.theme;
|
|
4305
|
+
return theme.fonts.mobile.weights.headers[3];
|
|
4259
4306
|
}, function (_ref6) {
|
|
4260
4307
|
var theme = _ref6.theme;
|
|
4261
|
-
return theme.fonts.mobile.
|
|
4308
|
+
return theme.fonts.mobile.letterSpacing.headers[3];
|
|
4262
4309
|
}, function (_ref7) {
|
|
4263
4310
|
var theme = _ref7.theme;
|
|
4264
|
-
return theme.fonts.mobile.
|
|
4311
|
+
return theme.fonts.mobile.lineHeights.headers[3];
|
|
4265
4312
|
}, function (_ref8) {
|
|
4266
4313
|
var theme = _ref8.theme;
|
|
4267
|
-
return theme.fonts.mobile.
|
|
4314
|
+
return theme.fonts.mobile.sizes.subtitles[2];
|
|
4268
4315
|
}, function (_ref9) {
|
|
4269
4316
|
var theme = _ref9.theme;
|
|
4270
|
-
return theme.fonts.mobile.
|
|
4317
|
+
return theme.fonts.mobile.weights.subtitles[2];
|
|
4271
4318
|
}, function (_ref10) {
|
|
4272
4319
|
var theme = _ref10.theme;
|
|
4273
|
-
return theme.fonts.mobile.
|
|
4320
|
+
return theme.fonts.mobile.letterSpacing.subtitles[2];
|
|
4274
4321
|
}, function (_ref11) {
|
|
4275
4322
|
var theme = _ref11.theme;
|
|
4276
|
-
return theme.fonts.mobile.letterSpacing.subtitles[2];
|
|
4277
|
-
}, function (_ref12) {
|
|
4278
|
-
var theme = _ref12.theme;
|
|
4279
4323
|
return theme.fonts.mobile.lineHeights.subtitles[2];
|
|
4280
4324
|
});
|
|
4281
|
-
var InfoTextWrapper = /*#__PURE__*/styled.div(_templateObject6$5 || (_templateObject6$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n h6 {\n padding: 0;\n margin: 0 0 4px 0;\n }\n\n @media ", " {\n & {\n margin-top: 20px;\n\n h6 {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n\n > div {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n }\n }\n\n @media ", " {\n & {\n margin-top: 20px;\n h6 {\n margin: 0 0 8px 0;\n }\n }\n }\n"])), devices.tablet, function (
|
|
4282
|
-
var theme =
|
|
4325
|
+
var InfoTextWrapper = /*#__PURE__*/styled.div(_templateObject6$5 || (_templateObject6$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n h6 {\n padding: 0;\n margin: 0 0 4px 0;\n }\n\n @media ", " {\n & {\n margin-top: 20px;\n\n h6 {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n\n > div {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n }\n }\n\n @media ", " {\n & {\n margin-top: 20px;\n h6 {\n margin: 0 0 8px 0;\n }\n }\n }\n"])), devices.tablet, function (_ref12) {
|
|
4326
|
+
var theme = _ref12.theme;
|
|
4283
4327
|
return theme.fonts.mobile.sizes.subtitles[2];
|
|
4328
|
+
}, function (_ref13) {
|
|
4329
|
+
var theme = _ref13.theme;
|
|
4330
|
+
return theme.fonts.mobile.weights.subtitles[2];
|
|
4284
4331
|
}, function (_ref14) {
|
|
4285
4332
|
var theme = _ref14.theme;
|
|
4286
|
-
return theme.fonts.mobile.
|
|
4333
|
+
return theme.fonts.mobile.letterSpacing.subtitles[2];
|
|
4287
4334
|
}, function (_ref15) {
|
|
4288
4335
|
var theme = _ref15.theme;
|
|
4289
|
-
return theme.fonts.mobile.
|
|
4336
|
+
return theme.fonts.mobile.lineHeights.subtitles[2];
|
|
4290
4337
|
}, function (_ref16) {
|
|
4291
4338
|
var theme = _ref16.theme;
|
|
4292
|
-
return theme.fonts.mobile.
|
|
4339
|
+
return theme.fonts.mobile.sizes.body[1];
|
|
4293
4340
|
}, function (_ref17) {
|
|
4294
4341
|
var theme = _ref17.theme;
|
|
4295
|
-
return theme.fonts.mobile.
|
|
4342
|
+
return theme.fonts.mobile.weights.body[1];
|
|
4296
4343
|
}, function (_ref18) {
|
|
4297
4344
|
var theme = _ref18.theme;
|
|
4298
|
-
return theme.fonts.mobile.
|
|
4345
|
+
return theme.fonts.mobile.letterSpacing.body[1];
|
|
4299
4346
|
}, function (_ref19) {
|
|
4300
4347
|
var theme = _ref19.theme;
|
|
4301
|
-
return theme.fonts.mobile.letterSpacing.body[1];
|
|
4302
|
-
}, function (_ref20) {
|
|
4303
|
-
var theme = _ref20.theme;
|
|
4304
4348
|
return theme.fonts.mobile.lineHeights.body[1];
|
|
4305
4349
|
}, devices.mobile);
|
|
4306
|
-
var InfoLinkWrapper = /*#__PURE__*/styled.div(_templateObject7$3 || (_templateObject7$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n"])));
|
|
4307
|
-
var CarouselWrapper$1 = /*#__PURE__*/styled.div(_templateObject8$3 || (_templateObject8$3 = /*#__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:
|
|
4308
|
-
var RotatorButtonsWrapper = /*#__PURE__*/styled.div(_templateObject9$2 || (_templateObject9$2 = /*#__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.
|
|
4309
|
-
var RotatorButtonsWrapperMobile = /*#__PURE__*/styled.div(_templateObject10$
|
|
4350
|
+
var InfoLinkWrapper = /*#__PURE__*/styled.div(_templateObject7$3 || (_templateObject7$3 = /*#__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);
|
|
4351
|
+
var CarouselWrapper$1 = /*#__PURE__*/styled.div(_templateObject8$3 || (_templateObject8$3 = /*#__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);
|
|
4352
|
+
var RotatorButtonsWrapper = /*#__PURE__*/styled.div(_templateObject9$2 || (_templateObject9$2 = /*#__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);
|
|
4353
|
+
var RotatorButtonsWrapperMobile = /*#__PURE__*/styled.div(_templateObject10$2 || (_templateObject10$2 = /*#__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);
|
|
4310
4354
|
|
|
4311
4355
|
var _excluded$8 = ["text"];
|
|
4312
4356
|
|
|
@@ -4367,6 +4411,7 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
|
|
|
4367
4411
|
}
|
|
4368
4412
|
};
|
|
4369
4413
|
|
|
4414
|
+
var hasMultipleImages = images.length > 1;
|
|
4370
4415
|
return /*#__PURE__*/React__default.createElement(HighlightsGrid, {
|
|
4371
4416
|
onClick: function onClick(e) {
|
|
4372
4417
|
return e.stopPropagation();
|
|
@@ -4377,7 +4422,7 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
|
|
|
4377
4422
|
level: 4
|
|
4378
4423
|
}, carouselTitle), /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
4379
4424
|
level: 5
|
|
4380
|
-
}, carouselTitle)), /*#__PURE__*/React__default.createElement(RotatorButtonsWrapperMobile, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
4425
|
+
}, carouselTitle)), hasMultipleImages && /*#__PURE__*/React__default.createElement(RotatorButtonsWrapperMobile, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
4381
4426
|
onClickNext: onNext,
|
|
4382
4427
|
onClickPrev: onPrev
|
|
4383
4428
|
})), /*#__PURE__*/React__default.createElement(InfoWrapper, {
|
|
@@ -4394,14 +4439,14 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
|
|
|
4394
4439
|
level: 1
|
|
4395
4440
|
}, description)), /*#__PURE__*/React__default.createElement(InfoLinkWrapper, null, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restLink), linkText))), /*#__PURE__*/React__default.createElement(CarouselWrapper$1, {
|
|
4396
4441
|
"data-testid": "carousel-wrapper"
|
|
4397
|
-
}, /*#__PURE__*/React__default.createElement(RotatorButtonsWrapper, {
|
|
4442
|
+
}, hasMultipleImages && /*#__PURE__*/React__default.createElement(RotatorButtonsWrapper, {
|
|
4398
4443
|
"data-testid": "rotator-buttons"
|
|
4399
4444
|
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
4400
4445
|
onClickNext: onNext,
|
|
4401
4446
|
onClickPrev: onPrev
|
|
4402
4447
|
})), /*#__PURE__*/React__default.createElement(Swiper, {
|
|
4403
4448
|
slidesPerView: "auto",
|
|
4404
|
-
loop:
|
|
4449
|
+
loop: hasMultipleImages,
|
|
4405
4450
|
loopedSlides: images.length,
|
|
4406
4451
|
onSwiper: onSwiper
|
|
4407
4452
|
}, images.map(function (image) {
|
|
@@ -4869,7 +4914,7 @@ var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
|
4869
4914
|
};
|
|
4870
4915
|
|
|
4871
4916
|
var _templateObject$G, _templateObject2$p, _templateObject3$i, _templateObject4$e, _templateObject5$a, _templateObject6$8, _templateObject7$6;
|
|
4872
|
-
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\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 background-image: url('", "');\n background-position: center;\n display: flex;\n align-items: start;\n }\n }\n"])), function (_ref) {
|
|
4917
|
+
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$G || (_templateObject$G = /*#__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) {
|
|
4873
4918
|
var bgUrlDesktop = _ref.bgUrlDesktop;
|
|
4874
4919
|
return bgUrlDesktop;
|
|
4875
4920
|
}, zIndexes.content, devices.mobile, function (_ref2) {
|
|
@@ -4878,7 +4923,7 @@ var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$G || (_templateObjec
|
|
|
4878
4923
|
return bgUrlDevice ? bgUrlDevice : bgUrlDesktop;
|
|
4879
4924
|
});
|
|
4880
4925
|
var ImpactGrid = /*#__PURE__*/styled(Grid)(_templateObject2$p || (_templateObject2$p = /*#__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);
|
|
4881
|
-
var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject3$i || (_templateObject3$i = /*#__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.
|
|
4926
|
+
var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject3$i || (_templateObject3$i = /*#__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);
|
|
4882
4927
|
var LogoWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
|
|
4883
4928
|
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$a || (_templateObject5$a = /*#__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);
|
|
4884
4929
|
var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject6$8 || (_templateObject6$8 = /*#__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);
|
|
@@ -5004,12 +5049,21 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$j ||
|
|
|
5004
5049
|
}, devices.mobile);
|
|
5005
5050
|
var PromoWithTitleContainer = /*#__PURE__*/styled.div(_templateObject4$f || (_templateObject4$f = /*#__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);
|
|
5006
5051
|
var PromoWithTitleSubtitle = /*#__PURE__*/styled.span(_templateObject5$b || (_templateObject5$b = /*#__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"])));
|
|
5007
|
-
var PromoWithTitleText = /*#__PURE__*/styled.div(_templateObject6$9 || (_templateObject6$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"])))
|
|
5008
|
-
var
|
|
5009
|
-
|
|
5010
|
-
|
|
5011
|
-
|
|
5012
|
-
|
|
5052
|
+
var PromoWithTitleText = /*#__PURE__*/styled.div(_templateObject6$9 || (_templateObject6$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\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
|
+
var theme = _ref5.theme;
|
|
5054
|
+
return theme.colors.black;
|
|
5055
|
+
}, function (_ref6) {
|
|
5056
|
+
var theme = _ref6.theme;
|
|
5057
|
+
return theme.colors.darkgrey;
|
|
5058
|
+
}, function (_ref7) {
|
|
5059
|
+
var theme = _ref7.theme;
|
|
5060
|
+
return theme.colors.primary;
|
|
5061
|
+
});
|
|
5062
|
+
var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 32px;\n\n ", "\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref8) {
|
|
5063
|
+
var _ref8$primaryButtonTe = _ref8.primaryButtonTextLength,
|
|
5064
|
+
primaryButtonTextLength = _ref8$primaryButtonTe === void 0 ? 0 : _ref8$primaryButtonTe,
|
|
5065
|
+
_ref8$tertiaryButtonT = _ref8.tertiaryButtonTextLength,
|
|
5066
|
+
tertiaryButtonTextLength = _ref8$tertiaryButtonT === void 0 ? 0 : _ref8$tertiaryButtonT;
|
|
5013
5067
|
var isLinksLayoutColumn = primaryButtonTextLength >= LENGTH_TEXT || tertiaryButtonTextLength >= LENGTH_TEXT;
|
|
5014
5068
|
|
|
5015
5069
|
if (isLinksLayoutColumn) {
|
|
@@ -5017,11 +5071,11 @@ var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject7$7 || (_templat
|
|
|
5017
5071
|
}
|
|
5018
5072
|
|
|
5019
5073
|
return '';
|
|
5020
|
-
}, devices.mobile, devices.tablet, function (
|
|
5021
|
-
var
|
|
5022
|
-
primaryButtonTextLength =
|
|
5023
|
-
|
|
5024
|
-
tertiaryButtonTextLength =
|
|
5074
|
+
}, devices.mobile, devices.tablet, function (_ref9) {
|
|
5075
|
+
var _ref9$primaryButtonTe = _ref9.primaryButtonTextLength,
|
|
5076
|
+
primaryButtonTextLength = _ref9$primaryButtonTe === void 0 ? 0 : _ref9$primaryButtonTe,
|
|
5077
|
+
_ref9$tertiaryButtonT = _ref9.tertiaryButtonTextLength,
|
|
5078
|
+
tertiaryButtonTextLength = _ref9$tertiaryButtonT === void 0 ? 0 : _ref9$tertiaryButtonT;
|
|
5025
5079
|
var isLinksLayoutColumnTablet = primaryButtonTextLength >= LENGTH_TEXT_TABLET$1 || tertiaryButtonTextLength >= LENGTH_TEXT_TABLET$1;
|
|
5026
5080
|
|
|
5027
5081
|
if (isLinksLayoutColumnTablet) {
|
|
@@ -5146,20 +5200,56 @@ var TextOnly = function TextOnly(_ref) {
|
|
|
5146
5200
|
};
|
|
5147
5201
|
|
|
5148
5202
|
var _templateObject$M, _templateObject2$s;
|
|
5149
|
-
var Wrapper$2 = /*#__PURE__*/styled.div(_templateObject$M || (_templateObject$M = /*#__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 }\n"])), ImageAspectRatioWrapper)
|
|
5203
|
+
var Wrapper$2 = /*#__PURE__*/styled.div(_templateObject$M || (_templateObject$M = /*#__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
|
+
var _ref$aspectRatio = _ref.aspectRatio,
|
|
5205
|
+
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
5206
|
+
return aspectRatio;
|
|
5207
|
+
}, function (_ref2) {
|
|
5208
|
+
var _ref2$aspectRatio = _ref2.aspectRatio,
|
|
5209
|
+
aspectRatio = _ref2$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref2$aspectRatio,
|
|
5210
|
+
height = _ref2.height;
|
|
5211
|
+
return "calc(calc(" + height + "px - 12px - var(--line-height-body-2)) * " + AspectRatioWidth[aspectRatio] + ")";
|
|
5212
|
+
});
|
|
5150
5213
|
var CaptionWrapper = /*#__PURE__*/styled.div(_templateObject2$s || (_templateObject2$s = /*#__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"])));
|
|
5151
5214
|
|
|
5152
5215
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
5153
5216
|
var caption = _ref.caption,
|
|
5154
5217
|
children = _ref.children,
|
|
5155
5218
|
aspectRatio = _ref.aspectRatio;
|
|
5156
|
-
|
|
5219
|
+
var wrapperRef = useRef(null);
|
|
5220
|
+
|
|
5221
|
+
var _useState = useState(0),
|
|
5222
|
+
height = _useState[0],
|
|
5223
|
+
setHeight = _useState[1];
|
|
5224
|
+
|
|
5225
|
+
useEffect(function () {
|
|
5226
|
+
var setWrapperHeight = function setWrapperHeight() {
|
|
5227
|
+
var _wrapperRef$current;
|
|
5228
|
+
|
|
5229
|
+
return setHeight((wrapperRef == null ? void 0 : (_wrapperRef$current = wrapperRef.current) == null ? void 0 : _wrapperRef$current.offsetHeight) || 0);
|
|
5230
|
+
};
|
|
5231
|
+
|
|
5232
|
+
window.addEventListener('resize', setWrapperHeight);
|
|
5233
|
+
|
|
5234
|
+
if (wrapperRef) {
|
|
5235
|
+
setWrapperHeight();
|
|
5236
|
+
}
|
|
5237
|
+
|
|
5238
|
+
return function () {
|
|
5239
|
+
return window.removeEventListener('resize', setWrapperHeight);
|
|
5240
|
+
};
|
|
5241
|
+
}, [wrapperRef]);
|
|
5242
|
+
return /*#__PURE__*/React__default.createElement(Wrapper$2, {
|
|
5243
|
+
aspectRatio: aspectRatio,
|
|
5244
|
+
ref: wrapperRef,
|
|
5245
|
+
height: height
|
|
5246
|
+
}, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
|
|
5157
5247
|
aspectRatio: aspectRatio
|
|
5158
5248
|
}, children), /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
5159
5249
|
};
|
|
5160
5250
|
|
|
5161
5251
|
var _templateObject$N;
|
|
5162
|
-
var GlobalStyles = /*#__PURE__*/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 }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
5252
|
+
var GlobalStyles = /*#__PURE__*/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) {
|
|
5163
5253
|
var theme = _ref.theme;
|
|
5164
5254
|
return theme.colors.primary;
|
|
5165
5255
|
}, function (_ref2) {
|
|
@@ -6035,6 +6125,12 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$N || (_templat
|
|
|
6035
6125
|
}, function (_ref292) {
|
|
6036
6126
|
var theme = _ref292.theme;
|
|
6037
6127
|
return theme.grid.tablet.margin;
|
|
6128
|
+
}, function (_ref293) {
|
|
6129
|
+
var theme = _ref293.theme;
|
|
6130
|
+
return theme.spacing[10];
|
|
6131
|
+
}, function (_ref294) {
|
|
6132
|
+
var theme = _ref294.theme;
|
|
6133
|
+
return theme.spacing[6];
|
|
6038
6134
|
}, devices.desktop, devices.largeDesktop);
|
|
6039
6135
|
|
|
6040
6136
|
export { Accordion, Accordions, AltHeader, AnchorTapBar, AspectRatio, BodyText, Card, Cards, Carousel, CarouselType, CinemaBadge, Colors, Editorial, Footer, GlobalStyles, Grid, GridItem, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, Icon, ImageAspectRatioWrapper, ImageWithCaption, Navigation, Overline, PageHeadingCinema, PageHeadingCore, PageHeadingImpact, PageHeadingStream, PeopleListing, PrimaryButton, PromoWithTitle, RotatorButtons, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Sponsorship, StreamBadge, Subtitle, TabLink, Tabs, Button$1 as TertiaryButton, TextOnly, Theme as ThemeProvider, ThemeType, TypeTags, devices };
|