@royaloperahouse/harmonic 0.1.8-b → 0.1.8-d
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/harmonic.cjs.development.js +818 -283
- package/dist/harmonic.cjs.development.js.map +1 -1
- package/dist/harmonic.cjs.production.min.js +1 -1
- package/dist/harmonic.cjs.production.min.js.map +1 -1
- package/dist/harmonic.esm.js +812 -284
- package/dist/harmonic.esm.js.map +1 -1
- package/dist/index.d.ts +3 -3
- package/dist/types/index.d.ts +2 -2
- package/package.json +1 -1
package/dist/harmonic.esm.js
CHANGED
|
@@ -7338,10 +7338,91 @@ var ModalWindow = function ModalWindow(_ref) {
|
|
|
7338
7338
|
})), /*#__PURE__*/React__default.createElement(ContentWrapper, null, children))), /*#__PURE__*/React__default.createElement(ScrollLock, null)));
|
|
7339
7339
|
};
|
|
7340
7340
|
|
|
7341
|
-
var
|
|
7341
|
+
var GRID_COLUMN_GAP = 'var(--grid-column-gap)';
|
|
7342
|
+
var GRID_VALUES = {
|
|
7343
|
+
desktop: {
|
|
7344
|
+
gapsNumber: 13,
|
|
7345
|
+
columnsNumber: 13,
|
|
7346
|
+
largeCard: {
|
|
7347
|
+
gapsPerSlide: 4,
|
|
7348
|
+
columnsPerSlide: 5
|
|
7349
|
+
},
|
|
7350
|
+
smallCard: {
|
|
7351
|
+
gapsPerSlide: 3,
|
|
7352
|
+
columnsPerSlide: 4
|
|
7353
|
+
}
|
|
7354
|
+
},
|
|
7355
|
+
mobile: {
|
|
7356
|
+
columnsNumber: 12,
|
|
7357
|
+
gapsNumber: 13,
|
|
7358
|
+
columnsPerSlide: 10,
|
|
7359
|
+
gapsPerSlide: 9
|
|
7360
|
+
}
|
|
7361
|
+
};
|
|
7362
|
+
// Grid Calculations
|
|
7363
|
+
var calculateGridColumnWidth = function calculateGridColumnWidth(gridGapsNumber, gridColumnsNumber) {
|
|
7364
|
+
return "calc((100% - (" + gridGapsNumber + " * " + GRID_COLUMN_GAP + ")) / " + gridColumnsNumber + ")";
|
|
7365
|
+
};
|
|
7366
|
+
var calculateGapsSpaceInMainGrid = function calculateGapsSpaceInMainGrid(gapsNumber) {
|
|
7367
|
+
return "calc(" + gapsNumber + " * " + GRID_COLUMN_GAP + ")";
|
|
7368
|
+
};
|
|
7369
|
+
var calculateSlideGapsSpace = function calculateSlideGapsSpace(gapsPerSlide) {
|
|
7370
|
+
return "calc(" + GRID_COLUMN_GAP + " * " + gapsPerSlide + ")";
|
|
7371
|
+
};
|
|
7372
|
+
// Slide styles
|
|
7373
|
+
var getCardSlideDesktopStyles = function getCardSlideDesktopStyles(type) {
|
|
7374
|
+
var _GRID_VALUES$desktop = GRID_VALUES.desktop,
|
|
7375
|
+
gapsNumber = _GRID_VALUES$desktop.gapsNumber,
|
|
7376
|
+
columnsNumber = _GRID_VALUES$desktop.columnsNumber;
|
|
7377
|
+
var _ref = type === CarouselType.LargeCard ? GRID_VALUES.desktop.largeCard : GRID_VALUES.desktop.smallCard,
|
|
7378
|
+
gapsPerSlide = _ref.gapsPerSlide,
|
|
7379
|
+
columnsPerSlide = _ref.columnsPerSlide;
|
|
7380
|
+
var gapsSpaceInMainGrid = calculateGapsSpaceInMainGrid(gapsNumber);
|
|
7381
|
+
var slideGapsSpace = calculateSlideGapsSpace(gapsPerSlide);
|
|
7382
|
+
return "\n width: calc( (" + columnsPerSlide + " * (100% - " + gapsSpaceInMainGrid + ") / " + columnsNumber + ") + " + slideGapsSpace + " );\n margin-right: " + GRID_COLUMN_GAP + ";\n ";
|
|
7383
|
+
};
|
|
7384
|
+
var getCardSlideMobileStyles = function getCardSlideMobileStyles() {
|
|
7385
|
+
var _GRID_VALUES$mobile = GRID_VALUES.mobile,
|
|
7386
|
+
columnsNumber = _GRID_VALUES$mobile.columnsNumber,
|
|
7387
|
+
gapsNumber = _GRID_VALUES$mobile.gapsNumber,
|
|
7388
|
+
columnsPerSlide = _GRID_VALUES$mobile.columnsPerSlide,
|
|
7389
|
+
gapsPerSlide = _GRID_VALUES$mobile.gapsPerSlide;
|
|
7390
|
+
var gridColumnWidth = calculateGridColumnWidth(gapsNumber, columnsNumber);
|
|
7391
|
+
return "\n width: " + ("calc((" + columnsPerSlide + " * " + gridColumnWidth + ") + (" + gapsPerSlide + " * " + GRID_COLUMN_GAP + "))") + ";\n margin-right: " + ("calc(" + gridColumnWidth + " + (" + GRID_COLUMN_GAP + " * 2))") + ";\n ";
|
|
7392
|
+
};
|
|
7393
|
+
var getImageSlideStyles = function getImageSlideStyles(imageHeight) {
|
|
7394
|
+
return "height: calc(" + imageHeight + "px + var(--carousel-image-caption-height) + 12px);";
|
|
7395
|
+
};
|
|
7396
|
+
|
|
7397
|
+
var _templateObject$N, _templateObject2$A, _templateObject3$o, _templateObject4$j, _templateObject5$e, _templateObject6$c, _templateObject7$7, _templateObject8$5;
|
|
7398
|
+
var ImageCarouselWrapper = /*#__PURE__*/styled.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n @media ", " {\n ", "\n }}\n"])), function (_ref) {
|
|
7399
|
+
var imagesHeightDesktop = _ref.imagesHeightDesktop;
|
|
7400
|
+
return "& {\n .swipe-slide {\n height: fit-content;\n width: auto;\n margin-right: var(--grid-column-gap);\n\n > figure {\n margin: 0px;\n " + getImageSlideStyles(imagesHeightDesktop) + "\n }\n }\n }";
|
|
7401
|
+
}, devices.mobile, function (_ref2) {
|
|
7402
|
+
var imagesHeightDevice = _ref2.imagesHeightDevice;
|
|
7403
|
+
return "&&& {\n .swipe-slide > figure {\n " + getImageSlideStyles(imagesHeightDevice) + "\n }\n }";
|
|
7404
|
+
});
|
|
7405
|
+
var CardsCarouselWrapper = /*#__PURE__*/styled.div(_templateObject2$A || (_templateObject2$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n @media ", " {\n && {\n .swipe-slide {\n ", "\n }\n }\n}}"])), function (_ref3) {
|
|
7406
|
+
var type = _ref3.type;
|
|
7407
|
+
return "\n & {\n .swipe-slide {\n " + getCardSlideDesktopStyles(type) + "\n }\n }\n ";
|
|
7408
|
+
}, devices.mobile, /*#__PURE__*/getCardSlideMobileStyles());
|
|
7409
|
+
var TitleButtonsGrid = /*#__PURE__*/styled(Grid)(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 28px;\n\n @media ", " {\n padding-bottom: 0;\n }\n\n @media ", " {\n margin-bottom: 20px;\n }\n"])), devices.mobile, devices.mobile);
|
|
7410
|
+
var CarouselInfoWrapper = /*#__PURE__*/styled.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n user-select: text;\n"])));
|
|
7411
|
+
var TitleWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref4) {
|
|
7412
|
+
var isDescriptionPresent = _ref4.isDescriptionPresent;
|
|
7413
|
+
return isDescriptionPresent && 'margin: 20px 0';
|
|
7414
|
+
});
|
|
7415
|
+
var ButtonsWrapper = /*#__PURE__*/styled.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n align-items: start;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
7416
|
+
var TitleGridItem = /*#__PURE__*/styled(GridItem)(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 2 / span 10;\n }\n"])), devices.tablet);
|
|
7417
|
+
var SwipeGridWrapper = /*#__PURE__*/styled(GridItem)(_templateObject8$5 || (_templateObject8$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n\n @media ", " {\n grid-column: 1 / span 14;\n }\n\n @media ", " {\n grid-column: 2 / span 13;\n }\n"])), function (_ref5) {
|
|
7418
|
+
var active = _ref5.active;
|
|
7419
|
+
return active ? 'grid-column: 1 / span 16' : '';
|
|
7420
|
+
}, devices.tablet, devices.mobile);
|
|
7421
|
+
|
|
7422
|
+
var _templateObject$O, _templateObject2$B;
|
|
7342
7423
|
var SWIPE_SLIDE_CLASS_NAME = 'swipe-slide';
|
|
7343
|
-
var SwipeContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
7344
|
-
var SwipeTrack = /*#__PURE__*/styled.div(_templateObject2$
|
|
7424
|
+
var SwipeContainer = /*#__PURE__*/styled.div(_templateObject$O || (_templateObject$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n width: 100%;\n touch-action: pan-y;\n"])));
|
|
7425
|
+
var SwipeTrack = /*#__PURE__*/styled.div(_templateObject2$B || (_templateObject2$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n transition: ", ";\n transform: translateX(", "px);\n\n .", " {\n flex-shrink: 0;\n }\n"])), function (props) {
|
|
7345
7426
|
return props.transitioning ? 'transform 0.3s ease-in-out' : 'none';
|
|
7346
7427
|
}, function (props) {
|
|
7347
7428
|
return props.translateX;
|
|
@@ -7558,6 +7639,141 @@ var Swipe = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
7558
7639
|
});
|
|
7559
7640
|
Swipe.displayName = 'Swipe';
|
|
7560
7641
|
|
|
7642
|
+
var SCREEN_WIDTH_PERCENTAGE = 0.05;
|
|
7643
|
+
var GRID_OFFSET_MARGIN = {
|
|
7644
|
+
mobile: 0,
|
|
7645
|
+
tablet: 15,
|
|
7646
|
+
desktop: 3
|
|
7647
|
+
};
|
|
7648
|
+
var Carousel = function Carousel(_ref) {
|
|
7649
|
+
var children = _ref.children,
|
|
7650
|
+
type = _ref.type,
|
|
7651
|
+
title = _ref.title,
|
|
7652
|
+
description = _ref.description,
|
|
7653
|
+
className = _ref.className,
|
|
7654
|
+
_ref$titleSemanticLev = _ref.titleSemanticLevel,
|
|
7655
|
+
titleSemanticLevel = _ref$titleSemanticLev === void 0 ? 3 : _ref$titleSemanticLev,
|
|
7656
|
+
_ref$imagesHeightDevi = _ref.imagesHeightDevice,
|
|
7657
|
+
imagesHeightDevice = _ref$imagesHeightDevi === void 0 ? 300 : _ref$imagesHeightDevi,
|
|
7658
|
+
_ref$imagesHeightDesk = _ref.imagesHeightDesktop,
|
|
7659
|
+
imagesHeightDesktop = _ref$imagesHeightDesk === void 0 ? 500 : _ref$imagesHeightDesk,
|
|
7660
|
+
_ref$infinite = _ref.infinite,
|
|
7661
|
+
infinite = _ref$infinite === void 0 ? true : _ref$infinite,
|
|
7662
|
+
_ref$useOffset = _ref.useOffset,
|
|
7663
|
+
useOffset = _ref$useOffset === void 0 ? true : _ref$useOffset;
|
|
7664
|
+
var _useState = useState(false),
|
|
7665
|
+
active = _useState[0],
|
|
7666
|
+
setActive = _useState[1];
|
|
7667
|
+
var _useState2 = useState(0),
|
|
7668
|
+
slidesOffsetBefore = _useState2[0],
|
|
7669
|
+
setSlidesOffsetBefore = _useState2[1];
|
|
7670
|
+
var swipeRef = useRef(null);
|
|
7671
|
+
useEffect(function () {
|
|
7672
|
+
if (!useOffset || !active) return undefined;
|
|
7673
|
+
var updateWindowDimensions = function updateWindowDimensions() {
|
|
7674
|
+
if (window.matchMedia(devices.mobile).matches) {
|
|
7675
|
+
setSlidesOffsetBefore(GRID_OFFSET_MARGIN.mobile);
|
|
7676
|
+
} else if (window.matchMedia(devices.tablet).matches) {
|
|
7677
|
+
setSlidesOffsetBefore(GRID_OFFSET_MARGIN.tablet);
|
|
7678
|
+
} else {
|
|
7679
|
+
setSlidesOffsetBefore(Math.floor(window.innerWidth * SCREEN_WIDTH_PERCENTAGE) - GRID_OFFSET_MARGIN.desktop);
|
|
7680
|
+
}
|
|
7681
|
+
};
|
|
7682
|
+
window.addEventListener('resize', updateWindowDimensions);
|
|
7683
|
+
updateWindowDimensions();
|
|
7684
|
+
return function () {
|
|
7685
|
+
window.removeEventListener('resize', updateWindowDimensions);
|
|
7686
|
+
};
|
|
7687
|
+
}, [useOffset, active]);
|
|
7688
|
+
var onNext = function onNext() {
|
|
7689
|
+
var _swipeRef$current;
|
|
7690
|
+
if (useOffset && !active) setActive(true);
|
|
7691
|
+
(_swipeRef$current = swipeRef.current) == null || _swipeRef$current.nextSlide();
|
|
7692
|
+
};
|
|
7693
|
+
var onPrev = function onPrev() {
|
|
7694
|
+
var _swipeRef$current2;
|
|
7695
|
+
if (useOffset && !active) setActive(true);
|
|
7696
|
+
(_swipeRef$current2 = swipeRef.current) == null || _swipeRef$current2.prevSlide();
|
|
7697
|
+
};
|
|
7698
|
+
var carouselTitleId = "carousel-title-" + title;
|
|
7699
|
+
var Wrapper = type === CarouselType.Image ? ImageCarouselWrapper : CardsCarouselWrapper;
|
|
7700
|
+
return /*#__PURE__*/React__default.createElement(Wrapper, {
|
|
7701
|
+
className: className,
|
|
7702
|
+
type: type,
|
|
7703
|
+
imagesHeightDevice: imagesHeightDevice,
|
|
7704
|
+
imagesHeightDesktop: imagesHeightDesktop,
|
|
7705
|
+
role: "region",
|
|
7706
|
+
"aria-labelledby": carouselTitleId
|
|
7707
|
+
}, /*#__PURE__*/React__default.createElement(TitleButtonsGrid, null, /*#__PURE__*/React__default.createElement(TitleGridItem, {
|
|
7708
|
+
columnStartDesktop: 3,
|
|
7709
|
+
columnSpanDesktop: 10,
|
|
7710
|
+
columnStartDevice: 2,
|
|
7711
|
+
columnSpanDevice: 12
|
|
7712
|
+
}, title && (/*#__PURE__*/React__default.createElement(CarouselInfoWrapper, {
|
|
7713
|
+
"data-testid": "carousel-title-wrapper"
|
|
7714
|
+
}, /*#__PURE__*/React__default.createElement(TitleWrapper$1, {
|
|
7715
|
+
id: carouselTitleId,
|
|
7716
|
+
isDescriptionPresent: !!description
|
|
7717
|
+
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
7718
|
+
size: "small",
|
|
7719
|
+
serif: true,
|
|
7720
|
+
hierarchy: "h" + titleSemanticLevel
|
|
7721
|
+
}, title)), /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7722
|
+
size: "large"
|
|
7723
|
+
}, description)))), /*#__PURE__*/React__default.createElement(GridItem, {
|
|
7724
|
+
columnStartDesktop: 14,
|
|
7725
|
+
columnSpanDesktop: 2,
|
|
7726
|
+
columnStartDevice: 12,
|
|
7727
|
+
columnSpanDevice: 2
|
|
7728
|
+
}, /*#__PURE__*/React__default.createElement(ButtonsWrapper, {
|
|
7729
|
+
"data-testid": "carousel-buttons-wrapper"
|
|
7730
|
+
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
7731
|
+
onClickNext: onNext,
|
|
7732
|
+
onClickPrev: onPrev,
|
|
7733
|
+
availablePrev: true
|
|
7734
|
+
})))), /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(SwipeGridWrapper, {
|
|
7735
|
+
active: active,
|
|
7736
|
+
columnStartDesktop: 3,
|
|
7737
|
+
columnSpanDesktop: 14,
|
|
7738
|
+
columnStartDevice: 2,
|
|
7739
|
+
columnSpanDevice: 13
|
|
7740
|
+
}, /*#__PURE__*/React__default.createElement(Swipe, {
|
|
7741
|
+
"data-testid": "carousel-swipe",
|
|
7742
|
+
ref: swipeRef,
|
|
7743
|
+
infinite: infinite,
|
|
7744
|
+
slidesOffsetBefore: slidesOffsetBefore,
|
|
7745
|
+
role: "list",
|
|
7746
|
+
"aria-roledescription": "carousel"
|
|
7747
|
+
}, React__default.Children.toArray(children).map(function (child, index) {
|
|
7748
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
7749
|
+
key: "carousel-slide-" + index,
|
|
7750
|
+
"aria-roledescription": "slide"
|
|
7751
|
+
}, child);
|
|
7752
|
+
})))));
|
|
7753
|
+
};
|
|
7754
|
+
|
|
7755
|
+
var _templateObject$P, _templateObject2$C, _templateObject3$p, _templateObject4$k, _templateObject5$f, _templateObject6$d, _templateObject7$8, _templateObject8$6, _templateObject9$3, _templateObject10$3, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16, _templateObject17;
|
|
7756
|
+
var HighlightsGrid = /*#__PURE__*/styled(Grid)(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-template-rows: max-content minmax(0, 1fr);\n gap: 0 var(--grid-column-gap);\n background-color: var(--color-base-black);\n color: var(--color-base-white);\n user-select: none;\n\n .color-primary {\n color: var(--color-base-white);\n }\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
|
|
7757
|
+
var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$C || (_templateObject2$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 1 / 1 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n padding-top: 40px;\n padding-left: 50px;\n padding-right: 36px;\n user-select: text;\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 12;\n padding: 12px 0 12px var(--grid-margin);\n min-height: 64px;\n box-sizing: border-box;\n width: 100%;\n }\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 11;\n width: 100%;\n padding: 8px 0 8px 20px;\n min-height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
7758
|
+
var HeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
|
|
7759
|
+
var InfoWrapper = /*#__PURE__*/styled.div(_templateObject4$k || (_templateObject4$k = /*#__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);
|
|
7760
|
+
var InfoLogoWrapper = /*#__PURE__*/styled.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n width: 132px;\n height: 36px;\n\n @media ", " {\n & {\n margin-bottom: 16px;\n width: 102px;\n height: 28px;\n }\n }\n\n @media ", " {\n & {\n margin-bottom: 20px;\n width: 102px;\n height: 28px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
7761
|
+
var InfoTitleWrapper = /*#__PURE__*/styled.div(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n\n h1,\n h2,\n h3 {\n margin-bottom: 8px;\n }\n"])));
|
|
7762
|
+
var InfoTextWrapper = /*#__PURE__*/styled.div(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n user-select: text;\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n }\n"])), devices.mobileAndTablet);
|
|
7763
|
+
var InfoLinkWrapper = /*#__PURE__*/styled.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n flex-direction: row;\n\n @media ", " {\n & {\n margin-top: 16px;\n }\n }\n\n @media ", " {\n & {\n margin-top: 20px;\n }\n display: flex;\n flex-direction: column;\n }\n"])), devices.tablet, devices.mobile);
|
|
7764
|
+
var CarouselWrapper = /*#__PURE__*/styled.div(_templateObject9$3 || (_templateObject9$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n\n .swipe-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 .swipe-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 .swipe-slide {\n width: 100%;\n -webkit-transform: translate3d(0, 0, 0);\n }\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
7765
|
+
var RotatorButtonsWrapper = /*#__PURE__*/styled.div(_templateObject10$3 || (_templateObject10$3 = /*#__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);
|
|
7766
|
+
var RotatorButtonsWrapperMobile = /*#__PURE__*/styled.div(_templateObject11$1 || (_templateObject11$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n @media ", " {\n div {\n background-color: var(--color-base-black);\n }\n svg path {\n fill: var(--color-base-white);\n }\n\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 div {\n background-color: var(--color-base-black);\n }\n svg path {\n fill: var(--color-base-white);\n }\n\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);
|
|
7767
|
+
var HtmlBodyText = /*#__PURE__*/styled.p(_templateObject12$1 || (_templateObject12$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n"])));
|
|
7768
|
+
var FirstButtonComponentWrapper = /*#__PURE__*/styled.div(_templateObject13$1 || (_templateObject13$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 16px;\n\n @media ", " {\n & {\n display: flex;\n flex-direction: column;\n margin-right: 0;\n margin-bottom: 10px;\n }\n }\n"])), devices.mobile);
|
|
7769
|
+
var TimerWrapper$1 = /*#__PURE__*/styled.div(_templateObject14$1 || (_templateObject14$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 24px;\n }\n"])), devices.mobileAndTablet);
|
|
7770
|
+
var AdditionalInfoWrapper = /*#__PURE__*/styled.div(_templateObject15$1 || (_templateObject15$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n\n @media ", " {\n margin-top: 16px;\n }\n"])), devices.mobileAndTablet);
|
|
7771
|
+
var InfoSubtitleWrapper = /*#__PURE__*/styled.div(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 4px;\n"])));
|
|
7772
|
+
var VideoWithControlsWrapper = /*#__PURE__*/styled.div(_templateObject17 || (_templateObject17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--color-base-black);\n width: 100%;\n height: 100%;\n\n .video-with-controls-container {\n height: 100%;\n }\n\n .video-controls-container {\n display: ", ";\n position: fixed;\n\n > div {\n margin: 0 40px 30px 40px;\n\n @media ", " {\n margin: 0 20px 20px 20px;\n }\n }\n }\n\n button#play {\n height: 48px;\n width: 48px;\n }\n"])), function (_ref) {
|
|
7773
|
+
var isCurrentSlide = _ref.isCurrentSlide;
|
|
7774
|
+
return isCurrentSlide ? 'block' : 'none';
|
|
7775
|
+
}, devices.mobile);
|
|
7776
|
+
|
|
7561
7777
|
var COLORS$3 = {
|
|
7562
7778
|
"default": 'var(--button-auxiliary-color)',
|
|
7563
7779
|
background: 'var(--button-auxiliary-bg-color)'
|
|
@@ -7571,8 +7787,8 @@ var getBackgroundColor$1 = function getBackgroundColor(_ref2) {
|
|
|
7571
7787
|
return backgroundColor ? "var(--color-" + backgroundColor + ")" : COLORS$3.background;
|
|
7572
7788
|
};
|
|
7573
7789
|
|
|
7574
|
-
var _templateObject$
|
|
7575
|
-
var AuxiliaryButtonWrapper = /*#__PURE__*/styled(Button)(_templateObject$
|
|
7790
|
+
var _templateObject$Q;
|
|
7791
|
+
var AuxiliaryButtonWrapper = /*#__PURE__*/styled(Button)(_templateObject$Q || (_templateObject$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n height: 20px;\n border: none;\n padding: 0;\n font-family: var(--font-family-sans);\n font-size: var(--button-font-size);\n font-weight: var(--button-font-weight);\n color: ", ";\n width: fit-content;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n cursor: pointer;\n text-decoration: none;\n box-sizing: border-box;\n\n && span svg * {\n fill: ", ";\n }\n\n .auxiliaryButtonIcon {\n width: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n"])), getBackgroundColor$1, getTextColor$3, getTextColor$3);
|
|
7576
7792
|
|
|
7577
7793
|
var _excluded$i = ["children", "className"];
|
|
7578
7794
|
var AuxiliaryButton = function AuxiliaryButton(_ref) {
|
|
@@ -7585,8 +7801,29 @@ var AuxiliaryButton = function AuxiliaryButton(_ref) {
|
|
|
7585
7801
|
}), children);
|
|
7586
7802
|
};
|
|
7587
7803
|
|
|
7804
|
+
var _excluded$j = ["text"],
|
|
7805
|
+
_excluded2$2 = ["text"];
|
|
7588
7806
|
var _buttonTypeToButton;
|
|
7589
7807
|
var buttonTypeToButton = (_buttonTypeToButton = {}, _buttonTypeToButton[ButtonType.Primary] = PrimaryButton, _buttonTypeToButton[ButtonType.Secondary] = SecondaryButton, _buttonTypeToButton[ButtonType.Tertiary] = TertiaryButton, _buttonTypeToButton);
|
|
7808
|
+
var Buttons = function Buttons(_ref) {
|
|
7809
|
+
var auxiliaryCTA = _ref.auxiliaryCTA,
|
|
7810
|
+
links = _ref.links;
|
|
7811
|
+
var firstButton = links == null ? void 0 : links[0];
|
|
7812
|
+
var _ref2 = firstButton || {},
|
|
7813
|
+
_ref2$text = _ref2.text,
|
|
7814
|
+
firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
7815
|
+
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$j);
|
|
7816
|
+
var secondButton = links == null ? void 0 : links[1];
|
|
7817
|
+
var _ref3 = secondButton || {},
|
|
7818
|
+
_ref3$text = _ref3.text,
|
|
7819
|
+
secondButtonText = _ref3$text === void 0 ? '' : _ref3$text,
|
|
7820
|
+
restSecondButton = _objectWithoutPropertiesLoose(_ref3, _excluded2$2);
|
|
7821
|
+
var FirstButtonComponent = firstButton != null && firstButton.buttonType ? buttonTypeToButton[firstButton.buttonType] : PrimaryButton;
|
|
7822
|
+
var SecondButtonComponent = secondButton != null && secondButton.buttonType ? buttonTypeToButton[secondButton.buttonType] : SecondaryButton;
|
|
7823
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(InfoLinkWrapper, null, (firstButton == null ? void 0 : firstButton.text) && (/*#__PURE__*/React__default.createElement(FirstButtonComponentWrapper, null, /*#__PURE__*/React__default.createElement(FirstButtonComponent, Object.assign({}, restFirstButton), firstButtonText))), (secondButton == null ? void 0 : secondButton.text) && /*#__PURE__*/React__default.createElement(SecondButtonComponent, Object.assign({}, restSecondButton), secondButtonText)), auxiliaryCTA && (/*#__PURE__*/React__default.createElement(InfoLinkWrapper, null, /*#__PURE__*/React__default.createElement(AuxiliaryButton, Object.assign({}, auxiliaryCTA, {
|
|
7824
|
+
textColor: ThemeColor['base-white']
|
|
7825
|
+
}), auxiliaryCTA.text))));
|
|
7826
|
+
};
|
|
7590
7827
|
|
|
7591
7828
|
var stripAllHtmlTags = function stripAllHtmlTags(htmlString) {
|
|
7592
7829
|
return htmlString.replace(/<[^>]*>/g, '');
|
|
@@ -7645,19 +7882,63 @@ var truncateReactNodeString = function truncateReactNodeString(node, resultLengt
|
|
|
7645
7882
|
return truncateHtmlString(nodeString, resultLength, addDots);
|
|
7646
7883
|
};
|
|
7647
7884
|
|
|
7648
|
-
var
|
|
7649
|
-
var
|
|
7650
|
-
|
|
7651
|
-
|
|
7885
|
+
var InfoSection = function InfoSection(_ref) {
|
|
7886
|
+
var logo = _ref.logo,
|
|
7887
|
+
slide = _ref.slide,
|
|
7888
|
+
currentSlideIndex = _ref.currentSlideIndex;
|
|
7889
|
+
var _useState = useState([]),
|
|
7890
|
+
finishedTimers = _useState[0],
|
|
7891
|
+
setFinishedTimers = _useState[1];
|
|
7892
|
+
var infoText = slide.infoText,
|
|
7893
|
+
infoTitle = slide.infoTitle,
|
|
7894
|
+
infoTimeframe = slide.infoTimeframe,
|
|
7895
|
+
infoSubtitle = slide.infoSubtitle,
|
|
7896
|
+
timerParams = slide.timerParams,
|
|
7897
|
+
additionalInfo = slide.additionalInfo;
|
|
7898
|
+
var description = infoText ? truncateHtmlString(infoText, 185, true) : '';
|
|
7899
|
+
var handleEndDate = function handleEndDate() {
|
|
7900
|
+
return setFinishedTimers([].concat(finishedTimers, [currentSlideIndex]));
|
|
7901
|
+
};
|
|
7902
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, timerParams && (/*#__PURE__*/React__default.createElement(TimerWrapper$1, {
|
|
7903
|
+
"data-testid": "highlight-carousel-timer-wrapper"
|
|
7904
|
+
}, finishedTimers.includes(currentSlideIndex) ? (/*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
|
|
7905
|
+
size: "large"
|
|
7906
|
+
}, timerParams.endDateText)) : (/*#__PURE__*/React__default.createElement(Timer, {
|
|
7907
|
+
color: Colors.White,
|
|
7908
|
+
endDateHandler: handleEndDate,
|
|
7909
|
+
endDate: timerParams.endDate,
|
|
7910
|
+
title: timerParams.title
|
|
7911
|
+
})))), logo ? /*#__PURE__*/React__default.createElement(InfoLogoWrapper, null, logo) : null, /*#__PURE__*/React__default.createElement(InfoTitleWrapper, null, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
7912
|
+
size: "large",
|
|
7913
|
+
hierarchy: "h3"
|
|
7914
|
+
}, infoTitle), /*#__PURE__*/React__default.createElement(HarmonicOverline, {
|
|
7915
|
+
size: "large"
|
|
7916
|
+
}, infoTimeframe)), /*#__PURE__*/React__default.createElement(InfoTextWrapper, null, /*#__PURE__*/React__default.createElement(InfoSubtitleWrapper, null, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
|
|
7917
|
+
size: "large"
|
|
7918
|
+
}, infoSubtitle)), /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7919
|
+
size: "large"
|
|
7920
|
+
}, /*#__PURE__*/React__default.createElement(HtmlBodyText, {
|
|
7921
|
+
dangerouslySetInnerHTML: {
|
|
7922
|
+
__html: description
|
|
7923
|
+
}
|
|
7924
|
+
})), additionalInfo && (/*#__PURE__*/React__default.createElement(AdditionalInfoWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
|
|
7925
|
+
size: "large"
|
|
7926
|
+
}, additionalInfo)))));
|
|
7927
|
+
};
|
|
7928
|
+
|
|
7929
|
+
var _templateObject$R, _templateObject2$D, _templateObject3$q, _templateObject4$l, _templateObject5$g, _templateObject6$e;
|
|
7930
|
+
var AccordionContainer = /*#__PURE__*/styled.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n div {\n overflow: hidden;\n }\n"])));
|
|
7931
|
+
var LineContainer = /*#__PURE__*/styled.div(_templateObject2$D || (_templateObject2$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 2px;\n background-color: var(--base-color-light-grey);\n width: 100%;\n"])));
|
|
7932
|
+
var ChildrenContainer = /*#__PURE__*/styled.div(_templateObject3$q || (_templateObject3$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0px 20px 28px 20px;\n\n visibility: ", ";\n\n @media ", " {\n margin: 12px 0px 24px 0px;\n }\n \n @media print { \n visibility: visible;\n }\n}\n"])), function (_ref) {
|
|
7652
7933
|
var isVisible = _ref.isVisible;
|
|
7653
7934
|
return isVisible ? 'visible' : 'hidden';
|
|
7654
7935
|
}, devices.mobile);
|
|
7655
|
-
var TitleContainer$3 = /*#__PURE__*/styled.div(_templateObject4$
|
|
7656
|
-
var ContentContainer = /*#__PURE__*/styled.div(_templateObject5$
|
|
7936
|
+
var TitleContainer$3 = /*#__PURE__*/styled.div(_templateObject4$l || (_templateObject4$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n\n && h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n div {\n margin: 21px 20px;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n @media ", " {\n margin: 12px 20px 12px 0px;\n }\n }\n\n && svg {\n width: var(--navigation-middle-gap);\n height: var(--navigation-middle-gap);\n margin-right: 20px;\n\n @media ", " {\n margin-right: 0px;\n }\n }\n\n :hover {\n cursor: pointer;\n }\n"])), devices.mobile, devices.mobile);
|
|
7937
|
+
var ContentContainer = /*#__PURE__*/styled.div(_templateObject5$g || (_templateObject5$g = /*#__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 max-height: ", ";\n\n @media print {\n max-height: max-content;\n }\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n @media ", " {\n transition: 100% 0.2s ease;\n }\n"])), function (_ref2) {
|
|
7657
7938
|
var textHeight = _ref2.textHeight;
|
|
7658
7939
|
return textHeight;
|
|
7659
7940
|
}, devices.mobile);
|
|
7660
|
-
var PrintHideWrapper = /*#__PURE__*/styled.div(_templateObject6$
|
|
7941
|
+
var PrintHideWrapper = /*#__PURE__*/styled.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media print {\n display: none;\n }\n"])));
|
|
7661
7942
|
|
|
7662
7943
|
/* eslint-disable react/no-unstable-nested-components */
|
|
7663
7944
|
var Accordion = function Accordion(_ref) {
|
|
@@ -7762,8 +8043,8 @@ var Accordion = function Accordion(_ref) {
|
|
|
7762
8043
|
}, children)), showLine && /*#__PURE__*/React__default.createElement(LineContainer, null));
|
|
7763
8044
|
};
|
|
7764
8045
|
|
|
7765
|
-
var _templateObject$
|
|
7766
|
-
var AccordionsContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
8046
|
+
var _templateObject$S;
|
|
8047
|
+
var AccordionsContainer = /*#__PURE__*/styled.div(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
7767
8048
|
|
|
7768
8049
|
var Accordions = function Accordions(_ref) {
|
|
7769
8050
|
var _ref$items = _ref.items,
|
|
@@ -7784,18 +8065,18 @@ var Accordions = function Accordions(_ref) {
|
|
|
7784
8065
|
}));
|
|
7785
8066
|
};
|
|
7786
8067
|
|
|
7787
|
-
var _templateObject$
|
|
7788
|
-
var AnnouncementBannerWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
7789
|
-
var SvgContainer$2 = /*#__PURE__*/styled.div(_templateObject2$
|
|
8068
|
+
var _templateObject$T, _templateObject2$E, _templateObject3$r, _templateObject4$m, _templateObject5$h;
|
|
8069
|
+
var AnnouncementBannerWrapper = /*#__PURE__*/styled.div(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 28px 0;\n background-color: var(--announcement-banner-bg-color);\n color: var(--announcement-banner-color);\n\n @media ", " {\n padding: 20px 0;\n }\n"])), devices.mobile);
|
|
8070
|
+
var SvgContainer$2 = /*#__PURE__*/styled.div(_templateObject2$E || (_templateObject2$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n cursor: ", ";\n\n ", "\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n\n path {\n fill: var(--announcement-banner-color);\n }\n }\n"])), function (_ref) {
|
|
7790
8071
|
var isClickable = _ref.isClickable;
|
|
7791
8072
|
return isClickable ? 'pointer' : 'default';
|
|
7792
8073
|
}, function (_ref2) {
|
|
7793
8074
|
var isClickable = _ref2.isClickable;
|
|
7794
8075
|
return isClickable && "\n :hover:not(:active) {\n && svg path {\n fill: var(--announcement-banner-hover-color);\n }\n }\n :active {\n && svg path {\n fill: var(--announcement-banner-pressed-color);\n }\n }\n ";
|
|
7795
8076
|
});
|
|
7796
|
-
var ContentContainer$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
7797
|
-
var OverlineWrapper = /*#__PURE__*/styled(HarmonicOverline)(_templateObject4$
|
|
7798
|
-
var BannerContentWrapper = /*#__PURE__*/styled(GridItem)(_templateObject5$
|
|
8077
|
+
var ContentContainer$1 = /*#__PURE__*/styled.div(_templateObject3$r || (_templateObject3$r = /*#__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-sans);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n color: var(--announcement-banner-color);\n a {\n color: var(--announcement-banner-color);\n text-decoration: underline;\n }\n"])));
|
|
8078
|
+
var OverlineWrapper = /*#__PURE__*/styled(HarmonicOverline)(_templateObject4$m || (_templateObject4$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 4px;\n && {\n color: var(--announcement-banner-color);\n }\n"])));
|
|
8079
|
+
var BannerContentWrapper = /*#__PURE__*/styled(GridItem)(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n grid-column: 3 / span 10;\n }\n\n @media ", ", ", " {\n && {\n grid-column: 3 / span 12;\n }\n }\n\n @media ", " {\n margin-left: ", ";\n margin-right: ", ";\n }\n"])), devices.desktop, devices.largeDesktop, devices.mobile, function (_ref3) {
|
|
7799
8080
|
var variant = _ref3.variant;
|
|
7800
8081
|
return variant === BannerVariants['service-persistent'] ? '8px' : '0px';
|
|
7801
8082
|
}, function (_ref4) {
|
|
@@ -7867,50 +8148,50 @@ var AnnouncementBanner = function AnnouncementBanner(_ref) {
|
|
|
7867
8148
|
}))))));
|
|
7868
8149
|
};
|
|
7869
8150
|
|
|
7870
|
-
var _templateObject$
|
|
8151
|
+
var _templateObject$U, _templateObject2$F, _templateObject3$s, _templateObject4$n, _templateObject5$i, _templateObject6$f, _templateObject7$9, _templateObject8$7, _templateObject9$4, _templateObject10$4, _templateObject11$2, _templateObject12$2, _templateObject13$2, _templateObject14$2;
|
|
7871
8152
|
var LENGTH_LARGE_TEXT = 28;
|
|
7872
8153
|
var LENGTH_SMALL_TEXT$1 = 19;
|
|
7873
8154
|
var LENGTH_TEXT_TABLET = 10;
|
|
7874
|
-
var CardContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
8155
|
+
var CardContainer = /*#__PURE__*/styled.div(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: ", ";\n position: relative;\n ", "\n\n .targetLink {\n text-decoration: none;\n color: inherit;\n }\n"])), function (_ref) {
|
|
7875
8156
|
var isCardClickable = _ref.isCardClickable;
|
|
7876
8157
|
return isCardClickable ? 'pointer' : 'default';
|
|
7877
8158
|
}, function (_ref2) {
|
|
7878
8159
|
var onlyShowButtonsOnHover = _ref2.onlyShowButtonsOnHover;
|
|
7879
8160
|
return !onlyShowButtonsOnHover ? "height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: space-between; \n " : '';
|
|
7880
8161
|
});
|
|
7881
|
-
var HoverContainer = /*#__PURE__*/styled.div(_templateObject2$
|
|
7882
|
-
var ProgressContainer = /*#__PURE__*/styled.div(_templateObject3$
|
|
7883
|
-
var ContentContainer$2 = /*#__PURE__*/styled.div(_templateObject4$
|
|
8162
|
+
var HoverContainer = /*#__PURE__*/styled.div(_templateObject2$F || (_templateObject2$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 4px;\n background-color: var(--button-bg-color);\n position: absolute;\n width: 100%;\n z-index: ", ";\n"])), zIndexes.contentOverlay);
|
|
8163
|
+
var ProgressContainer = /*#__PURE__*/styled.div(_templateObject3$s || (_templateObject3$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: -6px;\n"])));
|
|
8164
|
+
var ContentContainer$2 = /*#__PURE__*/styled.div(_templateObject4$n || (_templateObject4$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n margin-top: 24px;\n\n @media ", " {\n margin-left: ", ";\n margin-right: ", ";\n }\n"])), devices.mobile, function (_ref3) {
|
|
7884
8165
|
var fullWidth = _ref3.fullWidth;
|
|
7885
8166
|
return fullWidth ? '0' : '20px';
|
|
7886
8167
|
}, function (_ref4) {
|
|
7887
8168
|
var fullWidth = _ref4.fullWidth;
|
|
7888
8169
|
return fullWidth ? '0' : '20px';
|
|
7889
8170
|
});
|
|
7890
|
-
var TitleContainer$4 = /*#__PURE__*/styled.div(_templateObject5$
|
|
7891
|
-
var TitleContainerMobile = /*#__PURE__*/styled.div(_templateObject6$
|
|
7892
|
-
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject7$
|
|
7893
|
-
var HighlightTextContainer = /*#__PURE__*/styled.div(_templateObject8$
|
|
7894
|
-
var SubtitleContainer = /*#__PURE__*/styled.span(_templateObject9$
|
|
7895
|
-
var LabelContainer = /*#__PURE__*/styled.div(_templateObject10$
|
|
8171
|
+
var TitleContainer$4 = /*#__PURE__*/styled.div(_templateObject5$i || (_templateObject5$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 12px 0;\n\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
8172
|
+
var TitleContainerMobile = /*#__PURE__*/styled.div(_templateObject6$f || (_templateObject6$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 12px 0;\n display: none;\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
8173
|
+
var TextContainer$2 = /*#__PURE__*/styled.div(_templateObject7$9 || (_templateObject7$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n white-space: break-spaces;\n overflow-wrap: break-word;\n"])));
|
|
8174
|
+
var HighlightTextContainer = /*#__PURE__*/styled.div(_templateObject8$7 || (_templateObject8$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 24px;\n"])));
|
|
8175
|
+
var SubtitleContainer = /*#__PURE__*/styled.span(_templateObject9$4 || (_templateObject9$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 4px;\n overflow-wrap: break-word;\n"])));
|
|
8176
|
+
var LabelContainer = /*#__PURE__*/styled.div(_templateObject10$4 || (_templateObject10$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n width: fit-content;\n height: 26px;\n\n @media ", " {\n margin-left: ", ";\n }\n"])), function (_ref5) {
|
|
7896
8177
|
var isVisible = _ref5.isVisible;
|
|
7897
8178
|
return isVisible ? "visible" : 'hidden';
|
|
7898
8179
|
}, devices.mobile, function (_ref6) {
|
|
7899
8180
|
var isGridCard = _ref6.isGridCard;
|
|
7900
8181
|
return isGridCard ? '20px' : '0';
|
|
7901
8182
|
});
|
|
7902
|
-
var ExtraActionsContainer = /*#__PURE__*/styled.div(_templateObject11$
|
|
8183
|
+
var ExtraActionsContainer = /*#__PURE__*/styled.div(_templateObject11$2 || (_templateObject11$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 26px;\n\n @media ", " {\n margin-left: ", ";\n margin-right: ", ";\n }\n"])), devices.mobile, function (_ref7) {
|
|
7903
8184
|
var fullWidth = _ref7.fullWidth;
|
|
7904
8185
|
return fullWidth ? '0' : '20px';
|
|
7905
8186
|
}, function (_ref8) {
|
|
7906
8187
|
var fullWidth = _ref8.fullWidth;
|
|
7907
8188
|
return fullWidth ? '0' : '20px';
|
|
7908
8189
|
});
|
|
7909
|
-
var LabelElements = /*#__PURE__*/styled.div(_templateObject12$
|
|
8190
|
+
var LabelElements = /*#__PURE__*/styled.div(_templateObject12$2 || (_templateObject12$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: 26px;\n padding: 0 8px;\n background-color: ", ";\n"])), function (_ref9) {
|
|
7910
8191
|
var bgColor = _ref9.bgColor;
|
|
7911
8192
|
return bgColor ? "var(--color-base-" + bgColor + ")" : 'var(--color-primary-background)';
|
|
7912
8193
|
});
|
|
7913
|
-
var LabelIconWrapper = /*#__PURE__*/styled.div(_templateObject13$
|
|
8194
|
+
var LabelIconWrapper = /*#__PURE__*/styled.div(_templateObject13$2 || (_templateObject13$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-left: 10px;\n\n svg {\n height: 24px;\n width: 24px;\n }\n"])));
|
|
7914
8195
|
var getButtonsOpacity = function getButtonsOpacity(_ref10) {
|
|
7915
8196
|
var onlyShowButtonsOnHover = _ref10.onlyShowButtonsOnHover;
|
|
7916
8197
|
return onlyShowButtonsOnHover ? 'opacity: 0;' : 'opacity: 1;';
|
|
@@ -7919,7 +8200,7 @@ var getButtonsMinHeight = function getButtonsMinHeight(_ref11) {
|
|
|
7919
8200
|
var onlyShowButtonsOnHover = _ref11.onlyShowButtonsOnHover;
|
|
7920
8201
|
return onlyShowButtonsOnHover ? 'min-height: unset;' : 'min-height: 120px;';
|
|
7921
8202
|
};
|
|
7922
|
-
var ButtonsContainer$1 = /*#__PURE__*/styled.div(_templateObject14$
|
|
8203
|
+
var ButtonsContainer$1 = /*#__PURE__*/styled.div(_templateObject14$2 || (_templateObject14$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n gap: 24px;\n margin-top: 24px;\n\n ", "\n\n @media ", " {\n ", ";\n margin-left: ", ";\n margin-right: ", ";\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n ", ";\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), getButtonsOpacity, function (_ref12) {
|
|
7923
8204
|
var size = _ref12.size,
|
|
7924
8205
|
primaryButtonTextLength = _ref12.primaryButtonTextLength,
|
|
7925
8206
|
tertiaryButtonTextLength = _ref12.tertiaryButtonTextLength;
|
|
@@ -7944,8 +8225,8 @@ var ButtonsContainer$1 = /*#__PURE__*/styled.div(_templateObject14$1 || (_templa
|
|
|
7944
8225
|
return '';
|
|
7945
8226
|
});
|
|
7946
8227
|
|
|
7947
|
-
var _excluded$
|
|
7948
|
-
_excluded2$
|
|
8228
|
+
var _excluded$k = ["text"],
|
|
8229
|
+
_excluded2$3 = ["text"];
|
|
7949
8230
|
var _buttonTypeToButton$1;
|
|
7950
8231
|
var LENGTH_LARGE_TEXT$1 = 28;
|
|
7951
8232
|
var LENGTH_SMALL_TEXT$2 = 19;
|
|
@@ -7994,13 +8275,13 @@ var Card = function Card(_ref) {
|
|
|
7994
8275
|
var _ref2 = firstButton || {},
|
|
7995
8276
|
_ref2$text = _ref2.text,
|
|
7996
8277
|
firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
7997
|
-
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
8278
|
+
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$k);
|
|
7998
8279
|
var primaryButtonTextTruncate = size === 'small' ? truncate(firstButtonText, LENGTH_SMALL_TEXT$2) : truncate(firstButtonText, LENGTH_LARGE_TEXT$1);
|
|
7999
8280
|
var secondButton = links == null ? void 0 : links[1];
|
|
8000
8281
|
var _ref3 = secondButton || {},
|
|
8001
8282
|
_ref3$text = _ref3.text,
|
|
8002
8283
|
secondButtonText = _ref3$text === void 0 ? '' : _ref3$text,
|
|
8003
|
-
restSecondButton = _objectWithoutPropertiesLoose(_ref3, _excluded2$
|
|
8284
|
+
restSecondButton = _objectWithoutPropertiesLoose(_ref3, _excluded2$3);
|
|
8004
8285
|
var tertiaryButtonTextTruncate = size === 'small' ? truncate(secondButtonText, LENGTH_SMALL_TEXT$2) : truncate(secondButtonText, LENGTH_LARGE_TEXT$1);
|
|
8005
8286
|
var hoverHandler = function hoverHandler(value) {
|
|
8006
8287
|
if (value) {
|
|
@@ -8102,9 +8383,9 @@ var Card = function Card(_ref) {
|
|
|
8102
8383
|
}, restSecondButton), tertiaryButtonTextTruncate)))));
|
|
8103
8384
|
};
|
|
8104
8385
|
|
|
8105
|
-
var _templateObject$
|
|
8106
|
-
var CardsContainer = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8107
|
-
var GridItemContainer = /*#__PURE__*/styled(GridItem)(_templateObject2$
|
|
8386
|
+
var _templateObject$V, _templateObject2$G;
|
|
8387
|
+
var CardsContainer = /*#__PURE__*/styled(Grid)(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n @media ", " {\n grid-row-gap: var(--cards-spacing-stack);\n }\n"])), devices.mobile);
|
|
8388
|
+
var GridItemContainer = /*#__PURE__*/styled(GridItem)(_templateObject2$G || (_templateObject2$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n grid-column: 1 / span 14;\n }\n"])), devices.mobile);
|
|
8108
8389
|
|
|
8109
8390
|
var Cards = function Cards(_ref) {
|
|
8110
8391
|
var cards = _ref.cards,
|
|
@@ -8146,18 +8427,18 @@ var Cards = function Cards(_ref) {
|
|
|
8146
8427
|
}));
|
|
8147
8428
|
};
|
|
8148
8429
|
|
|
8149
|
-
var _templateObject$
|
|
8150
|
-
var ContentWrapper$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
8151
|
-
var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject2$
|
|
8430
|
+
var _templateObject$W, _templateObject2$H, _templateObject3$t, _templateObject4$o, _templateObject5$j;
|
|
8431
|
+
var ContentWrapper$1 = /*#__PURE__*/styled.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > div {\n margin-bottom: 2px;\n\n &:first-child {\n margin-bottom: 4px;\n\n @media ", " {\n margin-bottom: 6px;\n }\n }\n }\n\n @media ", " {\n grid-column: 2 / span 12;\n }\n"])), devices.mobile, devices.mobileAndTablet);
|
|
8432
|
+
var Wrapper$4 = /*#__PURE__*/styled.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n padding: 30px 0;\n\n @media ", " {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: max-content;\n gap: var(--grid-column-gap);\n margin: 0;\n }\n"])), function (_ref) {
|
|
8152
8433
|
var hideBottomBorder = _ref.hideBottomBorder;
|
|
8153
8434
|
return "border-bottom: " + (hideBottomBorder ? 'none' : '2px solid var(--base-color-mid-grey)') + ";";
|
|
8154
8435
|
}, function (_ref2) {
|
|
8155
8436
|
var hideTopBorder = _ref2.hideTopBorder;
|
|
8156
8437
|
return "border-top: " + (hideTopBorder ? 'none' : '2px solid var(--base-color-mid-grey)') + ";";
|
|
8157
8438
|
}, devices.mobileAndTablet);
|
|
8158
|
-
var AddressWrapperDesktop = /*#__PURE__*/styled.div(_templateObject3$
|
|
8159
|
-
var AddressWrapperMobile = /*#__PURE__*/styled.div(_templateObject4$
|
|
8160
|
-
var DetailsWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8439
|
+
var AddressWrapperDesktop = /*#__PURE__*/styled.div(_templateObject3$t || (_templateObject3$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n display: none;\n }\n"])), devices.mobile);
|
|
8440
|
+
var AddressWrapperMobile = /*#__PURE__*/styled.div(_templateObject4$o || (_templateObject4$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n\n & > div {\n margin-bottom: 2px;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
8441
|
+
var DetailsWrapper = /*#__PURE__*/styled.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n\n @media ", " {\n flex-direction: column;\n margin: 4px 0;\n }\n\n a {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n color: var(--base-color-black);\n text-decoration: underline;\n\n &:before {\n display: inline-block;\n content: '';\n background-color: var(--base-color-black);\n width: 1px;\n height: 18px;\n margin: 0 8px -4px;\n\n @media ", " {\n display: none;\n }\n }\n\n &:first-child:before {\n display: none;\n }\n }\n"])), devices.mobile, devices.mobile);
|
|
8161
8442
|
|
|
8162
8443
|
var divideAddressString = function divideAddressString(address) {
|
|
8163
8444
|
return address.split(',').map(function (chunk, i) {
|
|
@@ -8214,18 +8495,18 @@ var ContactCard = function ContactCard(_ref) {
|
|
|
8214
8495
|
}, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString))))))));
|
|
8215
8496
|
};
|
|
8216
8497
|
|
|
8217
|
-
var _templateObject$
|
|
8218
|
-
var BodyTextRelative = /*#__PURE__*/styled(BodyText)(_templateObject$
|
|
8219
|
-
var ContentSummaryWrapper = /*#__PURE__*/styled.article(_templateObject2$
|
|
8498
|
+
var _templateObject$X, _templateObject2$I, _templateObject3$u, _templateObject4$p, _templateObject5$k, _templateObject6$g, _templateObject7$a;
|
|
8499
|
+
var BodyTextRelative = /*#__PURE__*/styled(BodyText)(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
8500
|
+
var ContentSummaryWrapper = /*#__PURE__*/styled.article(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n justify-items: start;\n align-items: center;\n margin: 20px 0;\n gap: 24px;\n cursor: ", ";\n\n @media ", " {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n"])), function (props) {
|
|
8220
8501
|
return props.clickable ? 'pointer' : 'default';
|
|
8221
8502
|
}, devices.mobile);
|
|
8222
|
-
var ContentSummaryImageWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
8223
|
-
var ContentSummaryTextWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
8503
|
+
var ContentSummaryImageWrapper = /*#__PURE__*/styled.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 0 0 33.3%;\n"])));
|
|
8504
|
+
var ContentSummaryTextWrapper = /*#__PURE__*/styled.div(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: ", ";\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n gap: 22px;\n\n & > * {\n margin-block-start: 0;\n margin-block-end: 0;\n }\n\n @media ", " {\n margin: 0 20px;\n gap: 12px;\n }\n\n & .content-summary-text-link {\n height: unset;\n }\n"])), function (props) {
|
|
8224
8505
|
return props.showImage ? 2 : '1 / span 4';
|
|
8225
8506
|
}, devices.mobile);
|
|
8226
|
-
var ContentSummaryTitleWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8227
|
-
var BodyTextLimit = /*#__PURE__*/styled.div(_templateObject6$
|
|
8228
|
-
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled.div(_templateObject7$
|
|
8507
|
+
var ContentSummaryTitleWrapper = /*#__PURE__*/styled.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & > * {\n margin: 0;\n }\n\n @media ", " {\n & > * {\n font-size: var(--font-size-header-5);\n font-weight: var(--font-weight-header-5);\n }\n }\n"])), devices.mobile);
|
|
8508
|
+
var BodyTextLimit = /*#__PURE__*/styled.div(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n"])));
|
|
8509
|
+
var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n & p:not(:last-child):after {\n content: '\\A\\A';\n white-space: pre;\n }\n\n ", "\n"], ["\n & p:not(:last-child):after {\n content: '\\\\A\\\\A';\n white-space: pre;\n }\n\n ", "\n"])), function (props) {
|
|
8229
8510
|
return !!props.truncate && "\n overflow: hidden;\n position: relative;\n display: -webkit-box;\n -webkit-line-clamp: " + props.truncate + ";\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n min-height: 1em;\n max-height: 3em;\n ";
|
|
8230
8511
|
});
|
|
8231
8512
|
|
|
@@ -8297,21 +8578,21 @@ var ContentSummary = function ContentSummary(_ref) {
|
|
|
8297
8578
|
}), link.text))));
|
|
8298
8579
|
};
|
|
8299
8580
|
|
|
8300
|
-
var _templateObject$
|
|
8301
|
-
var EditorialGrid = /*#__PURE__*/styled.div(_templateObject$
|
|
8581
|
+
var _templateObject$Y, _templateObject2$J, _templateObject3$v, _templateObject4$q, _templateObject5$l;
|
|
8582
|
+
var EditorialGrid = /*#__PURE__*/styled.div(_templateObject$Y || (_templateObject$Y = /*#__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) {
|
|
8302
8583
|
var imageToLeft = _ref.imageToLeft;
|
|
8303
8584
|
return imageToLeft ? "'left left left left left . right right right right right right'" : "'left left left left left left . right right right right right'";
|
|
8304
8585
|
}, devices.mobile);
|
|
8305
|
-
var EditorialImageWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
8586
|
+
var EditorialImageWrapper = /*#__PURE__*/styled.div(_templateObject2$J || (_templateObject2$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n align-self: center;\n grid-area: ", ";\n @media ", " {\n & {\n grid-area: row1;\n }\n"])), function (_ref2) {
|
|
8306
8587
|
var imageToLeft = _ref2.imageToLeft;
|
|
8307
8588
|
return imageToLeft ? 'left' : 'right';
|
|
8308
8589
|
}, devices.mobile);
|
|
8309
|
-
var EditorialTextWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
8590
|
+
var EditorialTextWrapper = /*#__PURE__*/styled.div(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n"])), function (_ref3) {
|
|
8310
8591
|
var imageToLeft = _ref3.imageToLeft;
|
|
8311
8592
|
return imageToLeft ? 'right' : 'left';
|
|
8312
8593
|
}, devices.mobile);
|
|
8313
|
-
var EditorialSubtitle = /*#__PURE__*/styled.span(_templateObject4$
|
|
8314
|
-
var EditorialText = /*#__PURE__*/styled.div(_templateObject5$
|
|
8594
|
+
var EditorialSubtitle = /*#__PURE__*/styled.span(_templateObject4$q || (_templateObject4$q = /*#__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"])));
|
|
8595
|
+
var EditorialText = /*#__PURE__*/styled.div(_templateObject5$l || (_templateObject5$l = /*#__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"])));
|
|
8315
8596
|
|
|
8316
8597
|
var Editorial = function Editorial(_ref) {
|
|
8317
8598
|
var _ref$imagePosition = _ref.imagePosition,
|
|
@@ -8365,10 +8646,10 @@ var getBorderColor$1 = function getBorderColor(variant, colorValue) {
|
|
|
8365
8646
|
return variant === InformationCtaVariants.Primary || variant === InformationCtaVariants.Secondary ? "border-color: " + colorValue + ";" : '';
|
|
8366
8647
|
};
|
|
8367
8648
|
|
|
8368
|
-
var _templateObject$
|
|
8369
|
-
var InfoWrapper = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8370
|
-
var InfoTitle = /*#__PURE__*/styled('div')(_templateObject2$
|
|
8371
|
-
var InfoCTAWrapper = /*#__PURE__*/styled('div')(_templateObject3$
|
|
8649
|
+
var _templateObject$Z, _templateObject2$K, _templateObject3$w, _templateObject4$r;
|
|
8650
|
+
var InfoWrapper$1 = /*#__PURE__*/styled(Grid)(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 60px 0;\n color: var(--information-panel-color);\n background-color: var(--information-panel-bg-color);\n\n @media ", " {\n padding: 40px 0;\n }\n"])), devices.mobile);
|
|
8651
|
+
var InfoTitle = /*#__PURE__*/styled('div')(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n * {\n margin-block: 0;\n }\n"])));
|
|
8652
|
+
var InfoCTAWrapper = /*#__PURE__*/styled('div')(_templateObject3$w || (_templateObject3$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n\n @media ", " {\n margin-top: 16px;\n }\n\n a {\n color: ", ";\n ", "\n ", "\n\n svg path {\n fill: ", ";\n }\n\n :hover:not(:active) {\n color: ", ";\n ", "\n ", "\n\n svg path {\n fill: ", ";\n }\n }\n\n :active {\n color: ", ";\n ", "\n ", "\n\n svg path {\n fill: ", ";\n }\n }\n }\n"])), devices.mobile, function (_ref) {
|
|
8372
8653
|
var variant = _ref.variant;
|
|
8373
8654
|
return getTextColor$4(variant, COLORS$4.background);
|
|
8374
8655
|
}, function (_ref2) {
|
|
@@ -8405,7 +8686,7 @@ var InfoCTAWrapper = /*#__PURE__*/styled('div')(_templateObject3$u || (_template
|
|
|
8405
8686
|
var variant = _ref12.variant;
|
|
8406
8687
|
return getTextColor$4(variant, COLORS$4.pressed);
|
|
8407
8688
|
});
|
|
8408
|
-
var InfoBodyWrapper = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject4$
|
|
8689
|
+
var InfoBodyWrapper = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject4$r || (_templateObject4$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--information-panel-color);\n\n a {\n text-decoration: underline;\n color: var(--information-panel-color);\n }\n\n @media ", " {\n padding-top: 4px;\n }\n"])), devices.mobile);
|
|
8409
8690
|
|
|
8410
8691
|
// Helper function for rendering buttons based on the variant
|
|
8411
8692
|
var renderButton = function renderButton(_ref) {
|
|
@@ -8494,7 +8775,7 @@ var Information = function Information(_ref) {
|
|
|
8494
8775
|
});
|
|
8495
8776
|
var maxTitleWordLength = Math.max.apply(Math, titleWordLengths);
|
|
8496
8777
|
var titleColumnSpan = getColumnSpan(maxTitleWordLength);
|
|
8497
|
-
return /*#__PURE__*/React__default.createElement(InfoWrapper, {
|
|
8778
|
+
return /*#__PURE__*/React__default.createElement(InfoWrapper$1, {
|
|
8498
8779
|
"data-testid": "infoWrapper",
|
|
8499
8780
|
className: className
|
|
8500
8781
|
}, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
@@ -8525,29 +8806,29 @@ var Information = function Information(_ref) {
|
|
|
8525
8806
|
})))));
|
|
8526
8807
|
};
|
|
8527
8808
|
|
|
8528
|
-
var _templateObject$
|
|
8529
|
-
var PageHeadingWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
8809
|
+
var _templateObject$_, _templateObject2$L, _templateObject3$x, _templateObject4$s, _templateObject5$m, _templateObject6$h, _templateObject7$b, _templateObject8$8;
|
|
8810
|
+
var PageHeadingWrapper = /*#__PURE__*/styled.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n ", ";\n\n // remove spacing above/below for all semantic levels of the title\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
8530
8811
|
var theme = _ref.theme;
|
|
8531
8812
|
return theme.colors.primary;
|
|
8532
8813
|
}, function (_ref2) {
|
|
8533
8814
|
var isPageHeadingWithoutTitle = _ref2.isPageHeadingWithoutTitle;
|
|
8534
8815
|
return isPageHeadingWithoutTitle && "\n padding-bottom: 42px;\n ";
|
|
8535
8816
|
}, devices.mobile);
|
|
8536
|
-
var PageHeadingGrid = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
8537
|
-
var TitleWrapper$
|
|
8817
|
+
var PageHeadingGrid = /*#__PURE__*/styled(Grid)(_templateObject2$L || (_templateObject2$L = /*#__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);
|
|
8818
|
+
var TitleWrapper$2 = /*#__PURE__*/styled.div(_templateObject3$x || (_templateObject3$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: title;\n margin-top: 80px;\n\n ", ";\n\n @media ", " {\n & {\n margin-top: 0;\n }\n }\n"])), function (_ref3) {
|
|
8538
8819
|
var isPageHeadingWithoutTitle = _ref3.isPageHeadingWithoutTitle;
|
|
8539
8820
|
return isPageHeadingWithoutTitle && "\n margin-top: 42px;\n ";
|
|
8540
8821
|
}, devices.mobile);
|
|
8541
|
-
var ChildrenWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
8822
|
+
var ChildrenWrapper = /*#__PURE__*/styled.div(_templateObject4$s || (_templateObject4$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 20px;\n width: fit-content;\n height: 43px;\n\n ", ";\n\n @media ", " {\n & {\n height: 33px;\n margin-top: 10px;\n margin-bottom: 20px;\n }\n }\n"])), function (_ref4) {
|
|
8542
8823
|
var isPageHeadingWithoutTitle = _ref4.isPageHeadingWithoutTitle;
|
|
8543
8824
|
return isPageHeadingWithoutTitle && "\n margin: 10px 0;\n ";
|
|
8544
8825
|
}, devices.mobile);
|
|
8545
|
-
var TextWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8546
|
-
var LogoWrapper = /*#__PURE__*/styled.div(_templateObject6$
|
|
8547
|
-
var ButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject7$
|
|
8548
|
-
var PageHeadingText = /*#__PURE__*/styled.div(_templateObject8$
|
|
8826
|
+
var TextWrapper = /*#__PURE__*/styled.div(_templateObject5$m || (_templateObject5$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n align-self: end;\n margin-top: 12px;\n\n h6 {\n margin: 0;\n padding: 0;\n }\n"])));
|
|
8827
|
+
var LogoWrapper = /*#__PURE__*/styled.div(_templateObject6$h || (_templateObject6$h = /*#__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);
|
|
8828
|
+
var ButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject7$b || (_templateObject7$b = /*#__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);
|
|
8829
|
+
var PageHeadingText = /*#__PURE__*/styled.div(_templateObject8$8 || (_templateObject8$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-family: var(--font-family-altHeader);\n text-transform: var(--text-transform-altHeader);\n word-break: var(--word-break-altHeader);\n"])));
|
|
8549
8830
|
|
|
8550
|
-
var _excluded$
|
|
8831
|
+
var _excluded$l = ["text"];
|
|
8551
8832
|
var PageHeading = function PageHeading(_ref) {
|
|
8552
8833
|
var title = _ref.title,
|
|
8553
8834
|
text = _ref.text,
|
|
@@ -8563,14 +8844,14 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
8563
8844
|
titleCharLimit = _ref$titleCharLimit === void 0 ? 40 : _ref$titleCharLimit;
|
|
8564
8845
|
var _ref2 = link || {},
|
|
8565
8846
|
linkText = _ref2.text,
|
|
8566
|
-
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
8847
|
+
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$l);
|
|
8567
8848
|
var truncatedText = text == null ? void 0 : text.substring(0, copyCharLimit);
|
|
8568
8849
|
var truncatedTitle = title == null ? void 0 : title.substring(0, titleCharLimit);
|
|
8569
8850
|
var isTitleUnAvailable = !title;
|
|
8570
8851
|
return /*#__PURE__*/React__default.createElement(PageHeadingWrapper, {
|
|
8571
8852
|
"data-testid": "page-heading-wrapper",
|
|
8572
8853
|
isPageHeadingWithoutTitle: isTitleUnAvailable
|
|
8573
|
-
}, /*#__PURE__*/React__default.createElement(PageHeadingGrid, null, /*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
8854
|
+
}, /*#__PURE__*/React__default.createElement(PageHeadingGrid, null, /*#__PURE__*/React__default.createElement(TitleWrapper$2, {
|
|
8574
8855
|
"data-testid": "page-heading-title",
|
|
8575
8856
|
isPageHeadingWithoutTitle: isTitleUnAvailable
|
|
8576
8857
|
}, children ? (/*#__PURE__*/React__default.createElement(ChildrenWrapper, {
|
|
@@ -8591,10 +8872,10 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
8591
8872
|
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restLink), linkText))) : null));
|
|
8592
8873
|
};
|
|
8593
8874
|
|
|
8594
|
-
var _excluded$
|
|
8875
|
+
var _excluded$m = ["link"];
|
|
8595
8876
|
var PageHeadingCore = function PageHeadingCore(_ref) {
|
|
8596
8877
|
var link = _ref.link,
|
|
8597
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
8878
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$m);
|
|
8598
8879
|
var coreLink = link && _extends({}, link, {
|
|
8599
8880
|
color: ThemeColor['base-white'],
|
|
8600
8881
|
bgColor: ThemeColor['base-black']
|
|
@@ -8606,10 +8887,10 @@ var PageHeadingCore = function PageHeadingCore(_ref) {
|
|
|
8606
8887
|
})));
|
|
8607
8888
|
};
|
|
8608
8889
|
|
|
8609
|
-
var _excluded$
|
|
8890
|
+
var _excluded$n = ["link"];
|
|
8610
8891
|
var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
8611
8892
|
var link = _ref.link,
|
|
8612
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
8893
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$n);
|
|
8613
8894
|
var cinemaLink = link && _extends({}, link, {
|
|
8614
8895
|
color: ThemeColor['base-black'],
|
|
8615
8896
|
bgColor: ThemeColor['base-white']
|
|
@@ -8623,17 +8904,17 @@ var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
|
8623
8904
|
})));
|
|
8624
8905
|
};
|
|
8625
8906
|
|
|
8626
|
-
var _templateObject
|
|
8627
|
-
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject
|
|
8628
|
-
var ImpactHeaderImageWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
8629
|
-
var ImpactGrid = /*#__PURE__*/styled(Grid)(_templateObject3$
|
|
8630
|
-
var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
8631
|
-
var LogoWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$
|
|
8632
|
-
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$
|
|
8633
|
-
var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject7$
|
|
8634
|
-
var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject8$
|
|
8907
|
+
var _templateObject$$, _templateObject2$M, _templateObject3$y, _templateObject4$t, _templateObject5$n, _templateObject6$i, _templateObject7$c, _templateObject8$9;
|
|
8908
|
+
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n position: relative;\n display: flex;\n background: var(--base-color-black);\n\n @media ", " {\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n }\n"])), devices.mobile);
|
|
8909
|
+
var ImpactHeaderImageWrapper = /*#__PURE__*/styled.div(_templateObject2$M || (_templateObject2$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n overflow: hidden;\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n img {\n width: 100%;\n filter: brightness(0.7);\n opacity: 0.95;\n }\n\n @media ", " {\n height: fit-content;\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n\n img {\n height: 100%;\n object-fit: cover;\n }\n }\n"])), devices.mobile);
|
|
8910
|
+
var ImpactGrid = /*#__PURE__*/styled(Grid)(_templateObject3$y || (_templateObject3$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n align-self: center;\n width: 100%;\n z-index: ", ";\n gap: 0 var(--grid-column-gap);\n grid-template-rows: min-content min-content min-content;\n grid-template-areas:\n '. . . . . logo logo logo logo logo logo . . . . .'\n '. . . text text text text text text text text text text . . .'\n '. . . button button button button button button button button button button . . .';\n\n @media ", " {\n & {\n height: 100%;\n grid-template-rows: 1fr max-content 1fr;\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. text text text text text text text text text text text text .'\n '. button button button button button button button button button button button button .';\n }\n }\n\n @media ", " {\n align-content: center;\n\n & {\n grid-template-areas:\n '. . . logo logo logo logo logo logo logo logo . . .'\n '. . text text text text text text text text text text . .'\n '. . button button button button button button button button button button . .';\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
8911
|
+
var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 20px;\n right: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @media ", " {\n & {\n right: var(--grid-margin);\n }\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
|
|
8912
|
+
var LogoWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
|
|
8913
|
+
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: text;\n color: var(--base-color-white);\n text-align: center;\n margin-top: 40px;\n max-height: calc(2 * var(--line-height-header-3));\n overflow: hidden;\n\n h3 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n max-height: calc(4 * var(--line-height-header-3));\n }\n }\n\n @media ", " {\n & {\n margin-top: 12px;\n max-height: calc(4 * var(--line-height-header-3));\n }\n\n h3 {\n font-size: var(--font-size-header-3);\n letter-spacing: var(--letter-spacing-header-5);\n line-height: var(--line-height-header-5);\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
8914
|
+
var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject7$c || (_templateObject7$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n align-self: end;\n display: flex;\n justify-content: center;\n margin-top: 40px;\n\n @media ", " {\n & {\n margin-top: 0px;\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
8915
|
+
var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject8$9 || (_templateObject8$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 20px;\n left: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
8635
8916
|
|
|
8636
|
-
var _excluded$
|
|
8917
|
+
var _excluded$o = ["text"];
|
|
8637
8918
|
var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
8638
8919
|
var children = _ref.children,
|
|
8639
8920
|
text = _ref.text,
|
|
@@ -8651,7 +8932,7 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
8651
8932
|
var truncatedText = text == null ? void 0 : text.substring(0, 75);
|
|
8652
8933
|
var _ref2 = link || {},
|
|
8653
8934
|
linkText = _ref2.text,
|
|
8654
|
-
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
8935
|
+
restLink = _objectWithoutPropertiesLoose(_ref2, _excluded$o);
|
|
8655
8936
|
return /*#__PURE__*/React__default.createElement(ImpactWrapper, {
|
|
8656
8937
|
bgUrlDesktop: bgUrlDesktop,
|
|
8657
8938
|
bgUrlDevice: bgUrlDevice,
|
|
@@ -8696,21 +8977,21 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
8696
8977
|
}, "Scroll Down"))) : null);
|
|
8697
8978
|
};
|
|
8698
8979
|
|
|
8699
|
-
var _templateObject$
|
|
8700
|
-
var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
8980
|
+
var _templateObject$10, _templateObject2$N, _templateObject3$z, _templateObject4$u, _templateObject5$o;
|
|
8981
|
+
var PanelGrid = /*#__PURE__*/styled(Grid)(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n\n ", "\n\n @media ", " {\n grid-template-rows: 48px max-content max-content;\n }\n"])), function (_ref) {
|
|
8701
8982
|
var color = _ref.color;
|
|
8702
8983
|
return "\n background-color: " + (color ? "var(--base-color-" + color + ")" : 'var(--base-color-core)') + ";\n color: " + (color === Colors.White ? 'var(--base-color-black)' : 'var(--base-color-white)') + ";\n ";
|
|
8703
8984
|
}, devices.mobileAndTablet);
|
|
8704
|
-
var LeftPanel = /*#__PURE__*/styled.div(_templateObject2$
|
|
8985
|
+
var LeftPanel = /*#__PURE__*/styled.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n box-sizing: border-box;\n height: 100%;\n display: grid;\n grid-auto-rows: 90% 1fr;\n gap: 0px 36px;\n align-items: center;\n\n @media ", " {\n grid-area: ", ";\n }\n"])), function (_ref2) {
|
|
8705
8986
|
var hasImage = _ref2.hasImage;
|
|
8706
8987
|
return hasImage ? '1 / 1 / 3 / 7' : '1 / 1 / 3 / 12';
|
|
8707
8988
|
}, devices.mobileAndTablet, function (_ref3) {
|
|
8708
8989
|
var hasImage = _ref3.hasImage;
|
|
8709
8990
|
return hasImage ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
|
|
8710
8991
|
});
|
|
8711
|
-
var RightPanel = /*#__PURE__*/styled.div(_templateObject3$
|
|
8712
|
-
var InfoWrapper$
|
|
8713
|
-
var ScrollDownWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$
|
|
8992
|
+
var RightPanel = /*#__PURE__*/styled.div(_templateObject3$z || (_templateObject3$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 7 / 3 / 17;\n position: relative;\n height: 100%;\n width: 100%;\n background-color: var(--base-color-black);\n\n @media ", " {\n grid-area: 2 / 1 / 3 / 15;\n }\n"])), devices.mobileAndTablet);
|
|
8993
|
+
var InfoWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 36px;\n max-height: 33vw;\n overflow: hidden;\n\n :first-child * {\n margin-block-start: 0;\n }\n\n @media ", " {\n margin: 36px 20px;\n max-height: unset;\n }\n"])), devices.mobileAndTablet);
|
|
8994
|
+
var ScrollDownWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$o || (_templateObject5$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0 0 25px 36px;\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n display: none;\n }\n"])), devices.mobileAndTablet);
|
|
8714
8995
|
|
|
8715
8996
|
var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
8716
8997
|
var _image$src, _image$alt;
|
|
@@ -8724,7 +9005,7 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
8724
9005
|
"data-testid": "wrapper"
|
|
8725
9006
|
}, /*#__PURE__*/React__default.createElement(LeftPanel, {
|
|
8726
9007
|
hasImage: hasImage
|
|
8727
|
-
}, /*#__PURE__*/React__default.createElement(InfoWrapper$
|
|
9008
|
+
}, /*#__PURE__*/React__default.createElement(InfoWrapper$2, null, info), scrollTo && (/*#__PURE__*/React__default.createElement(ScrollDownWrapper$1, {
|
|
8728
9009
|
"data-testid": "scroll-link"
|
|
8729
9010
|
}, /*#__PURE__*/React__default.createElement(TabLink, {
|
|
8730
9011
|
iconName: "Arrow",
|
|
@@ -8740,13 +9021,13 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
8740
9021
|
})))));
|
|
8741
9022
|
};
|
|
8742
9023
|
|
|
8743
|
-
var _templateObject
|
|
8744
|
-
var StreamWrapper = /*#__PURE__*/styled.div(_templateObject
|
|
9024
|
+
var _templateObject$11;
|
|
9025
|
+
var StreamWrapper = /*#__PURE__*/styled.div(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2::selection,\n div::selection {\n color: #1866dc;\n background-color: #fff;\n }\n"])));
|
|
8745
9026
|
|
|
8746
|
-
var _excluded$
|
|
9027
|
+
var _excluded$p = ["link"];
|
|
8747
9028
|
var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
8748
9029
|
var link = _ref.link,
|
|
8749
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
9030
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$p);
|
|
8750
9031
|
var streamLink = link && _extends({}, link, {
|
|
8751
9032
|
color: ThemeColor['base-black'],
|
|
8752
9033
|
bgColor: ThemeColor['base-white']
|
|
@@ -8760,36 +9041,36 @@ var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
|
8760
9041
|
}))));
|
|
8761
9042
|
};
|
|
8762
9043
|
|
|
8763
|
-
var _templateObject$
|
|
8764
|
-
var Wrapper$5 = /*#__PURE__*/styled.section(_templateObject$
|
|
8765
|
-
var ImageWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
8766
|
-
var SponsorWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
8767
|
-
var ImageButtonWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
8768
|
-
var ContentSection = /*#__PURE__*/styled.div(_templateObject5$
|
|
9044
|
+
var _templateObject$12, _templateObject2$O, _templateObject3$A, _templateObject4$v, _templateObject5$p, _templateObject6$j, _templateObject7$d, _templateObject8$a, _templateObject9$5, _templateObject10$5, _templateObject11$3;
|
|
9045
|
+
var Wrapper$5 = /*#__PURE__*/styled.section(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
9046
|
+
var ImageWrapper = /*#__PURE__*/styled.div(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n\n picture,\n img {\n width: 100%;\n height: 100%;\n }\n"])));
|
|
9047
|
+
var SponsorWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$A || (_templateObject3$A = /*#__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\n @media ", " {\n & {\n height: 40px;\n width: 40px;\n }\n \n & iframe {\n height: 80px;\n transform: scale(0.5) translate(-40px, -40px);\n width: 80px;\n }\n"])), zIndexes.sponsorship, devices.mobileAndTablet, devices.tablet);
|
|
9048
|
+
var ImageButtonWrapper = /*#__PURE__*/styled.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n right: var(--grid-outer-margin);\n bottom: 20px;\n z-index: 10;\n\n @media ", " {\n right: var(--grid-margin);\n bottom: 10px;\n }\n"])), devices.tablet);
|
|
9049
|
+
var ContentSection = /*#__PURE__*/styled.div(_templateObject5$p || (_templateObject5$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--heading-promo-bg-color);\n border-bottom: ", ";\n display: ", ";\n\n @media ", " {\n padding: 12px 0 20px;\n }\n"])), function (_ref) {
|
|
8769
9050
|
var theme = _ref.theme;
|
|
8770
9051
|
return theme == ThemeType.Cinema ? '2px solid var(--color-base-light-grey)' : 'none';
|
|
8771
9052
|
}, function (_ref2) {
|
|
8772
9053
|
var showBlock = _ref2.showBlock;
|
|
8773
9054
|
return showBlock ? 'block' : 'none';
|
|
8774
9055
|
}, devices.mobile);
|
|
8775
|
-
var BadgeWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$
|
|
8776
|
-
var AdditionalContentWrapper = /*#__PURE__*/styled.div(_templateObject7$
|
|
9056
|
+
var BadgeWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n svg {\n height: 32px;\n }\n\n @media ", " {\n margin-bottom: 12px;\n }\n"])), devices.mobile);
|
|
9057
|
+
var AdditionalContentWrapper = /*#__PURE__*/styled.div(_templateObject7$d || (_templateObject7$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: start;\n align-items: center;\n width: 200px;\n\n @media ", " {\n order: ", ";\n width: 100%;\n justify-content: center;\n }\n"])), devices.mobile, function (_ref3) {
|
|
8777
9058
|
var isBadgePresent = _ref3.isBadgePresent;
|
|
8778
9059
|
return isBadgePresent ? '1' : '4';
|
|
8779
9060
|
});
|
|
8780
|
-
var MainButtonWrapper = /*#__PURE__*/styled.div(_templateObject8$
|
|
9061
|
+
var MainButtonWrapper = /*#__PURE__*/styled.div(_templateObject8$a || (_templateObject8$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: end;\n width: 200px;\n\n @media ", " {\n margin-bottom: ", ";\n width: 100%;\n order: 3;\n }\n"])), devices.mobile, function (_ref4) {
|
|
8781
9062
|
var isAdditionalButtonPresent = _ref4.isAdditionalButtonPresent;
|
|
8782
9063
|
return isAdditionalButtonPresent ? '20px' : '0';
|
|
8783
9064
|
});
|
|
8784
|
-
var AdditionalButtonWrapper = /*#__PURE__*/styled.div(_templateObject9$
|
|
8785
|
-
var TitleWrapper$
|
|
9065
|
+
var AdditionalButtonWrapper = /*#__PURE__*/styled.div(_templateObject9$5 || (_templateObject9$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n @media ", " {\n width: 100%;\n display: flex;\n justify-content: center;\n }\n"])), devices.mobile);
|
|
9066
|
+
var TitleWrapper$3 = /*#__PURE__*/styled.div(_templateObject10$5 || (_templateObject10$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: center;\n padding: 10px 0;\n\n h1,\n h2,\n h3 {\n color: ", ";\n }\n\n @media ", " {\n padding: 0;\n order: 2;\n margin-bottom: ", ";\n }\n"])), function (_ref5) {
|
|
8786
9067
|
var theme = _ref5.theme;
|
|
8787
9068
|
return theme == ThemeType.Cinema ? 'var(--color-base-black)' : 'var(--color-base-white)';
|
|
8788
9069
|
}, devices.mobile, function (_ref6) {
|
|
8789
9070
|
var isButtonPresent = _ref6.isButtonPresent;
|
|
8790
9071
|
return isButtonPresent ? '20px' : '0';
|
|
8791
9072
|
});
|
|
8792
|
-
var ContentWrapper$2 = /*#__PURE__*/styled.div(_templateObject11$
|
|
9073
|
+
var ContentWrapper$2 = /*#__PURE__*/styled.div(_templateObject11$3 || (_templateObject11$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n min-height: 70px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n @media ", " {\n height: auto;\n flex-direction: column;\n justify-content: start;\n }\n"])), devices.mobile);
|
|
8793
9074
|
|
|
8794
9075
|
var PageHeadingPromoBadge;
|
|
8795
9076
|
(function (PageHeadingPromoBadge) {
|
|
@@ -8932,7 +9213,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
8932
9213
|
}), !badge && (/*#__PURE__*/React__default.createElement(AdditionalButtonWrapper, null, /*#__PURE__*/React__default.createElement(Button$1, {
|
|
8933
9214
|
theme: theme,
|
|
8934
9215
|
link: additionalLink
|
|
8935
|
-
}))))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
9216
|
+
}))))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$3, {
|
|
8936
9217
|
theme: theme,
|
|
8937
9218
|
isButtonPresent: !!mainLink || !!additionalLink
|
|
8938
9219
|
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
@@ -8947,12 +9228,12 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
|
|
|
8947
9228
|
}))))))));
|
|
8948
9229
|
};
|
|
8949
9230
|
|
|
8950
|
-
var _templateObject$
|
|
8951
|
-
var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$
|
|
8952
|
-
var BrandingTextBody = /*#__PURE__*/styled.div(_templateObject2$
|
|
8953
|
-
var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
8954
|
-
var CompactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
8955
|
-
var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$
|
|
9231
|
+
var _templateObject$13, _templateObject2$P, _templateObject3$B, _templateObject5$q, _templateObject6$k, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject10$6;
|
|
9232
|
+
var BrandingTextBlock = /*#__PURE__*/styled.div(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-2);\n font-family: var(--font-family-header);\n text-transform: uppercase;\n margin: 0;\n white-space: nowrap;\n @media screen and (max-width: 920px) {\n white-space: normal;\n }\n @media ", " {\n white-space: nowrap;\n }\n"])), devices.mobile);
|
|
9233
|
+
var BrandingTextBody = /*#__PURE__*/styled.div(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-size: var(--font-size-heading-6);\n line-height: var(--line-height-heading-6);\n"])));
|
|
9234
|
+
var ComapctHeaderWrapper = /*#__PURE__*/styled.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n display: block;\n"])));
|
|
9235
|
+
var CompactHeaderAssetWrapper = /*#__PURE__*/styled.div(_templateObject5$q || (_templateObject5$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 37.5vw;\n width: 100%;\n position: relative;\n overflow: hidden;\n background-color: #000;\n img {\n position: relative;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n video {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n object-fit: contain;\n @media ", " {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n margin: auto;\n height: auto;\n max-height: 100vh;\n width: 100%;\n object-fit: contain;\n }\n }\n @media ", " {\n height: 85vw;\n max-height: 100vh;\n }\n"])), devices.mobile, devices.mobile);
|
|
9236
|
+
var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: 160px;\n grid-template-rows: min-content min-content;\n grid-template-rows: min-content min-content;\n grid-template-columns: [logo] 1fr [title] 3fr [cta] 1fr;\n align-content: center;\n gap: 0;\n background-color: ", ";\n color: ", ";\n\n svg {\n width: 210px;\n fill: ", ";\n }\n\n h1::selection,\n div::selection {\n ", ";\n }\n\n @media ", " {\n svg {\n width: 145px;\n }\n }\n\n @media ", " {\n display: flex;\n flex-direction: column;\n height: auto;\n padding: 32px 20px;\n\n svg {\n width: 180px;\n }\n }\n"])), function (_ref) {
|
|
8956
9237
|
var invert = _ref.invert,
|
|
8957
9238
|
theme = _ref.theme;
|
|
8958
9239
|
return invert ? theme.colors.white : theme.colors.primary;
|
|
@@ -8968,10 +9249,10 @@ var CompactHeaderCopyWrapper = /*#__PURE__*/styled(Grid)(_templateObject6$i || (
|
|
|
8968
9249
|
var theme = _ref4.theme;
|
|
8969
9250
|
return theme.colors.primary === theme.colors.stream && "\n color: " + theme.colors.stream + ";\n background-color: " + theme.colors.white + ";\n ";
|
|
8970
9251
|
}, devices.tablet, devices.mobile);
|
|
8971
|
-
var CompactHeaderLogoWrapper = /*#__PURE__*/styled.div(_templateObject7$
|
|
8972
|
-
var CompactHeaderTitleWrapper = /*#__PURE__*/styled.div(_templateObject8$
|
|
8973
|
-
var CompactHeaderCTAWrapper = /*#__PURE__*/styled.div(_templateObject9$
|
|
8974
|
-
var PrimaryButtonWithInversion = /*#__PURE__*/styled(PrimaryButton)(_templateObject10$
|
|
9252
|
+
var CompactHeaderLogoWrapper = /*#__PURE__*/styled.div(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: logo;\n padding-left: 50px;\n justify-content: left;\n align-items: center;\n width: 100%;\n @media ", " {\n padding-left: 0px;\n justify-content: center;\n }\n @media ", " {\n width: fit-content;\n }\n"])), devices.mobile, devices.tablet);
|
|
9253
|
+
var CompactHeaderTitleWrapper = /*#__PURE__*/styled.div(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: title;\n align-items: center;\n justify-content: center;\n font-family: var(--font-family-header);\n text-transform: uppercase;\n text-align: center;\n padding: 0 2em;\n @media ", " {\n justify-content: center;\n }\n"])), devices.mobile);
|
|
9254
|
+
var CompactHeaderCTAWrapper = /*#__PURE__*/styled.div(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: cta;\n justify-content: right;\n align-items: center;\n padding-right: 50px;\n @media ", " {\n padding-right: 0px;\n justify-content: center;\n }\n"])), devices.mobile);
|
|
9255
|
+
var PrimaryButtonWithInversion = /*#__PURE__*/styled(PrimaryButton)(_templateObject10$6 || (_templateObject10$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: ", ";\n color: ", ";\n svg {\n fill: ", ";\n path {\n fill: ", ";\n }\n }\n min-width: 145px;\n"])), function (_ref5) {
|
|
8975
9256
|
var invert = _ref5.invert,
|
|
8976
9257
|
theme = _ref5.theme;
|
|
8977
9258
|
return invert ? theme.colors.primary : theme.colors.white;
|
|
@@ -9060,7 +9341,7 @@ var CompactHeaderBranding = function CompactHeaderBranding(_ref) {
|
|
|
9060
9341
|
return /*#__PURE__*/React__default.createElement(CompactHeaderLogoWrapper, null, renderBranding(brandingStyle, invert, brandingText, brandingLink));
|
|
9061
9342
|
};
|
|
9062
9343
|
|
|
9063
|
-
var _excluded$
|
|
9344
|
+
var _excluded$q = ["text"];
|
|
9064
9345
|
var useResponsiveVideo = function useResponsiveVideo(video, poster) {
|
|
9065
9346
|
var mobileVideo = video.mobile || video.desktop;
|
|
9066
9347
|
var desktopVideo = video.desktop || video.mobile;
|
|
@@ -9167,7 +9448,7 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
9167
9448
|
semanticLevel = _ref4$semanticLevel === void 0 ? 1 : _ref4$semanticLevel;
|
|
9168
9449
|
var _ref5 = link || {},
|
|
9169
9450
|
linkText = _ref5.text,
|
|
9170
|
-
restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$
|
|
9451
|
+
restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$q);
|
|
9171
9452
|
var titleSize = title && title.length > 20 ? 4 : 3;
|
|
9172
9453
|
var video = {
|
|
9173
9454
|
elementId: 'compact-header-video',
|
|
@@ -9205,15 +9486,15 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
9205
9486
|
}), linkText))))));
|
|
9206
9487
|
};
|
|
9207
9488
|
|
|
9208
|
-
var _templateObject$
|
|
9209
|
-
var MorePages = /*#__PURE__*/styled.span(_templateObject$
|
|
9210
|
-
var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject2$
|
|
9489
|
+
var _templateObject$14, _templateObject2$Q, _templateObject3$C, _templateObject4$w;
|
|
9490
|
+
var MorePages = /*#__PURE__*/styled.span(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n pointer-events: none;\n"])));
|
|
9491
|
+
var PageNumberWrapper = /*#__PURE__*/styled.ol(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-top: 40px;\n margin-bottom: 40px;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: 1px solid rgba(0, 0, 0, 0);\n }\n"])));
|
|
9211
9492
|
// PageNumber extends bodyText but uses subtitle-1 font size
|
|
9212
|
-
var PageNumber = /*#__PURE__*/styled.a(_templateObject3$
|
|
9493
|
+
var PageNumber = /*#__PURE__*/styled.a(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: inherit;\n margin: 0;\n border-bottom: 1px solid transparent;\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n :hover {\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n /* active state - string used because react returns error for bool */\n ", "\n"])), function (_ref) {
|
|
9213
9494
|
var active = _ref.active;
|
|
9214
9495
|
return active === 'true' && " \n color: var(--base-color-core);\n ";
|
|
9215
9496
|
});
|
|
9216
|
-
var NextPage = /*#__PURE__*/styled(PageNumber)(_templateObject4$
|
|
9497
|
+
var NextPage = /*#__PURE__*/styled(PageNumber)(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n width: 25px;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n span {\n height: 1.5em;\n svg > path {\n fill: var(--base-color-dark-grey);\n }\n }\n"])));
|
|
9217
9498
|
|
|
9218
9499
|
var reducePages = function reducePages(pages, currentPage) {
|
|
9219
9500
|
// If there are less than 6 pages, return all pages
|
|
@@ -9279,14 +9560,14 @@ var Pagination = function Pagination(_ref) {
|
|
|
9279
9560
|
})))));
|
|
9280
9561
|
};
|
|
9281
9562
|
|
|
9282
|
-
var _templateObject$
|
|
9283
|
-
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
9284
|
-
var PersonWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
9285
|
-
var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
9286
|
-
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
9287
|
-
var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$
|
|
9288
|
-
var PersonLink = /*#__PURE__*/styled.a(_templateObject6$
|
|
9289
|
-
var ReplacementWrapper = /*#__PURE__*/styled.span(_templateObject7$
|
|
9563
|
+
var _templateObject$15, _templateObject2$R, _templateObject3$D, _templateObject4$x, _templateObject5$r, _templateObject6$l, _templateObject7$f;
|
|
9564
|
+
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n p {\n margin: 0;\n }\n\n grid-template-columns: 1fr 1fr 1fr;\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr;\n }\n\n @media ", " {\n grid-template-columns: 1fr 1fr 1fr 1fr;\n }\n"])), devices.mobile, devices.tablet, devices.largeDesktop);
|
|
9565
|
+
var PersonWrapper = /*#__PURE__*/styled.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
|
|
9566
|
+
var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
|
|
9567
|
+
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
|
|
9568
|
+
var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n break-inside: avoid;\n"])));
|
|
9569
|
+
var PersonLink = /*#__PURE__*/styled.a(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n text-decoration: underline;\n\n :hover {\n color: var(--base-color-primary);\n :after {\n color: var(--base-color-black);\n }\n }\n\n :visited {\n color: var(--base-color-black);\n }\n"])));
|
|
9570
|
+
var ReplacementWrapper = /*#__PURE__*/styled.span(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-dark-grey);\n"])));
|
|
9290
9571
|
|
|
9291
9572
|
var Person = function Person(_ref) {
|
|
9292
9573
|
var person = _ref.person,
|
|
@@ -9343,14 +9624,14 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
9343
9624
|
}));
|
|
9344
9625
|
};
|
|
9345
9626
|
|
|
9346
|
-
var _templateObject$
|
|
9347
|
-
var ReplacementWrapper$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
9348
|
-
var CreditListingWrapper = /*#__PURE__*/styled(PeopleListingGrid)(_templateObject2$
|
|
9627
|
+
var _templateObject$16, _templateObject2$S, _templateObject3$E, _templateObject4$y;
|
|
9628
|
+
var ReplacementWrapper$1 = /*#__PURE__*/styled.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
|
|
9629
|
+
var CreditListingWrapper = /*#__PURE__*/styled(PeopleListingGrid)(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n\n grid-template-columns: ", ";\n\n @media ", " {\n grid-template-columns: 1fr;\n }\n\n @media ", " {\n grid-template-columns: repeat(2, 1fr);\n }\n"])), function (_ref) {
|
|
9349
9630
|
var columnCount = _ref.columnCount;
|
|
9350
9631
|
return "repeat(" + columnCount + ", 1fr)";
|
|
9351
9632
|
}, devices.mobile, devices.tablet);
|
|
9352
|
-
var DescriptionWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
9353
|
-
var RoleWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$
|
|
9633
|
+
var DescriptionWrapper = /*#__PURE__*/styled.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 25px;\n margin-bottom: 3px;\n }\n"])));
|
|
9634
|
+
var RoleWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n min-height: 1.5em;\n"])));
|
|
9354
9635
|
|
|
9355
9636
|
// Get the total character length of a property in an array of objects
|
|
9356
9637
|
var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
|
|
@@ -9468,14 +9749,14 @@ var CreditListing = function CreditListing(_ref) {
|
|
|
9468
9749
|
}, creditEntries);
|
|
9469
9750
|
};
|
|
9470
9751
|
|
|
9471
|
-
var _templateObject$
|
|
9752
|
+
var _templateObject$17, _templateObject2$T, _templateObject3$F, _templateObject4$z, _templateObject5$s, _templateObject6$m, _templateObject7$g, _templateObject8$c, _templateObject9$7, _templateObject10$7, _templateObject11$4, _templateObject12$3, _templateObject13$3, _templateObject14$3, _templateObject15$2, _templateObject16$1, _templateObject17$1, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
|
|
9472
9753
|
var LENGTH_TEXT = 28;
|
|
9473
9754
|
var LENGTH_TEXT_TABLET$1 = 12;
|
|
9474
9755
|
var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
|
|
9475
9756
|
var GridTemplateImageToRight = "'. . left left left left left . right right right right right right right right'";
|
|
9476
9757
|
var GridTemplateAsCard = "'. . left left left left left right right right right right right right . . '";
|
|
9477
9758
|
var GridTemplateAsCardTablet = "'. . left left left left left left left right right right right right . . '";
|
|
9478
|
-
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
9759
|
+
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-template-areas: ", ";\n\n @media ", " {\n & {\n grid-template-areas: ", ";\n }\n }\n\n @media ", " {\n & {\n grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n grid-template-rows: min-content 24px min-content;\n gap: 0;\n grid-template-areas:\n 'row1 row1 row1'\n '. . .'\n '. row2 .';\n }\n }\n\n /* Overwrite template for card */\n ", "\n"])), function (_ref) {
|
|
9479
9760
|
var imageToLeft = _ref.imageToLeft;
|
|
9480
9761
|
return imageToLeft ? GridTemplateImageToLeft : GridTemplateImageToRight;
|
|
9481
9762
|
}, devices.tablet, function (_ref2) {
|
|
@@ -9485,9 +9766,9 @@ var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$15 || (_templa
|
|
|
9485
9766
|
var asCard = _ref3.asCard;
|
|
9486
9767
|
return asCard ? "\n grid-template-areas: " + GridTemplateAsCard + ";\n @media " + devices.tablet + " {\n grid-template-areas: " + GridTemplateAsCardTablet + ";\n }\n " : "";
|
|
9487
9768
|
});
|
|
9488
|
-
var PromoWithTagsSubtitle = /*#__PURE__*/styled.span(_templateObject2$
|
|
9489
|
-
var PromoWithTagsText = /*#__PURE__*/styled.div(_templateObject3$
|
|
9490
|
-
var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject4$
|
|
9769
|
+
var PromoWithTagsSubtitle = /*#__PURE__*/styled.span(_templateObject2$T || (_templateObject2$T = /*#__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"])));
|
|
9770
|
+
var PromoWithTagsText = /*#__PURE__*/styled.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n"])));
|
|
9771
|
+
var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 24px;\n\n ", ";\n\n ", "\n\n @media ", " {\n gap: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref4) {
|
|
9491
9772
|
var hasTextLinks = _ref4.hasTextLinks;
|
|
9492
9773
|
return "margin-top: " + (hasTextLinks ? '0' : '24px') + ";";
|
|
9493
9774
|
}, function (_ref5) {
|
|
@@ -9511,22 +9792,22 @@ var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject4$x || (_templat
|
|
|
9511
9792
|
}
|
|
9512
9793
|
return '';
|
|
9513
9794
|
});
|
|
9514
|
-
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject5$
|
|
9795
|
+
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n"])), function (_ref7) {
|
|
9515
9796
|
var marginBottom = _ref7.marginBottom;
|
|
9516
9797
|
return marginBottom + "px";
|
|
9517
9798
|
});
|
|
9518
|
-
var PromoWithTagsAdditionalText = /*#__PURE__*/styled(PromoWithTagsText)(_templateObject6$
|
|
9519
|
-
var TextLinksContainer = /*#__PURE__*/styled.div(_templateObject7$
|
|
9520
|
-
var TextLinkWrapper$3 = /*#__PURE__*/styled.div(_templateObject8$
|
|
9521
|
-
var ExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject9$
|
|
9522
|
-
var IconWrapper$2 = /*#__PURE__*/styled.div(_templateObject10$
|
|
9523
|
-
var PrimaryButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject11$
|
|
9524
|
-
var MobileTitleWrapper = /*#__PURE__*/styled.div(_templateObject12$
|
|
9525
|
-
var PromoWithTagsTypeTags = /*#__PURE__*/styled(TypeTags)(_templateObject13$
|
|
9526
|
-
var PromoWithTagsHeader = /*#__PURE__*/styled(Header)(_templateObject14$
|
|
9527
|
-
var PromoWithTagsTextLink = /*#__PURE__*/styled(TextLink)(_templateObject15$
|
|
9528
|
-
var asCardOverrides = /*#__PURE__*/css(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", " {\n font-size: var(--font-size-subtitle-2);\n }\n\n ", " {\n font-size: var(--font-size-overline-1);\n }\n\n ", " {\n flex-direction: row;\n @media ", " {\n flex-direction: row;\n }\n }\n\n ", " {\n font-size: var(--font-size-overline-2);\n font-weight: var(--font-weight-overline-2);\n line-height: var(--line-height-overline-2);\n letter-spacing: var(--letter-spacing-overline-2);\n }\n"])), PromoWithTagsSubtitle, PromoWithTagsTypeTags, ButtonsContainer$2, devices.tablet, PromoWithTagsTextLink);
|
|
9529
|
-
var PromoWithTagsExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject17 || (_templateObject17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-area: left;\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref8) {
|
|
9799
|
+
var PromoWithTagsAdditionalText = /*#__PURE__*/styled(PromoWithTagsText)(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
|
|
9800
|
+
var TextLinksContainer = /*#__PURE__*/styled.div(_templateObject7$g || (_templateObject7$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
|
|
9801
|
+
var TextLinkWrapper$3 = /*#__PURE__*/styled.div(_templateObject8$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
|
|
9802
|
+
var ExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject9$7 || (_templateObject9$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n iframe {\n height: 800px;\n }\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
|
|
9803
|
+
var IconWrapper$2 = /*#__PURE__*/styled.div(_templateObject10$7 || (_templateObject10$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n position: absolute;\n top: 25px;\n right: 35px;\n width: 24px;\n height: 24px;\n\n @media ", " {\n top: 30px;\n right: 30px;\n }\n\n @media ", " {\n top: 3px;\n right: 20px;\n }\n"])), devices.tablet, devices.mobile);
|
|
9804
|
+
var PrimaryButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject11$4 || (_templateObject11$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--button-height);\n\n @media ", " {\n width: 100%;\n }\n"])), devices.mobile);
|
|
9805
|
+
var MobileTitleWrapper = /*#__PURE__*/styled.div(_templateObject12$3 || (_templateObject12$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: none;\n margin: 0 50px 0 20px;\n\n h2,\n h3 {\n margin: 0;\n }\n\n @media ", " {\n display: block;\n }\n"])), devices.mobile);
|
|
9806
|
+
var PromoWithTagsTypeTags = /*#__PURE__*/styled(TypeTags)(_templateObject13$3 || (_templateObject13$3 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
9807
|
+
var PromoWithTagsHeader = /*#__PURE__*/styled(Header)(_templateObject14$3 || (_templateObject14$3 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
9808
|
+
var PromoWithTagsTextLink = /*#__PURE__*/styled(TextLink)(_templateObject15$2 || (_templateObject15$2 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
9809
|
+
var asCardOverrides = /*#__PURE__*/css(_templateObject16$1 || (_templateObject16$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", " {\n font-size: var(--font-size-subtitle-2);\n }\n\n ", " {\n font-size: var(--font-size-overline-1);\n }\n\n ", " {\n flex-direction: row;\n @media ", " {\n flex-direction: row;\n }\n }\n\n ", " {\n font-size: var(--font-size-overline-2);\n font-weight: var(--font-weight-overline-2);\n line-height: var(--line-height-overline-2);\n letter-spacing: var(--letter-spacing-overline-2);\n }\n"])), PromoWithTagsSubtitle, PromoWithTagsTypeTags, ButtonsContainer$2, devices.tablet, PromoWithTagsTextLink);
|
|
9810
|
+
var PromoWithTagsExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject17$1 || (_templateObject17$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-area: left;\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref8) {
|
|
9530
9811
|
var imageToLeft = _ref8.imageToLeft;
|
|
9531
9812
|
return imageToLeft ? 'left' : 'right';
|
|
9532
9813
|
}, devices.mobile);
|
|
@@ -9541,11 +9822,11 @@ var PromoWithTagsContentWrapper = /*#__PURE__*/styled.div(_templateObject18 || (
|
|
|
9541
9822
|
return asCard && asCardOverrides;
|
|
9542
9823
|
});
|
|
9543
9824
|
var PromoWithTagsContainer = /*#__PURE__*/styled.div(_templateObject19 || (_templateObject19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2,\n h3 {\n margin: 0 0 16px;\n }\n"])));
|
|
9544
|
-
var TimerWrapper$
|
|
9825
|
+
var TimerWrapper$2 = /*#__PURE__*/styled.div(_templateObject20 || (_templateObject20 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n"])));
|
|
9545
9826
|
var EndDateText = /*#__PURE__*/styled.div(_templateObject21 || (_templateObject21 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid var(--base-color-black);\n padding-bottom: 32px;\n margin-bottom: 32px;\n\n @media ", " {\n padding-bottom: 20px;\n margin-bottom: 20px;\n }\n"])), devices.mobile);
|
|
9546
9827
|
|
|
9547
|
-
var _excluded$
|
|
9548
|
-
_excluded2$
|
|
9828
|
+
var _excluded$r = ["text"],
|
|
9829
|
+
_excluded2$4 = ["text"],
|
|
9549
9830
|
_excluded3 = ["text"];
|
|
9550
9831
|
var _buttonTypeToButton$2;
|
|
9551
9832
|
var LENGTH_TEXT$1 = 28;
|
|
@@ -9607,13 +9888,13 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
9607
9888
|
var _ref2 = firstButton || {},
|
|
9608
9889
|
_ref2$text = _ref2.text,
|
|
9609
9890
|
firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
9610
|
-
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
9891
|
+
restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$r);
|
|
9611
9892
|
var primaryButtonTextTruncate = truncate(firstButtonText, LENGTH_TEXT$1);
|
|
9612
9893
|
var secondButton = links == null ? void 0 : links[1];
|
|
9613
9894
|
var _ref3 = secondButton || {},
|
|
9614
9895
|
_ref3$text = _ref3.text,
|
|
9615
9896
|
secondButtonText = _ref3$text === void 0 ? '' : _ref3$text,
|
|
9616
|
-
restSecondButton = _objectWithoutPropertiesLoose(_ref3, _excluded2$
|
|
9897
|
+
restSecondButton = _objectWithoutPropertiesLoose(_ref3, _excluded2$4);
|
|
9617
9898
|
var secondButtonTextTruncate = truncate(secondButtonText, LENGTH_TEXT$1);
|
|
9618
9899
|
var textTruncate = asCard ? truncate(text || '', LENGTH_TEXT_PARAGRAPH) : text;
|
|
9619
9900
|
var FirstButtonComponent = firstButton != null && firstButton.buttonType ? buttonTypeToButton$2[firstButton.buttonType] : PrimaryButton;
|
|
@@ -9635,7 +9916,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
9635
9916
|
level: 5
|
|
9636
9917
|
}, timerParams.endDateText));
|
|
9637
9918
|
}
|
|
9638
|
-
return /*#__PURE__*/React__default.createElement(TimerWrapper$
|
|
9919
|
+
return /*#__PURE__*/React__default.createElement(TimerWrapper$2, {
|
|
9639
9920
|
"data-testid": "promo-with-tags-timer-wrapper"
|
|
9640
9921
|
}, /*#__PURE__*/React__default.createElement(Timer, {
|
|
9641
9922
|
endDateHandler: function endDateHandler() {
|
|
@@ -9720,28 +10001,28 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
9720
10001
|
}))));
|
|
9721
10002
|
};
|
|
9722
10003
|
|
|
9723
|
-
var _templateObject$
|
|
10004
|
+
var _templateObject$18, _templateObject2$U, _templateObject3$G, _templateObject4$A, _templateObject5$t, _templateObject6$n, _templateObject7$h;
|
|
9724
10005
|
var LENGTH_TEXT$2 = 28;
|
|
9725
10006
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
9726
|
-
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
10007
|
+
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$18 || (_templateObject$18 = /*#__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) {
|
|
9727
10008
|
var imageToLeft = _ref.imageToLeft;
|
|
9728
10009
|
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'";
|
|
9729
10010
|
}, devices.tablet, function (_ref2) {
|
|
9730
10011
|
var imageToLeft = _ref2.imageToLeft;
|
|
9731
10012
|
return imageToLeft ? "'left left left left left left left right right right right right right .'" : "'. left left left left left left right right right right right right right'";
|
|
9732
10013
|
}, devices.mobile);
|
|
9733
|
-
var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
10014
|
+
var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref3) {
|
|
9734
10015
|
var imageToLeft = _ref3.imageToLeft;
|
|
9735
10016
|
return imageToLeft ? 'left' : 'right';
|
|
9736
10017
|
}, devices.mobile);
|
|
9737
|
-
var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
10018
|
+
var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row2;\n align-self: start;\n }\n }\n"])), function (_ref4) {
|
|
9738
10019
|
var imageToLeft = _ref4.imageToLeft;
|
|
9739
10020
|
return imageToLeft ? 'right' : 'left';
|
|
9740
10021
|
}, devices.mobile);
|
|
9741
|
-
var PromoWithTitleContainer = /*#__PURE__*/styled.div(_templateObject4$
|
|
9742
|
-
var PromoWithTitleSubtitle = /*#__PURE__*/styled.span(_templateObject5$
|
|
9743
|
-
var PromoWithTitleText = /*#__PURE__*/styled.div(_templateObject6$
|
|
9744
|
-
var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$
|
|
10022
|
+
var PromoWithTitleContainer = /*#__PURE__*/styled.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2,\n h3 {\n margin: 0 0 32px;\n\n @media ", " {\n & {\n margin: 0 0 24px;\n }\n }\n }\n"])), devices.mobile);
|
|
10023
|
+
var PromoWithTitleSubtitle = /*#__PURE__*/styled.span(_templateObject5$t || (_templateObject5$t = /*#__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"])));
|
|
10024
|
+
var PromoWithTitleText = /*#__PURE__*/styled.div(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: var(--color-primary-black);\n }\n\n &:visited {\n color: var(--color-base-dark-grey);\n }\n\n &:hover {\n color: var(--color-primary-red);\n }\n }\n"])));
|
|
10025
|
+
var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n gap: 16px;\n margin-top: 32px;\n\n ", "\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), function (_ref5) {
|
|
9745
10026
|
var _ref5$primaryButtonTe = _ref5.primaryButtonTextLength,
|
|
9746
10027
|
primaryButtonTextLength = _ref5$primaryButtonTe === void 0 ? 0 : _ref5$primaryButtonTe,
|
|
9747
10028
|
_ref5$tertiaryButtonT = _ref5.tertiaryButtonTextLength,
|
|
@@ -9763,8 +10044,8 @@ var ButtonsContainer$3 = /*#__PURE__*/styled.div(_templateObject7$f || (_templat
|
|
|
9763
10044
|
return '';
|
|
9764
10045
|
});
|
|
9765
10046
|
|
|
9766
|
-
var _templateObject$
|
|
9767
|
-
var VideoContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
10047
|
+
var _templateObject$19;
|
|
10048
|
+
var VideoContainer = /*#__PURE__*/styled.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n aspect-ratio: ", ";\n\n @supports not (aspect-ratio: ", ") {\n width: 100%;\n padding-top: ", "%;\n }\n\n video {\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) {
|
|
9768
10049
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
9769
10050
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
9770
10051
|
return aspectRatio;
|
|
@@ -9876,8 +10157,8 @@ var PromoChild = function PromoChild(_ref) {
|
|
|
9876
10157
|
}));
|
|
9877
10158
|
};
|
|
9878
10159
|
|
|
9879
|
-
var _excluded$
|
|
9880
|
-
_excluded2$
|
|
10160
|
+
var _excluded$s = ["text"],
|
|
10161
|
+
_excluded2$5 = ["text"];
|
|
9881
10162
|
var LENGTH_TEXT$3 = 28;
|
|
9882
10163
|
var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
9883
10164
|
var _ref$imagePosition = _ref.imagePosition,
|
|
@@ -9902,13 +10183,13 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
9902
10183
|
var _ref2 = primaryButton || {},
|
|
9903
10184
|
_ref2$text = _ref2.text,
|
|
9904
10185
|
primaryButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
9905
|
-
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
10186
|
+
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$s);
|
|
9906
10187
|
var primaryButtonTextTruncate = truncate(primaryButtonText, LENGTH_TEXT$3);
|
|
9907
10188
|
var tertiaryButton = links == null ? void 0 : links[1];
|
|
9908
10189
|
var _ref3 = tertiaryButton || {},
|
|
9909
10190
|
_ref3$text = _ref3.text,
|
|
9910
10191
|
tertiaryButtonText = _ref3$text === void 0 ? '' : _ref3$text,
|
|
9911
|
-
restTertiaryButton = _objectWithoutPropertiesLoose(_ref3, _excluded2$
|
|
10192
|
+
restTertiaryButton = _objectWithoutPropertiesLoose(_ref3, _excluded2$5);
|
|
9912
10193
|
var tertiaryButtonTextTruncate = truncate(tertiaryButtonText, LENGTH_TEXT$3);
|
|
9913
10194
|
var defaultVideoSettings = {
|
|
9914
10195
|
muted: true,
|
|
@@ -9945,8 +10226,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
9945
10226
|
}, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? (/*#__PURE__*/React__default.createElement(TertiaryButton, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate)) : null)) : null));
|
|
9946
10227
|
};
|
|
9947
10228
|
|
|
9948
|
-
var _templateObject$
|
|
9949
|
-
var RadioGroupContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
10229
|
+
var _templateObject$1a;
|
|
10230
|
+
var RadioGroupContainer = /*#__PURE__*/styled.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 30px;\n"])));
|
|
9950
10231
|
|
|
9951
10232
|
/**
|
|
9952
10233
|
* DEPRECATED. Use RadioGroup2 instead
|
|
@@ -10001,9 +10282,9 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
10001
10282
|
})));
|
|
10002
10283
|
};
|
|
10003
10284
|
|
|
10004
|
-
var _templateObject$
|
|
10005
|
-
var Container$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
10006
|
-
var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$
|
|
10285
|
+
var _templateObject$1b, _templateObject2$V, _templateObject3$H;
|
|
10286
|
+
var Container$3 = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
10287
|
+
var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: flex-start;\n justify-content: flex-start;\n flex-direction: ", ";\n gap: ", ";\n"])), function (_ref) {
|
|
10007
10288
|
var horizontalMode = _ref.horizontalMode;
|
|
10008
10289
|
if (horizontalMode) return 'row';
|
|
10009
10290
|
return 'column';
|
|
@@ -10011,7 +10292,7 @@ var RadioGroup$1 = /*#__PURE__*/styled.div(_templateObject2$T || (_templateObjec
|
|
|
10011
10292
|
var gap = _ref2.gap;
|
|
10012
10293
|
return gap + "px";
|
|
10013
10294
|
});
|
|
10014
|
-
var ErrorLabel$4 = /*#__PURE__*/styled.div(_templateObject3$
|
|
10295
|
+
var ErrorLabel$4 = /*#__PURE__*/styled.div(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: ", ";\n"])), function (_ref3) {
|
|
10015
10296
|
var darkMode = _ref3.darkMode;
|
|
10016
10297
|
if (darkMode) return 'var(--base-color-white)';
|
|
10017
10298
|
return 'var(--base-color-errorstate)';
|
|
@@ -10088,10 +10369,10 @@ var RadioGroup2 = function RadioGroup2(_ref) {
|
|
|
10088
10369
|
}, error))));
|
|
10089
10370
|
};
|
|
10090
10371
|
|
|
10091
|
-
var _templateObject$
|
|
10092
|
-
var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
10093
|
-
var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$
|
|
10094
|
-
var SvgContainer$3 = /*#__PURE__*/styled.div(_templateObject3$
|
|
10372
|
+
var _templateObject$1c, _templateObject2$W, _templateObject3$I;
|
|
10373
|
+
var StatusBannerWrapper = /*#__PURE__*/styled.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-light-grey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
|
|
10374
|
+
var ContentContainer$3 = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.3s ease-in-out;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n"])));
|
|
10375
|
+
var SvgContainer$3 = /*#__PURE__*/styled.div(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n align-items: end;\n\n svg {\n width: var(--navigation-large-gap);\n height: var(--navigation-large-gap);\n padding-left: 50px;\n }\n\n cursor: pointer;\n\n @media ", " {\n padding-left: 20px;\n }\n"])), devices.mobile);
|
|
10095
10376
|
|
|
10096
10377
|
/* eslint-disable react/no-danger */
|
|
10097
10378
|
var StatusBanner = function StatusBanner(_ref) {
|
|
@@ -10147,8 +10428,8 @@ var StatusBanner = function StatusBanner(_ref) {
|
|
|
10147
10428
|
return null;
|
|
10148
10429
|
};
|
|
10149
10430
|
|
|
10150
|
-
var _templateObject$
|
|
10151
|
-
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
10431
|
+
var _templateObject$1d;
|
|
10432
|
+
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$1d || (_templateObject$1d = /*#__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);
|
|
10152
10433
|
|
|
10153
10434
|
var SectionTitle = function SectionTitle(_ref) {
|
|
10154
10435
|
var title = _ref.title,
|
|
@@ -10176,8 +10457,8 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
10176
10457
|
}, description)))));
|
|
10177
10458
|
};
|
|
10178
10459
|
|
|
10179
|
-
var _templateObject$
|
|
10180
|
-
var stateStyles = /*#__PURE__*/css(_templateObject$
|
|
10460
|
+
var _templateObject$1e, _templateObject2$X, _templateObject3$J, _templateObject4$B, _templateObject5$u, _templateObject6$o, _templateObject7$i, _templateObject8$d, _templateObject9$8, _templateObject10$8, _templateObject11$5;
|
|
10461
|
+
var stateStyles = /*#__PURE__*/css(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n &:focus,\n &.focus {\n outline: ", ";\n }\n\n &.disabled {\n background-color: ", ";\n color: ", ";\n pointer-events: none;\n cursor: none;\n }\n"])), function (_ref) {
|
|
10181
10462
|
var theme = _ref.theme;
|
|
10182
10463
|
return "3px solid " + theme.colors.lapisLazuli;
|
|
10183
10464
|
}, function (_ref2) {
|
|
@@ -10187,12 +10468,12 @@ var stateStyles = /*#__PURE__*/css(_templateObject$1c || (_templateObject$1c = /
|
|
|
10187
10468
|
var theme = _ref3.theme;
|
|
10188
10469
|
return theme.colors.lightgrey;
|
|
10189
10470
|
});
|
|
10190
|
-
var borderStyles = /*#__PURE__*/css(_templateObject2$
|
|
10471
|
+
var borderStyles = /*#__PURE__*/css(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-radius: 0;\n outline: 1px solid ", ";\n"])), function (_ref4) {
|
|
10191
10472
|
var theme = _ref4.theme;
|
|
10192
10473
|
return theme.colors.darkgrey;
|
|
10193
10474
|
});
|
|
10194
|
-
var noMarginAndPaddingStyles = /*#__PURE__*/css(_templateObject3$
|
|
10195
|
-
var listItemStyles = /*#__PURE__*/css(_templateObject4$
|
|
10475
|
+
var noMarginAndPaddingStyles = /*#__PURE__*/css(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
|
|
10476
|
+
var listItemStyles = /*#__PURE__*/css(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style: none;\n user-select: none;\n"])));
|
|
10196
10477
|
var ArrowIcon = /*#__PURE__*/styled(Icon).attrs(function (_ref5) {
|
|
10197
10478
|
var theme = _ref5.theme;
|
|
10198
10479
|
return {
|
|
@@ -10200,11 +10481,11 @@ var ArrowIcon = /*#__PURE__*/styled(Icon).attrs(function (_ref5) {
|
|
|
10200
10481
|
color: theme.colors.black,
|
|
10201
10482
|
title: 'Select Arrow'
|
|
10202
10483
|
};
|
|
10203
|
-
})(_templateObject5$
|
|
10204
|
-
var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject6$
|
|
10205
|
-
var SelectWrapper = /*#__PURE__*/styled.div(_templateObject7$
|
|
10206
|
-
var Options = /*#__PURE__*/styled.div(_templateObject8$
|
|
10207
|
-
var Option = /*#__PURE__*/styled.li(_templateObject9$
|
|
10484
|
+
})(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n pointer-events: none;\n\n max-width: 24px;\n max-height: 24px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n"])));
|
|
10485
|
+
var Wrapper$6 = /*#__PURE__*/styled.div(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: initial;\n\n display: flex;\n flex-direction: column;\n gap: 20px;\n"])), noMarginAndPaddingStyles);
|
|
10486
|
+
var SelectWrapper = /*#__PURE__*/styled.div(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n height: inherit;\n"])), noMarginAndPaddingStyles);
|
|
10487
|
+
var Options = /*#__PURE__*/styled.div(_templateObject8$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n z-index: 1;\n\n ", "\n ", "\n"])), noMarginAndPaddingStyles, borderStyles);
|
|
10488
|
+
var Option = /*#__PURE__*/styled.li(_templateObject9$8 || (_templateObject9$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
|
|
10208
10489
|
var theme = _ref6.theme,
|
|
10209
10490
|
hover = _ref6.hover;
|
|
10210
10491
|
var _theme$colors = theme.colors,
|
|
@@ -10214,9 +10495,9 @@ var Option = /*#__PURE__*/styled.li(_templateObject9$7 || (_templateObject9$7 =
|
|
|
10214
10495
|
return "\n background-color: " + lightgrey + ";\n &:hover { background-color: " + midgrey + " }\n ";
|
|
10215
10496
|
});
|
|
10216
10497
|
var selectStyles = function selectStyles(width, height) {
|
|
10217
|
-
return css(_templateObject10$
|
|
10498
|
+
return css(_templateObject10$8 || (_templateObject10$8 = _taggedTemplateLiteralLoose(["\n position: relative;\n z-index: ", ";\n\n width: ", ";\n height: ", ";\n\n * {\n width: ", ";\n }\n\n ", " {\n position: absolute;\n top: ", ";\n }\n ", " {\n height: ", ";\n }\n p {\n height: ", ";\n padding-inline: 20px;\n\n display: flex;\n align-items: center;\n }\n"])), zIndexes[3], width, height, width, Options, height, Option, height, height);
|
|
10218
10499
|
};
|
|
10219
|
-
var SelectList = /*#__PURE__*/styled.ul(_templateObject11$
|
|
10500
|
+
var SelectList = /*#__PURE__*/styled.ul(_templateObject11$5 || (_templateObject11$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n ", "\n ", "\n ", "\n\n & ", " {\n position: absolute;\n\n top: 13px;\n right: 16px;\n }\n"])), function (_ref7) {
|
|
10220
10501
|
var width = _ref7.width,
|
|
10221
10502
|
height = _ref7.height;
|
|
10222
10503
|
return selectStyles(width === 'default' ? "354px" : width + "px", height === 'default' ? "48px" : height + "px");
|
|
@@ -10557,9 +10838,9 @@ function Select(_ref3) {
|
|
|
10557
10838
|
})))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
|
|
10558
10839
|
}
|
|
10559
10840
|
|
|
10560
|
-
var _templateObject$
|
|
10561
|
-
var Container$4 = /*#__PURE__*/styled.div(_templateObject$
|
|
10562
|
-
var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$
|
|
10841
|
+
var _templateObject$1f, _templateObject2$Y, _templateObject3$K, _templateObject4$C;
|
|
10842
|
+
var Container$4 = /*#__PURE__*/styled.div(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
10843
|
+
var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .harmonic-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n .harmonic-select__control--is-focused {\n border-color: var(--base-color-dark-grey);\n box-shadow: ", ";\n }\n .harmonic-select__control--menu-is-open {\n .harmonic-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n .harmonic-select__indicator {\n font-size: 25px;\n padding: 0;\n margin-right: 12px;\n color: var(--base-color-black);\n svg {\n height: 1em;\n width: 1em;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n }\n .harmonic-select__single-value,\n .harmonic-select__placeholder {\n margin-left: 0;\n margin-right: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n }\n .harmonic-select__placeholder {\n color: var(--base-color-dark-grey);\n }\n .harmonic-select__single-value {\n color: var(--base-color-black);\n }\n .harmonic-select__value-container {\n padding-left: 20px;\n padding-right: 20px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n .harmonic-select--is-disabled {\n .harmonic-select__control {\n border: 1px solid var(--base-color-light-grey);\n background: var(--base-color-light-grey);\n }\n .harmonic-select__indicator,\n .harmonic-select__single-value {\n color: var(--base-color-dark-grey);\n }\n }\n .harmonic-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--base-color-dark-grey);\n background: var(--base-color-light-grey);\n }\n .harmonic-select__menu-list {\n padding-top: 0;\n padding-bottom: 0;\n }\n .harmonic-select__option {\n padding: 10px 20px;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n &:active,\n &.harmonic-select__option--is-focused {\n background: var(--base-color-mid-grey);\n }\n }\n .harmonic-select__option--is-selected {\n color: var(--base-color-black);\n background: none;\n }\n .harmonic-select__input-container {\n margin: 0;\n padding-top: 0;\n padding-bottom: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n }\n .harmonic-select__menu-notice {\n padding: 20px 20px;\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 letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n color: var(--base-color-black);\n text-align: left;\n }\n .harmonic-select__menu-notice--loading {\n font-style: italic;\n }\n"])), function (_ref) {
|
|
10563
10844
|
var width = _ref.width;
|
|
10564
10845
|
if (!width) return 'none';
|
|
10565
10846
|
return width + "px";
|
|
@@ -10576,18 +10857,18 @@ var SelectWrapper$1 = /*#__PURE__*/styled.div(_templateObject2$W || (_templateOb
|
|
|
10576
10857
|
if (darkMode) return "0 0 0 4px var(--base-color-lemonchiffon)";
|
|
10577
10858
|
return "0 0 0 3px var(--base-color-lapislazuli)";
|
|
10578
10859
|
});
|
|
10579
|
-
var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$
|
|
10860
|
+
var TextLabel$4 = /*#__PURE__*/styled.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0 20px;\n color: ", ";\n"])), function (_ref5) {
|
|
10580
10861
|
var darkMode = _ref5.darkMode;
|
|
10581
10862
|
if (darkMode) return "var(--base-color-white)";
|
|
10582
10863
|
return "var(--base-color-black)";
|
|
10583
10864
|
});
|
|
10584
|
-
var ErrorLabel$5 = /*#__PURE__*/styled.div(_templateObject4$
|
|
10865
|
+
var ErrorLabel$5 = /*#__PURE__*/styled.div(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 20px 0 0;\n color: ", ";\n"])), function (_ref6) {
|
|
10585
10866
|
var darkMode = _ref6.darkMode;
|
|
10586
10867
|
if (darkMode) return "var(--base-color-white)";
|
|
10587
10868
|
return "var(--base-color-errorstate)";
|
|
10588
10869
|
});
|
|
10589
10870
|
|
|
10590
|
-
var _excluded$
|
|
10871
|
+
var _excluded$t = ["label", "error", "width", "darkMode", "isSearchable", "components"];
|
|
10591
10872
|
var DropdownIndicator = function DropdownIndicator(props) {
|
|
10592
10873
|
return /*#__PURE__*/React__default.createElement(components.DropdownIndicator, Object.assign({}, props), /*#__PURE__*/React__default.createElement(Icon, {
|
|
10593
10874
|
iconName: "DropdownArrow"
|
|
@@ -10638,7 +10919,7 @@ var SelectComponent = function SelectComponent(_ref2) {
|
|
|
10638
10919
|
_ref2$isSearchable = _ref2.isSearchable,
|
|
10639
10920
|
isSearchable = _ref2$isSearchable === void 0 ? false : _ref2$isSearchable,
|
|
10640
10921
|
components = _ref2.components,
|
|
10641
|
-
selectProps = _objectWithoutPropertiesLoose(_ref2, _excluded$
|
|
10922
|
+
selectProps = _objectWithoutPropertiesLoose(_ref2, _excluded$t);
|
|
10642
10923
|
return /*#__PURE__*/React__default.createElement(WrapperComponent, {
|
|
10643
10924
|
label: label,
|
|
10644
10925
|
error: error,
|
|
@@ -10656,7 +10937,7 @@ var SelectComponent = function SelectComponent(_ref2) {
|
|
|
10656
10937
|
})));
|
|
10657
10938
|
};
|
|
10658
10939
|
|
|
10659
|
-
var _excluded$
|
|
10940
|
+
var _excluded$u = ["label", "error", "width", "darkMode", "components"];
|
|
10660
10941
|
/**
|
|
10661
10942
|
* The Select2Async component is similar to Select 2, but uses react-select async
|
|
10662
10943
|
* component for select instead of regular react-select component. This can be used
|
|
@@ -10678,7 +10959,7 @@ var SelectComponent$1 = function SelectComponent(_ref) {
|
|
|
10678
10959
|
_ref$darkMode = _ref.darkMode,
|
|
10679
10960
|
darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
|
|
10680
10961
|
components = _ref.components,
|
|
10681
|
-
selectProps = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
10962
|
+
selectProps = _objectWithoutPropertiesLoose(_ref, _excluded$u);
|
|
10682
10963
|
return /*#__PURE__*/React__default.createElement(WrapperComponent, {
|
|
10683
10964
|
label: label,
|
|
10684
10965
|
error: error,
|
|
@@ -10695,8 +10976,8 @@ var SelectComponent$1 = function SelectComponent(_ref) {
|
|
|
10695
10976
|
})));
|
|
10696
10977
|
};
|
|
10697
10978
|
|
|
10698
|
-
var _templateObject$
|
|
10699
|
-
var Wrapper$7 = /*#__PURE__*/styled.figure(_templateObject$
|
|
10979
|
+
var _templateObject$1g, _templateObject2$Z;
|
|
10980
|
+
var Wrapper$7 = /*#__PURE__*/styled.figure(_templateObject$1g || (_templateObject$1g = /*#__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"])), StyledImageAspectRatioWrapper, function (_ref) {
|
|
10700
10981
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
10701
10982
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
10702
10983
|
return aspectRatio;
|
|
@@ -10706,7 +10987,7 @@ var Wrapper$7 = /*#__PURE__*/styled.figure(_templateObject$1e || (_templateObjec
|
|
|
10706
10987
|
height = _ref2.height;
|
|
10707
10988
|
return "calc(calc(" + height + "px - 12px - var(--line-height-body-2)) * " + AspectRatioWidth[aspectRatio] + ")";
|
|
10708
10989
|
});
|
|
10709
|
-
var CaptionWrapper = /*#__PURE__*/styled.figcaption(_templateObject2$
|
|
10990
|
+
var CaptionWrapper = /*#__PURE__*/styled.figcaption(_templateObject2$Z || (_templateObject2$Z = /*#__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"])));
|
|
10710
10991
|
|
|
10711
10992
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
10712
10993
|
var caption = _ref.caption,
|
|
@@ -10740,13 +11021,13 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
10740
11021
|
})), caption && /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
10741
11022
|
};
|
|
10742
11023
|
|
|
10743
|
-
var _templateObject$
|
|
10744
|
-
var TextWrapper$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
10745
|
-
var AttributionWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
11024
|
+
var _templateObject$1h, _templateObject2$_, _templateObject3$L;
|
|
11025
|
+
var TextWrapper$3 = /*#__PURE__*/styled.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
|
|
11026
|
+
var AttributionWrapper = /*#__PURE__*/styled.div(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
10746
11027
|
var displayAttribution = _ref.displayAttribution;
|
|
10747
11028
|
return "display: " + (displayAttribution ? 'block' : 'none') + ";";
|
|
10748
11029
|
});
|
|
10749
|
-
var Line$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
11030
|
+
var Line$1 = /*#__PURE__*/styled.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n height: 2px;\n width: 62px;\n margin: 32px 0;\n\n @media ", " {\n height: 1px;\n width: 46px;\n margin: 24px 0;\n }\n"])), devices.mobile);
|
|
10750
11031
|
|
|
10751
11032
|
/* eslint-disable react/no-danger */
|
|
10752
11033
|
var Quote = function Quote(_ref) {
|
|
@@ -10771,13 +11052,13 @@ var Quote = function Quote(_ref) {
|
|
|
10771
11052
|
}, attribution))));
|
|
10772
11053
|
};
|
|
10773
11054
|
|
|
10774
|
-
var _templateObject$
|
|
10775
|
-
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
10776
|
-
var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2
|
|
10777
|
-
var StyledImage = /*#__PURE__*/styled.img(_templateObject3$
|
|
10778
|
-
var ImageWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$
|
|
10779
|
-
var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$
|
|
10780
|
-
var TitleWrapper$
|
|
11055
|
+
var _templateObject$1i, _templateObject2$$, _templateObject3$M, _templateObject4$D, _templateObject5$v, _templateObject6$p;
|
|
11056
|
+
var CardContainer$1 = /*#__PURE__*/styled.div(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n width: 100%;\n display: grid;\n grid-template-columns: repeat(7, minmax(0, 1fr));\n gap: 15px;\n min-height: 50px;\n"])));
|
|
11057
|
+
var ContentContainer$4 = /*#__PURE__*/styled.div(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
11058
|
+
var StyledImage = /*#__PURE__*/styled.img(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
11059
|
+
var ImageWrapper$1 = /*#__PURE__*/styled.div(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
11060
|
+
var IconWrapper$3 = /*#__PURE__*/styled.div(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
11061
|
+
var TitleWrapper$4 = /*#__PURE__*/styled.div(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
|
|
10781
11062
|
|
|
10782
11063
|
var MiniCard = function MiniCard(_ref) {
|
|
10783
11064
|
var _ref$title = _ref.title,
|
|
@@ -10810,23 +11091,23 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
10810
11091
|
columnSpanDesktop: 4
|
|
10811
11092
|
}, /*#__PURE__*/React__default.createElement(ContentContainer$4, null, /*#__PURE__*/React__default.createElement(Overline, {
|
|
10812
11093
|
level: 4
|
|
10813
|
-
}, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$
|
|
11094
|
+
}, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$4, null, /*#__PURE__*/React__default.createElement(Overline, {
|
|
10814
11095
|
level: 2
|
|
10815
11096
|
}, title)))));
|
|
10816
11097
|
};
|
|
10817
11098
|
|
|
10818
|
-
var _templateObject$
|
|
10819
|
-
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$
|
|
10820
|
-
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$
|
|
10821
|
-
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$
|
|
11099
|
+
var _templateObject$1j, _templateObject2$10, _templateObject3$N, _templateObject4$E, _templateObject5$w;
|
|
11100
|
+
var ReadMoreContainer = /*#__PURE__*/styled.div(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0px 0px 12px 0px !important;\n }\n width: 100%;\n"])));
|
|
11101
|
+
var LinkContainer = /*#__PURE__*/styled.div(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n\n @media print {\n visibility: hidden;\n }\n"])));
|
|
11102
|
+
var FullTextContainer = /*#__PURE__*/styled.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: visible;\n }\n"])), function (_ref) {
|
|
10822
11103
|
var isVisible = _ref.isVisible;
|
|
10823
11104
|
return isVisible ? 'visible' : 'hidden';
|
|
10824
11105
|
});
|
|
10825
|
-
var IntroTextContainer = /*#__PURE__*/styled.div(_templateObject4$
|
|
11106
|
+
var IntroTextContainer = /*#__PURE__*/styled.div(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n visibility: ", ";\n\n @media print {\n visibility: hidden;\n }\n"])), function (_ref2) {
|
|
10826
11107
|
var isVisible = _ref2.isVisible;
|
|
10827
11108
|
return isVisible ? 'visible' : 'hidden';
|
|
10828
11109
|
});
|
|
10829
|
-
var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject5$
|
|
11110
|
+
var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n @media print {\n visibility: visible;\n max-height: 900px !important;\n }\n"])));
|
|
10830
11111
|
|
|
10831
11112
|
var keyDown = function keyDown(e, toggleFunction) {
|
|
10832
11113
|
if (e.key === 'Enter' || e.key === 'Space') {
|
|
@@ -10907,15 +11188,15 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
10907
11188
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText))));
|
|
10908
11189
|
};
|
|
10909
11190
|
|
|
10910
|
-
var _templateObject$
|
|
10911
|
-
var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$
|
|
10912
|
-
var MenuList = /*#__PURE__*/styled.ul(_templateObject2
|
|
10913
|
-
var MobileButton = /*#__PURE__*/styled.button(_templateObject3$
|
|
10914
|
-
var MenuItem$1 = /*#__PURE__*/styled.a(_templateObject4$
|
|
11191
|
+
var _templateObject$1k, _templateObject2$11, _templateObject3$O, _templateObject4$F, _templateObject5$x;
|
|
11192
|
+
var MenuContainer$2 = /*#__PURE__*/styled.nav(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
11193
|
+
var MenuList = /*#__PURE__*/styled.ul(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n }\n"])), Colors.LightGrey);
|
|
11194
|
+
var MobileButton = /*#__PURE__*/styled.button(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 46px 14px 20px;\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n cursor: pointer;\n position: relative;\n span {\n width: 25px;\n height: 25px;\n position: absolute;\n top: 50%;\n margin-top: -12px;\n right: 10px;\n }\n"])), Colors.Black, Colors.White, Colors.DarkGrey);
|
|
11195
|
+
var MenuItem$1 = /*#__PURE__*/styled.a(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n text-decoration: none;\n margin: 0;\n padding: 16px 20px 15px 5px;\n display: block;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n"])), Colors.Black, function (_ref) {
|
|
10915
11196
|
var isActive = _ref.isActive;
|
|
10916
11197
|
return isActive ? "var(--base-color-" + Colors.MidGrey + ")" : 'none';
|
|
10917
11198
|
}, Colors.MidGrey);
|
|
10918
|
-
var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$
|
|
11199
|
+
var MobileMenuList = /*#__PURE__*/styled.ul(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), function (_ref2) {
|
|
10919
11200
|
var isOpen = _ref2.isOpen;
|
|
10920
11201
|
return isOpen ? 'block' : 'none';
|
|
10921
11202
|
}, Colors.White, Colors.DarkGrey, MenuItem$1);
|
|
@@ -11071,19 +11352,19 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
|
|
|
11071
11352
|
});
|
|
11072
11353
|
};
|
|
11073
11354
|
|
|
11074
|
-
var _templateObject$
|
|
11075
|
-
var Container$5 = /*#__PURE__*/styled.div(_templateObject$
|
|
11076
|
-
var Sections = /*#__PURE__*/styled.div(_templateObject2$
|
|
11077
|
-
var Section = /*#__PURE__*/styled.div(_templateObject3$
|
|
11355
|
+
var _templateObject$1l, _templateObject2$12, _templateObject3$P, _templateObject4$G, _templateObject5$y, _templateObject6$q;
|
|
11356
|
+
var Container$5 = /*#__PURE__*/styled.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
11357
|
+
var Sections = /*#__PURE__*/styled.div(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
11358
|
+
var Section = /*#__PURE__*/styled.div(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
11078
11359
|
var color = _ref.color;
|
|
11079
11360
|
return "var(--base-color-" + color + ")";
|
|
11080
11361
|
});
|
|
11081
|
-
var BottomLine = /*#__PURE__*/styled.div(_templateObject4$
|
|
11082
|
-
var Text = /*#__PURE__*/styled.div(_templateObject5$
|
|
11362
|
+
var BottomLine = /*#__PURE__*/styled.div(_templateObject4$G || (_templateObject4$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
11363
|
+
var Text = /*#__PURE__*/styled.div(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
11083
11364
|
var color = _ref2.color;
|
|
11084
11365
|
return "var(--base-color-" + color + ")";
|
|
11085
11366
|
});
|
|
11086
|
-
var LabelText = /*#__PURE__*/styled.div(_templateObject6$
|
|
11367
|
+
var LabelText = /*#__PURE__*/styled.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 1px;\n white-space: nowrap;\n color: ", ";\n"])), function (_ref3) {
|
|
11087
11368
|
var color = _ref3.color;
|
|
11088
11369
|
return "var(--base-color-" + color + ")";
|
|
11089
11370
|
});
|
|
@@ -11165,28 +11446,28 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
11165
11446
|
}, strengthLabel))));
|
|
11166
11447
|
};
|
|
11167
11448
|
|
|
11168
|
-
var _templateObject$
|
|
11169
|
-
var TableContainer = /*#__PURE__*/styled.table(_templateObject$
|
|
11170
|
-
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$
|
|
11171
|
-
var Wrapper$8 = /*#__PURE__*/styled.div(_templateObject3$
|
|
11172
|
-
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$
|
|
11449
|
+
var _templateObject$1m, _templateObject2$13, _templateObject3$Q, _templateObject4$H, _templateObject5$z, _templateObject6$r, _templateObject7$j, _templateObject8$e, _templateObject9$9, _templateObject10$9;
|
|
11450
|
+
var TableContainer = /*#__PURE__*/styled.table(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
11451
|
+
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
11452
|
+
var Wrapper$8 = /*#__PURE__*/styled.div(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
11453
|
+
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-subtitle-2);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n padding: 30px 30px 30px 0;\n text-align: left;\n text-transform: uppercase;\n border-bottom: 1px solid;\n border-top: 1px solid;\n border-color: ", ";\n\n &:last-child {\n white-space: nowrap;\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n @media ", " {\n &:last-child {\n white-space: nowrap;\n }\n }\n\n @media ", " {\n padding: 20px 20px 20px 0;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
|
|
11173
11454
|
return "var(--base-color-" + props.lineColor + ")";
|
|
11174
11455
|
}, function (props) {
|
|
11175
11456
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
11176
11457
|
}, devices.tablet, devices.mobile);
|
|
11177
|
-
var TableCell = /*#__PURE__*/styled.td(_templateObject5$
|
|
11458
|
+
var TableCell = /*#__PURE__*/styled.td(_templateObject5$z || (_templateObject5$z = /*#__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 padding: 30px 30px 30px 0;\n text-align: left;\n vertical-align: top;\n border-bottom: 1px solid;\n border-color: ", ";\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n padding: 20px 20px 20px 0;\n }\n"])), function (props) {
|
|
11178
11459
|
return "var(--base-color-" + props.lineColor + ")";
|
|
11179
11460
|
}, function (props) {
|
|
11180
11461
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
11181
11462
|
}, devices.mobile);
|
|
11182
|
-
var Pagination$1 = /*#__PURE__*/styled.div(_templateObject6$
|
|
11183
|
-
var PageNumber$1 = /*#__PURE__*/styled.button(_templateObject7$
|
|
11463
|
+
var Pagination$1 = /*#__PURE__*/styled.div(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 40px 0;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: none;\n }\n"])));
|
|
11464
|
+
var PageNumber$1 = /*#__PURE__*/styled.button(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: none;\n border: none;\n padding: 0;\n font-size: inherit;\n color: inherit;\n cursor: pointer;\n display: inline-block;\n margin: 0;\n border-bottom: 1px solid var(--base-color-transparent);\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n\n :hover {\n outline: none;\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n\n /* Active state */\n ", "\n"])), function (_ref) {
|
|
11184
11465
|
var active = _ref.active;
|
|
11185
11466
|
return active === 'true' && "\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n ";
|
|
11186
11467
|
});
|
|
11187
|
-
var Next = /*#__PURE__*/styled.span(_templateObject8$
|
|
11188
|
-
var ScrollButtons = /*#__PURE__*/styled.div(_templateObject9$
|
|
11189
|
-
var AriaDescription$2 = /*#__PURE__*/styled.span(_templateObject10$
|
|
11468
|
+
var Next = /*#__PURE__*/styled.span(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n width: 25px;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n span {\n height: 1.5em;\n svg > path {\n fill: var(--base-color-dark-grey);\n }\n }\n"])));
|
|
11469
|
+
var ScrollButtons = /*#__PURE__*/styled.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 0 0 24px 0;\n\n div:hover {\n background-color: var(--base-color-light-grey);\n }\n\n > div > div {\n background-color: var(--base-color-light-grey);\n }\n\n svg path {\n fill: var(--base-color-black) !important;\n }\n"])));
|
|
11470
|
+
var AriaDescription$2 = /*#__PURE__*/styled.span(_templateObject10$9 || (_templateObject10$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n"])));
|
|
11190
11471
|
|
|
11191
11472
|
/* eslint-disable react/no-danger */
|
|
11192
11473
|
var Content = function Content(_ref) {
|
|
@@ -11369,32 +11650,32 @@ var Table = function Table(_ref) {
|
|
|
11369
11650
|
}))))))))));
|
|
11370
11651
|
};
|
|
11371
11652
|
|
|
11372
|
-
var _templateObject$
|
|
11373
|
-
var Wrapper$9 = /*#__PURE__*/styled('div')(_templateObject$
|
|
11653
|
+
var _templateObject$1n, _templateObject2$14, _templateObject3$R, _templateObject4$I, _templateObject5$A, _templateObject6$s, _templateObject7$k, _templateObject8$f, _templateObject9$a, _templateObject10$a, _templateObject11$6, _templateObject12$4, _templateObject13$4, _templateObject14$4, _templateObject15$3;
|
|
11654
|
+
var Wrapper$9 = /*#__PURE__*/styled('div')(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n border-top: 4px solid ", ";\n border-bottom: 4px solid ", ";\n"])), function (_ref) {
|
|
11374
11655
|
var theme = _ref.theme;
|
|
11375
11656
|
return "var(--base-color-" + theme + ")";
|
|
11376
11657
|
}, function (_ref2) {
|
|
11377
11658
|
var theme = _ref2.theme;
|
|
11378
11659
|
return "var(--base-color-" + theme + ")";
|
|
11379
11660
|
});
|
|
11380
|
-
var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
11381
|
-
var SignUpTitleWrapper = /*#__PURE__*/styled('div')(_templateObject3$
|
|
11382
|
-
var Error$1 = /*#__PURE__*/styled.div(_templateObject4$
|
|
11383
|
-
var Form = /*#__PURE__*/styled.form(_templateObject5$
|
|
11384
|
-
var FormFooterWrapper = /*#__PURE__*/styled.div(_templateObject6$
|
|
11385
|
-
var ServerError = /*#__PURE__*/styled.div(_templateObject7$
|
|
11386
|
-
var CTALinkWrapper = /*#__PURE__*/styled.a(_templateObject8$
|
|
11387
|
-
var ButtonWrapper$3 = /*#__PURE__*/styled.button(_templateObject9$
|
|
11388
|
-
var FieldsWrapper = /*#__PURE__*/styled.div(_templateObject10$
|
|
11389
|
-
var MessageWrapper$1 = /*#__PURE__*/styled.div(_templateObject11$
|
|
11390
|
-
var DropdownAreaWrapper = /*#__PURE__*/styled.div(_templateObject12$
|
|
11391
|
-
var DropdownWrapper = /*#__PURE__*/styled.div(_templateObject13$
|
|
11661
|
+
var SignUpFormWrapper = /*#__PURE__*/styled(Grid)(_templateObject2$14 || (_templateObject2$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n gap: 0 var(--grid-column-gap);\n margin-bottom: 32px;\n\n @media ", " {\n margin-bottom: 30px;\n }\n"])), devices.mobile);
|
|
11662
|
+
var SignUpTitleWrapper = /*#__PURE__*/styled('div')(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n position: relative;\n top: -25px;\n left: -20px;\n height: 52px;\n background: var(--base-color-white);\n display: inline-block;\n padding: 0 20px;\n\n @media ", " {\n top: -18px;\n height: 37px;\n padding: 0 13px;\n left: -13px;\n }\n"])), devices.mobile);
|
|
11663
|
+
var Error$1 = /*#__PURE__*/styled.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 20px;\n color: var(--base-color-errorstate);\n a {\n text-decoration: underline;\n color: inherit;\n }\n"])));
|
|
11664
|
+
var Form = /*#__PURE__*/styled.form(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n align-items: center;\n ", " {\n margin-top: -20px;\n }\n a[href] {\n color: inherit;\n }\n"])), Error$1);
|
|
11665
|
+
var FormFooterWrapper = /*#__PURE__*/styled.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 32px;\n display: flex;\n gap: 28px;\n align-items: center;\n\n @media ", " {\n flex-direction: column;\n align-items: flex-start;\n }\n"])), devices.mobile);
|
|
11666
|
+
var ServerError = /*#__PURE__*/styled.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-align: left;\n color: var(--base-color-errorstate);\n"])));
|
|
11667
|
+
var CTALinkWrapper = /*#__PURE__*/styled.a(_templateObject8$f || (_templateObject8$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-black);\n div {\n text-decoration: underline;\n }\n"])));
|
|
11668
|
+
var ButtonWrapper$3 = /*#__PURE__*/styled.button(_templateObject9$a || (_templateObject9$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n all: unset;\n width: fit-content;\n\n @media ", " {\n width: 100%;\n }\n &:focus {\n outline: 3px solid var(--base-color-lapislazuli);\n }\n"])), devices.mobile);
|
|
11669
|
+
var FieldsWrapper = /*#__PURE__*/styled.div(_templateObject10$a || (_templateObject10$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 36px;\n\n @media ", " {\n grid-template-columns: 1fr;\n gap: 20px;\n }\n"])), devices.mobile);
|
|
11670
|
+
var MessageWrapper$1 = /*#__PURE__*/styled.div(_templateObject11$6 || (_templateObject11$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n div > p {\n margin: 0;\n }\n"])));
|
|
11671
|
+
var DropdownAreaWrapper = /*#__PURE__*/styled.div(_templateObject12$4 || (_templateObject12$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1 / -1;\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n gap: var(--grid-column-gap);\n cursor: pointer;\n"])));
|
|
11672
|
+
var DropdownWrapper = /*#__PURE__*/styled.div(_templateObject13$4 || (_templateObject13$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n width: fit-content;\n transform: rotate(", ");\n .dropdown-icon > div {\n border-bottom: none;\n color: var(--base-color-black);\n margin: 0;\n }\n"])), function (_ref3) {
|
|
11392
11673
|
var _ref3$isOpen = _ref3.isOpen,
|
|
11393
11674
|
isOpen = _ref3$isOpen === void 0 ? false : _ref3$isOpen;
|
|
11394
11675
|
return isOpen ? '180deg' : '0deg';
|
|
11395
11676
|
});
|
|
11396
|
-
var HiddenInstructions = /*#__PURE__*/styled.div(_templateObject14$
|
|
11397
|
-
var SignUpHeader = /*#__PURE__*/styled(Grid)(_templateObject15$
|
|
11677
|
+
var HiddenInstructions = /*#__PURE__*/styled.div(_templateObject14$4 || (_templateObject14$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n border: 0;\n"])));
|
|
11678
|
+
var SignUpHeader = /*#__PURE__*/styled(Grid)(_templateObject15$3 || (_templateObject15$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-column: 1 / -1;\n row-gap: 0;\n"])));
|
|
11398
11679
|
|
|
11399
11680
|
var regex = {
|
|
11400
11681
|
signInEmail:
|
|
@@ -11759,6 +12040,157 @@ var SignUpFormComponent = function SignUpFormComponent(_ref5) {
|
|
|
11759
12040
|
var _BUTTONS_STYLE_VALUES;
|
|
11760
12041
|
// Text color, Background color, Border color, Hovered color
|
|
11761
12042
|
var BUTTONS_STYLE_VALUES = (_BUTTONS_STYLE_VALUES = {}, _BUTTONS_STYLE_VALUES[ButtonType.Primary] = [ThemeColor['base-black'], ThemeColor['base-white'], ThemeColor['base-black'], ThemeColor['white-hovered'], ThemeColor['white-pressed']], _BUTTONS_STYLE_VALUES[ButtonType.Secondary] = [ThemeColor['base-white'], ThemeColor['base-black'], ThemeColor['base-white'], ThemeColor['white-hovered'], ThemeColor['white-pressed']], _BUTTONS_STYLE_VALUES[ButtonType.Tertiary] = [ThemeColor['base-white'], ThemeColor['base-white'], ThemeColor['base-black'], ThemeColor['white-hovered'], ThemeColor['white-pressed']], _BUTTONS_STYLE_VALUES);
|
|
12043
|
+
var getLinkStyle = function getLinkStyle(link, defaultTextColor, defaultBackgroundColor, defaultBorderColor, defaultHoveredColor, defaultPressedColor) {
|
|
12044
|
+
var _link$textColor, _link$backgroundColor, _link$borderColor, _link$hoveredColor, _link$pressedColor;
|
|
12045
|
+
return {
|
|
12046
|
+
textColor: (_link$textColor = link.textColor) != null ? _link$textColor : defaultTextColor,
|
|
12047
|
+
backgroundColor: (_link$backgroundColor = link.backgroundColor) != null ? _link$backgroundColor : defaultBackgroundColor,
|
|
12048
|
+
borderColor: (_link$borderColor = link.borderColor) != null ? _link$borderColor : defaultBorderColor,
|
|
12049
|
+
hoveredColor: (_link$hoveredColor = link.hoveredColor) != null ? _link$hoveredColor : defaultHoveredColor,
|
|
12050
|
+
pressedColor: (_link$pressedColor = link.pressedColor) != null ? _link$pressedColor : defaultPressedColor
|
|
12051
|
+
};
|
|
12052
|
+
};
|
|
12053
|
+
var processSlideLinks = function processSlideLinks(links) {
|
|
12054
|
+
return links.flatMap(function (link) {
|
|
12055
|
+
if (!link) return [];
|
|
12056
|
+
var linkStyle = link.buttonType ? getLinkStyle.apply(void 0, [link].concat(BUTTONS_STYLE_VALUES[link.buttonType])) : {};
|
|
12057
|
+
return _extends({}, link, linkStyle);
|
|
12058
|
+
});
|
|
12059
|
+
};
|
|
12060
|
+
var isVideoSlide = function isVideoSlide(slideMedia) {
|
|
12061
|
+
return slideMedia.video !== undefined;
|
|
12062
|
+
};
|
|
12063
|
+
|
|
12064
|
+
var VideoSlide = function VideoSlide(_ref) {
|
|
12065
|
+
var index = _ref.index,
|
|
12066
|
+
settings = _ref.settings,
|
|
12067
|
+
isCurrentSlide = _ref.isCurrentSlide;
|
|
12068
|
+
var viewport = useViewport();
|
|
12069
|
+
var videoComponentId = settings.key + "-video-" + index;
|
|
12070
|
+
var videoUrl = viewport.isMobile ? settings.video.mobile : settings.video.desktop;
|
|
12071
|
+
var posterUrl = viewport.isMobile ? settings.poster.mobile : settings.poster.desktop;
|
|
12072
|
+
// eslint-disable-next-line jsx-a11y/media-has-caption
|
|
12073
|
+
var video = /*#__PURE__*/React__default.createElement("video", {
|
|
12074
|
+
id: videoComponentId,
|
|
12075
|
+
src: videoUrl,
|
|
12076
|
+
poster: posterUrl
|
|
12077
|
+
});
|
|
12078
|
+
return /*#__PURE__*/React__default.createElement(VideoWithControlsWrapper, {
|
|
12079
|
+
isCurrentSlide: isCurrentSlide
|
|
12080
|
+
}, /*#__PURE__*/React__default.createElement(VideoWithControls$1, {
|
|
12081
|
+
video: video,
|
|
12082
|
+
settings: settings
|
|
12083
|
+
}));
|
|
12084
|
+
};
|
|
12085
|
+
var SwipeCarousel = function SwipeCarousel(_ref2) {
|
|
12086
|
+
var slidesMedia = _ref2.slidesMedia,
|
|
12087
|
+
currentSlide = _ref2.currentSlide,
|
|
12088
|
+
carouselRef = _ref2.carouselRef,
|
|
12089
|
+
hasMultipleSlides = _ref2.hasMultipleSlides,
|
|
12090
|
+
setCurrentSlide = _ref2.setCurrentSlide;
|
|
12091
|
+
var hasOnlyImageSlides = slidesMedia.every(function (slide) {
|
|
12092
|
+
return !isVideoSlide(slide);
|
|
12093
|
+
});
|
|
12094
|
+
return /*#__PURE__*/React__default.createElement(Swipe, {
|
|
12095
|
+
ref: carouselRef,
|
|
12096
|
+
infinite: hasMultipleSlides && hasOnlyImageSlides,
|
|
12097
|
+
onIndexChange: setCurrentSlide,
|
|
12098
|
+
"aria-roledescription": "carousel"
|
|
12099
|
+
}, slidesMedia.map(function (mediaContent, index) {
|
|
12100
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
12101
|
+
className: "swiper-slide",
|
|
12102
|
+
key: mediaContent.key,
|
|
12103
|
+
"aria-hidden": index !== currentSlide,
|
|
12104
|
+
"aria-roledescription": "slide"
|
|
12105
|
+
}, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
|
|
12106
|
+
aspectRatio: AspectRatio['4:3']
|
|
12107
|
+
}, isVideoSlide(mediaContent) ? (/*#__PURE__*/React__default.createElement(VideoSlide, {
|
|
12108
|
+
settings: mediaContent,
|
|
12109
|
+
index: index,
|
|
12110
|
+
isCurrentSlide: index === currentSlide
|
|
12111
|
+
})) : (/*#__PURE__*/React__default.createElement("img", Object.assign({
|
|
12112
|
+
alt: mediaContent.alt
|
|
12113
|
+
}, mediaContent)))));
|
|
12114
|
+
}));
|
|
12115
|
+
};
|
|
12116
|
+
|
|
12117
|
+
var HighlightsCarousel = function HighlightsCarousel(_ref) {
|
|
12118
|
+
var logo = _ref.logo,
|
|
12119
|
+
carouselTitle = _ref.carouselTitle,
|
|
12120
|
+
slides = _ref.slides,
|
|
12121
|
+
titleSemanticLevel = _ref.titleSemanticLevel,
|
|
12122
|
+
className = _ref.className;
|
|
12123
|
+
var slidesMedia = useMemo(function () {
|
|
12124
|
+
return slides.map(function (_ref2) {
|
|
12125
|
+
var mediaContent = _ref2.mediaContent;
|
|
12126
|
+
return mediaContent;
|
|
12127
|
+
});
|
|
12128
|
+
}, []);
|
|
12129
|
+
var _useState = useState(0),
|
|
12130
|
+
currentSlide = _useState[0],
|
|
12131
|
+
setCurrentSlide = _useState[1];
|
|
12132
|
+
var currentSlideData = slides[currentSlide];
|
|
12133
|
+
var links = currentSlideData.links,
|
|
12134
|
+
auxiliaryCTA = currentSlideData.auxiliaryCTA;
|
|
12135
|
+
var hasMultipleSlides = slidesMedia.length > 1;
|
|
12136
|
+
var hasOnlyImageSlides = slidesMedia.every(function (slide) {
|
|
12137
|
+
return !isVideoSlide(slide);
|
|
12138
|
+
});
|
|
12139
|
+
var carouselTitleId = "highlights-carousel-title-" + carouselTitle;
|
|
12140
|
+
var carouselRef = useRef(null);
|
|
12141
|
+
var onNext = function onNext() {
|
|
12142
|
+
var _carouselRef$current;
|
|
12143
|
+
return (_carouselRef$current = carouselRef.current) == null ? void 0 : _carouselRef$current.nextSlide();
|
|
12144
|
+
};
|
|
12145
|
+
var onPrev = function onPrev() {
|
|
12146
|
+
var _carouselRef$current2;
|
|
12147
|
+
return (_carouselRef$current2 = carouselRef.current) == null ? void 0 : _carouselRef$current2.prevSlide();
|
|
12148
|
+
};
|
|
12149
|
+
var handleClickInside = function handleClickInside(e) {
|
|
12150
|
+
e.stopPropagation();
|
|
12151
|
+
};
|
|
12152
|
+
return /*#__PURE__*/React__default.createElement(HighlightsGrid, {
|
|
12153
|
+
role: "region",
|
|
12154
|
+
"aria-labelledby": carouselTitleId,
|
|
12155
|
+
onClick: handleClickInside,
|
|
12156
|
+
className: className
|
|
12157
|
+
}, /*#__PURE__*/React__default.createElement(CarouselTitleWrapper, {
|
|
12158
|
+
"data-testid": "carousel-title"
|
|
12159
|
+
}, /*#__PURE__*/React__default.createElement(HeaderWrapper, {
|
|
12160
|
+
id: carouselTitleId
|
|
12161
|
+
}, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
|
|
12162
|
+
size: "small",
|
|
12163
|
+
serif: true,
|
|
12164
|
+
hierarchy: "h" + titleSemanticLevel
|
|
12165
|
+
}, carouselTitle))), hasMultipleSlides && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapperMobile, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
12166
|
+
onClickNext: onNext,
|
|
12167
|
+
onClickPrev: onPrev
|
|
12168
|
+
}))), /*#__PURE__*/React__default.createElement(InfoWrapper, {
|
|
12169
|
+
"data-testid": "info-wrapper"
|
|
12170
|
+
}, /*#__PURE__*/React__default.createElement(InfoSection, {
|
|
12171
|
+
logo: logo,
|
|
12172
|
+
slide: currentSlideData,
|
|
12173
|
+
currentSlideIndex: currentSlide
|
|
12174
|
+
}), /*#__PURE__*/React__default.createElement(Buttons, {
|
|
12175
|
+
links: links,
|
|
12176
|
+
auxiliaryCTA: auxiliaryCTA
|
|
12177
|
+
})), /*#__PURE__*/React__default.createElement(CarouselWrapper, {
|
|
12178
|
+
"data-testid": "carousel-wrapper"
|
|
12179
|
+
}, hasMultipleSlides && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapper, {
|
|
12180
|
+
"data-testid": "rotator-buttons"
|
|
12181
|
+
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
12182
|
+
onClickNext: onNext,
|
|
12183
|
+
onClickPrev: onPrev,
|
|
12184
|
+
availablePrev: hasOnlyImageSlides || currentSlide !== 0,
|
|
12185
|
+
availableNext: hasOnlyImageSlides || currentSlide !== slidesMedia.length - 1
|
|
12186
|
+
}))), /*#__PURE__*/React__default.createElement(SwipeCarousel, {
|
|
12187
|
+
slidesMedia: slidesMedia,
|
|
12188
|
+
hasMultipleSlides: hasMultipleSlides,
|
|
12189
|
+
carouselRef: carouselRef,
|
|
12190
|
+
currentSlide: currentSlide,
|
|
12191
|
+
setCurrentSlide: setCurrentSlide
|
|
12192
|
+
})));
|
|
12193
|
+
};
|
|
11762
12194
|
|
|
11763
12195
|
var css_248z$1 = "@font-face {\n font-family: 'GreyLLTT';\n src: url('https://s3.eu-west-1.amazonaws.com/static.roh.org.uk/fonts/harmonic/GreyLLTT-Regular.woff2') format('woff2');\n font-weight: 400;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://s3.eu-west-1.amazonaws.com/static.roh.org.uk/fonts/harmonic/GreyLLTT-Medium.woff2') format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'GreyLLTT';\n src: url('https://s3.eu-west-1.amazonaws.com/static.roh.org.uk/fonts/harmonic/GreyLLTT-Bold.woff2') format('woff2');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://s3.eu-west-1.amazonaws.com/static.roh.org.uk/fonts/harmonic/VictorSerif-Medium.woff2')\n format('woff2');\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'VictorSerif';\n src: url('https://s3.eu-west-1.amazonaws.com/static.roh.org.uk/fonts/harmonic/VictorSerif-MediumItalic.woff2')\n format('woff2');\n font-weight: 500;\n font-style: italic;\n font-display: swap;\n}\n";
|
|
11764
12196
|
styleInject(css_248z$1);
|
|
@@ -11818,8 +12250,104 @@ var HarmonicThemeProvider = function HarmonicThemeProvider(_ref) {
|
|
|
11818
12250
|
return themedChildren.length === 1 ? themedChildren[0] : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, themedChildren);
|
|
11819
12251
|
};
|
|
11820
12252
|
|
|
11821
|
-
var
|
|
11822
|
-
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n --harmonic-text-link-underline-offset: 6px;\n --harmonic-text-transform-navigation: capitalize;\n --harmonic-font-size-navigation: 19px;\n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
12253
|
+
var _excluded$v = ["logo", "slides"];
|
|
12254
|
+
var HighlightsCinema = function HighlightsCinema(_ref) {
|
|
12255
|
+
var logo = _ref.logo,
|
|
12256
|
+
slides = _ref.slides,
|
|
12257
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$v);
|
|
12258
|
+
var slidesWithLinks = slides.map(function (slide) {
|
|
12259
|
+
var links = processSlideLinks(slide.links);
|
|
12260
|
+
return _extends({}, slide, {
|
|
12261
|
+
links: links
|
|
12262
|
+
});
|
|
12263
|
+
});
|
|
12264
|
+
return /*#__PURE__*/React__default.createElement(HarmonicThemeProvider, {
|
|
12265
|
+
theme: ThemeType.Cinema
|
|
12266
|
+
}, /*#__PURE__*/React__default.createElement(HighlightsCarousel, Object.assign({}, rest, {
|
|
12267
|
+
slides: slidesWithLinks,
|
|
12268
|
+
logo: logo ? /*#__PURE__*/React__default.createElement(CinemaBadge, {
|
|
12269
|
+
align: "left"
|
|
12270
|
+
}) : null
|
|
12271
|
+
})));
|
|
12272
|
+
};
|
|
12273
|
+
|
|
12274
|
+
var _excluded$w = ["slides"];
|
|
12275
|
+
var HighlightsCore = function HighlightsCore(_ref) {
|
|
12276
|
+
var slides = _ref.slides,
|
|
12277
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$w);
|
|
12278
|
+
var slidesWithLinks = slides.map(function (slide) {
|
|
12279
|
+
var links = processSlideLinks(slide.links);
|
|
12280
|
+
return _extends({}, slide, {
|
|
12281
|
+
links: links
|
|
12282
|
+
});
|
|
12283
|
+
});
|
|
12284
|
+
return /*#__PURE__*/React__default.createElement(HarmonicThemeProvider, {
|
|
12285
|
+
theme: ThemeType.Core
|
|
12286
|
+
}, /*#__PURE__*/React__default.createElement(HighlightsCarousel, Object.assign({}, rest, {
|
|
12287
|
+
slides: slidesWithLinks
|
|
12288
|
+
})));
|
|
12289
|
+
};
|
|
12290
|
+
|
|
12291
|
+
var _excluded$x = ["logo", "slides"];
|
|
12292
|
+
var HighlightsStream = function HighlightsStream(_ref) {
|
|
12293
|
+
var logo = _ref.logo,
|
|
12294
|
+
slides = _ref.slides,
|
|
12295
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$x);
|
|
12296
|
+
var slidesWithLinks = slides.map(function (slide) {
|
|
12297
|
+
var links = processSlideLinks(slide.links);
|
|
12298
|
+
return _extends({}, slide, {
|
|
12299
|
+
links: links
|
|
12300
|
+
});
|
|
12301
|
+
});
|
|
12302
|
+
return /*#__PURE__*/React__default.createElement(HarmonicThemeProvider, {
|
|
12303
|
+
theme: ThemeType.Stream
|
|
12304
|
+
}, /*#__PURE__*/React__default.createElement(HighlightsCarousel, Object.assign({}, rest, {
|
|
12305
|
+
slides: slidesWithLinks,
|
|
12306
|
+
logo: logo ? /*#__PURE__*/React__default.createElement(StreamBadge, {
|
|
12307
|
+
align: "left"
|
|
12308
|
+
}) : null
|
|
12309
|
+
})));
|
|
12310
|
+
};
|
|
12311
|
+
|
|
12312
|
+
var _templateObject$1o, _templateObject3$S;
|
|
12313
|
+
var CarouselWrapper$1 = /*#__PURE__*/styled.div(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n\n .swipe-slide {\n width: 100%;\n }\n"])));
|
|
12314
|
+
var ButtonsWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
|
|
12315
|
+
|
|
12316
|
+
var MinimalCarousel = function MinimalCarousel(_ref) {
|
|
12317
|
+
var children = _ref.children;
|
|
12318
|
+
var carouselRef = useRef(null);
|
|
12319
|
+
var hasMultipleChildren = React__default.Children.count(children) > 1;
|
|
12320
|
+
var onNext = function onNext() {
|
|
12321
|
+
var _carouselRef$current;
|
|
12322
|
+
return (_carouselRef$current = carouselRef.current) == null ? void 0 : _carouselRef$current.nextSlide();
|
|
12323
|
+
};
|
|
12324
|
+
var onPrev = function onPrev() {
|
|
12325
|
+
var _carouselRef$current2;
|
|
12326
|
+
return (_carouselRef$current2 = carouselRef.current) == null ? void 0 : _carouselRef$current2.prevSlide();
|
|
12327
|
+
};
|
|
12328
|
+
return /*#__PURE__*/React__default.createElement(CarouselWrapper$1, null, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
12329
|
+
columnStartDesktop: 1,
|
|
12330
|
+
columnSpanDesktop: 16,
|
|
12331
|
+
columnStartDevice: 1,
|
|
12332
|
+
columnSpanDevice: 14
|
|
12333
|
+
}, /*#__PURE__*/React__default.createElement(Swipe, {
|
|
12334
|
+
ref: carouselRef,
|
|
12335
|
+
infinite: hasMultipleChildren,
|
|
12336
|
+
"data-testid": "carousel-swipe"
|
|
12337
|
+
}, React__default.Children.toArray(children).map(function (child, index) {
|
|
12338
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
|
12339
|
+
key: "swipe-minimal-carousel-slide-" + index
|
|
12340
|
+
}, child);
|
|
12341
|
+
})))), hasMultipleChildren && (/*#__PURE__*/React__default.createElement(ButtonsWrapper$1, {
|
|
12342
|
+
"data-testid": "carousel-buttons-wrapper"
|
|
12343
|
+
}, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
12344
|
+
onClickNext: onNext,
|
|
12345
|
+
onClickPrev: onPrev
|
|
12346
|
+
}))));
|
|
12347
|
+
};
|
|
12348
|
+
|
|
12349
|
+
var _templateObject$1p;
|
|
12350
|
+
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n --harmonic-text-link-underline-offset: 6px;\n --harmonic-text-transform-navigation: capitalize;\n --harmonic-font-size-navigation: 19px;\n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
11823
12351
|
var theme = _ref.theme;
|
|
11824
12352
|
return theme.colors.primary;
|
|
11825
12353
|
}, function (_ref2) {
|
|
@@ -12766,5 +13294,5 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1m || (_templa
|
|
|
12766
13294
|
return theme.footer.tablet.paddingBottom;
|
|
12767
13295
|
}, devices.desktop, devices.largeDesktop);
|
|
12768
13296
|
|
|
12769
|
-
export { Accordion, Accordions, AltHeader, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyText, ButtonType, Card, Cards, CarouselType, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicThemeProvider, Header, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, MiniCard, ModalWindow, Navigation, Overline, PageHeadingCinema, PageHeadingCompact, PageHeadingCore, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, PageHeadingStream, Pagination, PasswordStrength, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, TextOnly, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls$1 as VideoWithControls, breakpoints, devices, zIndexes };
|
|
13297
|
+
export { Accordion, Accordions, AltHeader, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, BodyText, ButtonType, Card, Cards, Carousel, CarouselType, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, MiniCard, MinimalCarousel, ModalWindow, Navigation, Overline, PageHeadingCinema, PageHeadingCompact, PageHeadingCore, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, PageHeadingStream, Pagination, PasswordStrength, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, TextOnly, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls$1 as VideoWithControls, breakpoints, devices, zIndexes };
|
|
12770
13298
|
//# sourceMappingURL=harmonic.esm.js.map
|