@royaloperahouse/chord 0.7.48 → 0.7.441
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +2 -11
- package/dist/chord.cjs.development.js +70 -278
- package/dist/chord.cjs.development.js.map +1 -1
- package/dist/chord.cjs.production.min.js +1 -1
- package/dist/chord.cjs.production.min.js.map +1 -1
- package/dist/chord.esm.js +71 -278
- package/dist/chord.esm.js.map +1 -1
- package/dist/components/index.d.ts +2 -2
- package/dist/components/molecules/PromoWithTags/PromoWithTags.style.d.ts +1 -5
- package/dist/components/molecules/index.d.ts +1 -2
- package/dist/index.d.ts +2 -2
- package/dist/types/editorial.d.ts +3 -11
- package/dist/types/types.d.ts +0 -1
- package/package.json +1 -1
- package/dist/components/molecules/Information/InfoCta.d.ts +0 -4
- package/dist/components/molecules/Information/Information.d.ts +0 -4
- package/dist/components/molecules/Information/Information.style.d.ts +0 -10
- package/dist/components/molecules/Information/index.d.ts +0 -2
- package/dist/types/information.d.ts +0 -85
package/dist/chord.esm.js
CHANGED
|
@@ -5228,174 +5228,14 @@ var Editorial = function Editorial(_ref) {
|
|
|
5228
5228
|
})))));
|
|
5229
5229
|
};
|
|
5230
5230
|
|
|
5231
|
-
var
|
|
5232
|
-
|
|
5233
|
-
(function (CtaVariant) {
|
|
5234
|
-
CtaVariant["Primary"] = "Primary";
|
|
5235
|
-
CtaVariant["Secondary"] = "Secondary";
|
|
5236
|
-
CtaVariant["Tertiary"] = "Tertiary";
|
|
5237
|
-
CtaVariant["TextLink"] = "TextLink";
|
|
5238
|
-
})(CtaVariant || (CtaVariant = {}));
|
|
5239
|
-
|
|
5240
|
-
var CtaTheme;
|
|
5241
|
-
|
|
5242
|
-
(function (CtaTheme) {
|
|
5243
|
-
CtaTheme["Cinema"] = "Cinema";
|
|
5244
|
-
CtaTheme["Core"] = "Core";
|
|
5245
|
-
CtaTheme["Stream"] = "Stream";
|
|
5246
|
-
})(CtaTheme || (CtaTheme = {}));
|
|
5247
|
-
|
|
5248
|
-
var TitleVariant;
|
|
5249
|
-
|
|
5250
|
-
(function (TitleVariant) {
|
|
5251
|
-
TitleVariant["Header"] = "Header";
|
|
5252
|
-
TitleVariant["AltHeader"] = "AltHeader";
|
|
5253
|
-
})(TitleVariant || (TitleVariant = {}));
|
|
5254
|
-
|
|
5255
|
-
var BackgroundColour;
|
|
5256
|
-
|
|
5257
|
-
(function (BackgroundColour) {
|
|
5258
|
-
BackgroundColour["Cinema"] = "cinema";
|
|
5259
|
-
BackgroundColour["Core"] = "core";
|
|
5260
|
-
BackgroundColour["Stream"] = "stream";
|
|
5261
|
-
BackgroundColour["White"] = "white";
|
|
5262
|
-
})(BackgroundColour || (BackgroundColour = {}));
|
|
5263
|
-
|
|
5264
|
-
var _templateObject$K, _templateObject2$t, _templateObject3$l, _templateObject4$f;
|
|
5265
|
-
var InfoContent = /*#__PURE__*/styled('div')(_templateObject$K || (_templateObject$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n -webkit-letter-spacing: var(--letter-spacing-altHeader-6);\n -moz-letter-spacing: var(--letter-spacing-altHeader-6);\n -ms-letter-spacing: var(--letter-spacing-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n word-break: var(--word-break-altHeader);\n"])));
|
|
5266
|
-
var InfoTitle = /*#__PURE__*/styled('div')(_templateObject2$t || (_templateObject2$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n * {\n margin-block: 0;\n }\n"])));
|
|
5267
|
-
var InfoCTAWrapper = /*#__PURE__*/styled('div')(_templateObject3$l || (_templateObject3$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 32px 0;\n\n ", "}\n"])), function (props) {
|
|
5268
|
-
if (!props.infoThemed) {
|
|
5269
|
-
return;
|
|
5270
|
-
} else {
|
|
5271
|
-
if (props.variant === CtaVariant.Primary || props.variant === CtaVariant.Secondary) {
|
|
5272
|
-
return "a {\n color: var(--base-color-black);\n background: var(--base-color-white);\n border-color: var(--base-color-transparent);\n }";
|
|
5273
|
-
} else {
|
|
5274
|
-
return "a {\n color: var(--base-color-white);\n background: var(--base-color-transparent});\n }\n svg > path {\n fill: var(--base-color-white);\n stroke: var(--base-color-white);\n stroke-width: 1;\n }\n ";
|
|
5275
|
-
}
|
|
5276
|
-
}
|
|
5277
|
-
});
|
|
5278
|
-
var InfoWrapper$1 = /*#__PURE__*/styled(Grid)(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 60px 0;\n color: ", ";\n background: ", "\n }};\n"])), function (props) {
|
|
5279
|
-
return props.background !== BackgroundColour.White ? 'var(--base-color-white)' : 'var(--base-color-black)';
|
|
5280
|
-
}, function (props) {
|
|
5281
|
-
return "var(--base-color-" + props.background + ")";
|
|
5282
|
-
});
|
|
5283
|
-
|
|
5284
|
-
var InfoCta = function InfoCta(_ref) {
|
|
5285
|
-
var _ref$variant = _ref.variant,
|
|
5286
|
-
variant = _ref$variant === void 0 ? CtaVariant.Primary : _ref$variant,
|
|
5287
|
-
_ref$theme = _ref.theme,
|
|
5288
|
-
theme = _ref$theme === void 0 ? CtaTheme.Core : _ref$theme,
|
|
5289
|
-
link = _ref.link,
|
|
5290
|
-
text = _ref.text,
|
|
5291
|
-
iconName = _ref.iconName,
|
|
5292
|
-
iconDirection = _ref.iconDirection,
|
|
5293
|
-
infoThemed = _ref.infoThemed;
|
|
5294
|
-
return /*#__PURE__*/React__default.createElement(InfoCTAWrapper, {
|
|
5295
|
-
variant: variant,
|
|
5296
|
-
infoThemed: infoThemed,
|
|
5297
|
-
theme: theme
|
|
5298
|
-
}, variant === CtaVariant.Secondary ? /*#__PURE__*/React__default.createElement(SecondaryButton, {
|
|
5299
|
-
color: Colors[theme],
|
|
5300
|
-
href: link,
|
|
5301
|
-
iconName: iconName,
|
|
5302
|
-
iconDirection: iconDirection
|
|
5303
|
-
}, text) : variant === CtaVariant.Tertiary ? /*#__PURE__*/React__default.createElement(Button$1, {
|
|
5304
|
-
color: Colors.Black,
|
|
5305
|
-
href: link,
|
|
5306
|
-
iconName: iconName,
|
|
5307
|
-
iconDirection: iconDirection
|
|
5308
|
-
}, text) : variant === CtaVariant.TextLink ? /*#__PURE__*/React__default.createElement(TextLink, {
|
|
5309
|
-
color: Colors.Black,
|
|
5310
|
-
href: link,
|
|
5311
|
-
iconName: iconName,
|
|
5312
|
-
iconDirection: iconDirection
|
|
5313
|
-
}, text) : /*#__PURE__*/React__default.createElement(PrimaryButton, {
|
|
5314
|
-
bgColor: Colors[theme],
|
|
5315
|
-
href: link,
|
|
5316
|
-
iconName: iconName,
|
|
5317
|
-
iconDirection: iconDirection
|
|
5318
|
-
}, text));
|
|
5319
|
-
};
|
|
5320
|
-
|
|
5321
|
-
var defaultColumnSpan = 6;
|
|
5322
|
-
var smallColumnSpan = 4;
|
|
5323
|
-
var largeColumnSpan = 9;
|
|
5324
|
-
var mediumWordBreakpoint = 8;
|
|
5325
|
-
var longWordBreakpoint = 13;
|
|
5326
|
-
|
|
5327
|
-
var getColumnSpan = function getColumnSpan(variant, textSize, longestWordLength) {
|
|
5328
|
-
if (!(variant === TitleVariant.Header && textSize === 4)) return defaultColumnSpan;
|
|
5329
|
-
|
|
5330
|
-
switch (true) {
|
|
5331
|
-
case longestWordLength > longWordBreakpoint:
|
|
5332
|
-
return largeColumnSpan;
|
|
5333
|
-
|
|
5334
|
-
case longestWordLength < mediumWordBreakpoint:
|
|
5335
|
-
return smallColumnSpan;
|
|
5336
|
-
|
|
5337
|
-
default:
|
|
5338
|
-
return defaultColumnSpan;
|
|
5339
|
-
}
|
|
5340
|
-
};
|
|
5341
|
-
|
|
5342
|
-
var renderTitle = function renderTitle(props) {
|
|
5343
|
-
var headerLevel = props.variant === TitleVariant.Header && props.textSize < 4 ? 4 : props.textSize;
|
|
5344
|
-
return props.variant === TitleVariant.Header ? /*#__PURE__*/React__default.createElement(Header, {
|
|
5345
|
-
level: headerLevel
|
|
5346
|
-
}, props.text) : /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
5347
|
-
level: headerLevel
|
|
5348
|
-
}, props.text);
|
|
5349
|
-
};
|
|
5350
|
-
|
|
5351
|
-
var Information = function Information(_ref) {
|
|
5352
|
-
var body = _ref.body,
|
|
5353
|
-
title = _ref.title,
|
|
5354
|
-
background = _ref.background,
|
|
5355
|
-
cta = _ref.cta;
|
|
5356
|
-
var titleWords = title.text.split(' ');
|
|
5357
|
-
var titleWordLengths = titleWords.map(function (word) {
|
|
5358
|
-
return word.length;
|
|
5359
|
-
});
|
|
5360
|
-
var maxTitleWordLength = Math.max.apply(Math, titleWordLengths);
|
|
5361
|
-
var titleColumnSpan = getColumnSpan(title.variant, title.textSize, maxTitleWordLength);
|
|
5362
|
-
var bgColour = background != null ? background : BackgroundColour.White;
|
|
5363
|
-
return /*#__PURE__*/React__default.createElement(InfoWrapper$1, {
|
|
5364
|
-
background: bgColour,
|
|
5365
|
-
"data-testid": "infoWrapper"
|
|
5366
|
-
}, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
5367
|
-
columnStartDesktop: 2,
|
|
5368
|
-
columnStartDevice: 2,
|
|
5369
|
-
columnSpanDesktop: titleColumnSpan,
|
|
5370
|
-
columnSpanDevice: 14
|
|
5371
|
-
}, /*#__PURE__*/React__default.createElement(InfoTitle, null, renderTitle(title))), /*#__PURE__*/React__default.createElement(GridItem, {
|
|
5372
|
-
columnStartDesktop: titleColumnSpan + 2,
|
|
5373
|
-
columnStartDevice: 2,
|
|
5374
|
-
columnSpanDesktop: 14 - titleColumnSpan,
|
|
5375
|
-
columnSpanDevice: 14
|
|
5376
|
-
}, /*#__PURE__*/React__default.createElement(InfoContent, null, /*#__PURE__*/React__default.createElement("div", {
|
|
5377
|
-
dangerouslySetInnerHTML: {
|
|
5378
|
-
__html: body
|
|
5379
|
-
}
|
|
5380
|
-
}), cta && /*#__PURE__*/React__default.createElement(InfoCta, {
|
|
5381
|
-
link: cta.link,
|
|
5382
|
-
variant: cta.variant,
|
|
5383
|
-
theme: cta.theme,
|
|
5384
|
-
infoThemed: bgColour !== BackgroundColour.White,
|
|
5385
|
-
text: cta.text,
|
|
5386
|
-
iconName: cta.iconName,
|
|
5387
|
-
iconDirection: cta.iconDirection
|
|
5388
|
-
}))));
|
|
5389
|
-
};
|
|
5390
|
-
|
|
5391
|
-
var _templateObject$L, _templateObject2$u, _templateObject3$m, _templateObject4$g, _templateObject5$b, _templateObject6$8, _templateObject7$5, _templateObject8$5;
|
|
5392
|
-
var PageHeadingWrapper = /*#__PURE__*/styled.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n h2 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
5231
|
+
var _templateObject$K, _templateObject2$t, _templateObject3$l, _templateObject4$f, _templateObject5$b, _templateObject6$8, _templateObject7$5, _templateObject8$5;
|
|
5232
|
+
var PageHeadingWrapper = /*#__PURE__*/styled.div(_templateObject$K || (_templateObject$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-bottom: 80px;\n background-color: ", ";\n color: var(--base-color-white);\n\n h2 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n padding-bottom: 0;\n }\n"])), function (_ref) {
|
|
5393
5233
|
var theme = _ref.theme;
|
|
5394
5234
|
return theme.colors.primary;
|
|
5395
5235
|
}, devices.mobile);
|
|
5396
|
-
var PageHeadingGrid = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
5397
|
-
var TitleWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$
|
|
5398
|
-
var ChildrenWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
5236
|
+
var PageHeadingGrid = /*#__PURE__*/styled(Grid)(_templateObject2$t || (_templateObject2$t = /*#__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);
|
|
5237
|
+
var TitleWrapper$1 = /*#__PURE__*/styled.div(_templateObject3$l || (_templateObject3$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: title;\n margin-top: 80px;\n\n @media ", " {\n & {\n margin-top: 0;\n }\n }\n"])), devices.mobile);
|
|
5238
|
+
var ChildrenWrapper = /*#__PURE__*/styled.div(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 20px;\n width: fit-content;\n height: 36px;\n\n @media ", " {\n & {\n height: 30px;\n }\n }\n"])), devices.mobile);
|
|
5399
5239
|
var TextWrapper = /*#__PURE__*/styled.div(_templateObject5$b || (_templateObject5$b = /*#__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"])));
|
|
5400
5240
|
var LogoWrapper$1 = /*#__PURE__*/styled.div(_templateObject6$8 || (_templateObject6$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n justify-self: end;\n margin-top: 20px;\n position: relative;\n\n > div {\n position: absolute;\n top: 0;\n right: 0;\n }\n\n @media ", " {\n & {\n align-self: start;\n margin-top: 0;\n }\n }\n"])), devices.mobile);
|
|
5401
5241
|
var ButtonWrapper$1 = /*#__PURE__*/styled.div(_templateObject7$5 || (_templateObject7$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n justify-self: end;\n align-self: end;\n\n @media ", " {\n & {\n justify-self: center;\n align-self: center;\n width: 100%;\n margin-top: 16px;\n }\n }\n"])), devices.mobile);
|
|
@@ -5472,8 +5312,8 @@ var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
|
5472
5312
|
}), /*#__PURE__*/React__default.createElement(CinemaBadge, null)));
|
|
5473
5313
|
};
|
|
5474
5314
|
|
|
5475
|
-
var _templateObject$
|
|
5476
|
-
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
5315
|
+
var _templateObject$L, _templateObject2$u, _templateObject3$m, _templateObject4$g, _templateObject5$c, _templateObject6$9, _templateObject7$6;
|
|
5316
|
+
var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n aspect-ratio: 16 / 9;\n @supports not (aspect-ratio: 16 / 9) {\n height: 56.25vw;\n }\n\n background-image: url('", "');\n background-repeat: no-repeat;\n background-size: cover;\n position: relative;\n display: flex;\n align-items: center;\n\n ::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: var(--base-color-black);\n filter: opacity(40%);\n z-index: ", ";\n }\n\n @media ", " {\n & {\n aspect-ratio: 1 / 1;\n @supports not (aspect-ratio: 1 / 1) {\n height: 100vw;\n }\n background-image: url('", "');\n background-position: center;\n display: flex;\n align-items: start;\n }\n }\n"])), function (_ref) {
|
|
5477
5317
|
var bgUrlDesktop = _ref.bgUrlDesktop;
|
|
5478
5318
|
return bgUrlDesktop;
|
|
5479
5319
|
}, zIndexes.content, devices.mobile, function (_ref2) {
|
|
@@ -5481,10 +5321,10 @@ var ImpactWrapper = /*#__PURE__*/styled.div(_templateObject$M || (_templateObjec
|
|
|
5481
5321
|
bgUrlDevice = _ref2.bgUrlDevice;
|
|
5482
5322
|
return bgUrlDevice ? bgUrlDevice : bgUrlDesktop;
|
|
5483
5323
|
});
|
|
5484
|
-
var ImpactGrid = /*#__PURE__*/styled(Grid)(_templateObject2$
|
|
5485
|
-
var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
5486
|
-
var LogoWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$
|
|
5487
|
-
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$c || (_templateObject5$c = /*#__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(
|
|
5324
|
+
var ImpactGrid = /*#__PURE__*/styled(Grid)(_templateObject2$u || (_templateObject2$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n z-index: ", ";\n gap: 0 var(--grid-column-gap);\n grid-template-rows: min-content min-content min-content;\n grid-template-areas:\n '. . . . . logo logo logo logo 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 & {\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 . .';\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
5325
|
+
var SponsorWrapper = /*#__PURE__*/styled.div(_templateObject3$m || (_templateObject3$m = /*#__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);
|
|
5326
|
+
var LogoWrapper$2 = /*#__PURE__*/styled.div(_templateObject4$g || (_templateObject4$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: logo;\n align-self: end;\n"])));
|
|
5327
|
+
var TextWrapper$1 = /*#__PURE__*/styled.div(_templateObject5$c || (_templateObject5$c = /*#__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);
|
|
5488
5328
|
var ButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject6$9 || (_templateObject6$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n align-self: end;\n display: flex;\n justify-content: center;\n margin-top: 40px;\n\n @media ", " {\n & {\n margin-top: 0;\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
5489
5329
|
var ScrollDownWrapper = /*#__PURE__*/styled.div(_templateObject7$6 || (_templateObject7$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 20px;\n left: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n 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);
|
|
5490
5330
|
|
|
@@ -5530,8 +5370,8 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
5530
5370
|
}, "Scroll Down")) : null);
|
|
5531
5371
|
};
|
|
5532
5372
|
|
|
5533
|
-
var _templateObject$
|
|
5534
|
-
var StreamWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
5373
|
+
var _templateObject$M;
|
|
5374
|
+
var StreamWrapper = /*#__PURE__*/styled.div(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2::selection,\n div::selection {\n color: #1866dc;\n background-color: #fff;\n }\n"])));
|
|
5535
5375
|
|
|
5536
5376
|
var _excluded$h = ["link"];
|
|
5537
5377
|
|
|
@@ -5551,11 +5391,11 @@ var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
|
5551
5391
|
}), /*#__PURE__*/React__default.createElement(StreamBadge, null))));
|
|
5552
5392
|
};
|
|
5553
5393
|
|
|
5554
|
-
var _templateObject$
|
|
5555
|
-
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
5556
|
-
var PersonWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
5557
|
-
var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
5558
|
-
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$
|
|
5394
|
+
var _templateObject$N, _templateObject2$v, _templateObject3$n, _templateObject4$h, _templateObject5$d, _templateObject6$a;
|
|
5395
|
+
var PeopleListingGrid = /*#__PURE__*/styled(Grid)(_templateObject$N || (_templateObject$N = /*#__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);
|
|
5396
|
+
var PersonWrapper = /*#__PURE__*/styled.div(_templateObject2$v || (_templateObject2$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: 60px 1fr;\n grid-template-areas: 'headshot role-person';\n grid-column-gap: 10px;\n"])));
|
|
5397
|
+
var HeadshotWrapper = /*#__PURE__*/styled.div(_templateObject3$n || (_templateObject3$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n grid-area: headshot;\n img {\n width: 60px;\n height: 60px;\n }\n"])));
|
|
5398
|
+
var RoleWrapper = /*#__PURE__*/styled.div(_templateObject4$h || (_templateObject4$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n margin-bottom: 4px;\n"])));
|
|
5559
5399
|
var TextWrapper$2 = /*#__PURE__*/styled.div(_templateObject5$d || (_templateObject5$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: role-person;\n"])));
|
|
5560
5400
|
var PersonLink = /*#__PURE__*/styled.a(_templateObject6$a || (_templateObject6$a = /*#__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"])));
|
|
5561
5401
|
|
|
@@ -5608,47 +5448,44 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
5608
5448
|
}));
|
|
5609
5449
|
};
|
|
5610
5450
|
|
|
5611
|
-
var _templateObject$
|
|
5451
|
+
var _templateObject$O, _templateObject2$w, _templateObject3$o, _templateObject4$i, _templateObject5$e, _templateObject6$b, _templateObject7$7, _templateObject8$6, _templateObject9$4, _templateObject10$3, _templateObject11$2;
|
|
5612
5452
|
var LENGTH_TEXT = 28;
|
|
5613
5453
|
var LENGTH_TEXT_TABLET$1 = 10;
|
|
5614
|
-
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
5454
|
+
var PromoWithTagsGrid = /*#__PURE__*/styled(Grid)(_templateObject$O || (_templateObject$O = /*#__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) {
|
|
5615
5455
|
var imageToLeft = _ref.imageToLeft;
|
|
5616
5456
|
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'";
|
|
5617
5457
|
}, devices.tablet, function (_ref2) {
|
|
5618
5458
|
var imageToLeft = _ref2.imageToLeft;
|
|
5619
5459
|
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'";
|
|
5620
5460
|
}, devices.mobile);
|
|
5621
|
-
var
|
|
5461
|
+
var PromoWithTagsImageWrapper = /*#__PURE__*/styled.div(_templateObject2$w || (_templateObject2$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref3) {
|
|
5622
5462
|
var imageToLeft = _ref3.imageToLeft;
|
|
5623
5463
|
return imageToLeft ? 'left' : 'right';
|
|
5624
5464
|
}, devices.mobile);
|
|
5625
|
-
var PromoWithTagsContentWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
5465
|
+
var PromoWithTagsContentWrapper = /*#__PURE__*/styled.div(_templateObject3$o || (_templateObject3$o = /*#__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) {
|
|
5626
5466
|
var imageToLeft = _ref4.imageToLeft;
|
|
5627
5467
|
return imageToLeft ? 'right' : 'left';
|
|
5628
|
-
}, devices.mobile
|
|
5629
|
-
|
|
5630
|
-
return hideSection ? 'none' : 'block';
|
|
5631
|
-
});
|
|
5632
|
-
var PromoWithTagsContainer = /*#__PURE__*/styled.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2,\n h3 {\n margin: 0 0 16px;\n }\n"])));
|
|
5468
|
+
}, devices.mobile);
|
|
5469
|
+
var PromoWithTagsContainer = /*#__PURE__*/styled.div(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2,\n h3 {\n margin: 0 0 16px;\n }\n"])));
|
|
5633
5470
|
var PromoWithTagsSubtitle = /*#__PURE__*/styled.span(_templateObject5$e || (_templateObject5$e = /*#__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"])));
|
|
5634
|
-
var PromoWithTagsText = /*#__PURE__*/styled.div(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n }\n }\n"])), function (
|
|
5635
|
-
var theme =
|
|
5471
|
+
var PromoWithTagsText = /*#__PURE__*/styled.div(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n }\n }\n"])), function (_ref5) {
|
|
5472
|
+
var theme = _ref5.theme;
|
|
5636
5473
|
return theme.colors.black;
|
|
5474
|
+
}, function (_ref6) {
|
|
5475
|
+
var theme = _ref6.theme;
|
|
5476
|
+
return theme.colors.darkgrey;
|
|
5637
5477
|
}, function (_ref7) {
|
|
5638
5478
|
var theme = _ref7.theme;
|
|
5639
|
-
return theme.colors.darkgrey;
|
|
5640
|
-
}, function (_ref8) {
|
|
5641
|
-
var theme = _ref8.theme;
|
|
5642
5479
|
return theme.colors.primary;
|
|
5643
5480
|
});
|
|
5644
|
-
var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject7$7 || (_templateObject7$7 = /*#__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 (
|
|
5645
|
-
var hasTextLinks =
|
|
5481
|
+
var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject7$7 || (_templateObject7$7 = /*#__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 (_ref8) {
|
|
5482
|
+
var hasTextLinks = _ref8.hasTextLinks;
|
|
5646
5483
|
return "margin-top: " + (hasTextLinks ? '0' : '24px') + ";";
|
|
5647
|
-
}, function (
|
|
5648
|
-
var
|
|
5649
|
-
primaryButtonTextLength =
|
|
5650
|
-
|
|
5651
|
-
tertiaryButtonTextLength =
|
|
5484
|
+
}, function (_ref9) {
|
|
5485
|
+
var _ref9$primaryButtonTe = _ref9.primaryButtonTextLength,
|
|
5486
|
+
primaryButtonTextLength = _ref9$primaryButtonTe === void 0 ? 0 : _ref9$primaryButtonTe,
|
|
5487
|
+
_ref9$tertiaryButtonT = _ref9.tertiaryButtonTextLength,
|
|
5488
|
+
tertiaryButtonTextLength = _ref9$tertiaryButtonT === void 0 ? 0 : _ref9$tertiaryButtonT;
|
|
5652
5489
|
var isLinksLayoutColumn = primaryButtonTextLength >= LENGTH_TEXT || tertiaryButtonTextLength >= LENGTH_TEXT;
|
|
5653
5490
|
|
|
5654
5491
|
if (isLinksLayoutColumn) {
|
|
@@ -5656,11 +5493,11 @@ var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject7$7 || (_templat
|
|
|
5656
5493
|
}
|
|
5657
5494
|
|
|
5658
5495
|
return '';
|
|
5659
|
-
}, devices.mobile, devices.tablet, function (
|
|
5660
|
-
var
|
|
5661
|
-
primaryButtonTextLength =
|
|
5662
|
-
|
|
5663
|
-
tertiaryButtonTextLength =
|
|
5496
|
+
}, devices.mobile, devices.tablet, function (_ref10) {
|
|
5497
|
+
var _ref10$primaryButtonT = _ref10.primaryButtonTextLength,
|
|
5498
|
+
primaryButtonTextLength = _ref10$primaryButtonT === void 0 ? 0 : _ref10$primaryButtonT,
|
|
5499
|
+
_ref10$tertiaryButton = _ref10.tertiaryButtonTextLength,
|
|
5500
|
+
tertiaryButtonTextLength = _ref10$tertiaryButton === void 0 ? 0 : _ref10$tertiaryButton;
|
|
5664
5501
|
var isLinksLayoutColumnTablet = primaryButtonTextLength >= LENGTH_TEXT_TABLET$1 || tertiaryButtonTextLength >= LENGTH_TEXT_TABLET$1;
|
|
5665
5502
|
|
|
5666
5503
|
if (isLinksLayoutColumnTablet) {
|
|
@@ -5669,17 +5506,13 @@ var ButtonsContainer$2 = /*#__PURE__*/styled.div(_templateObject7$7 || (_templat
|
|
|
5669
5506
|
|
|
5670
5507
|
return '';
|
|
5671
5508
|
});
|
|
5672
|
-
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n"])), function (
|
|
5673
|
-
var marginBottom =
|
|
5509
|
+
var PromoWithTagsTagWrapper = /*#__PURE__*/styled.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n"])), function (_ref11) {
|
|
5510
|
+
var marginBottom = _ref11.marginBottom;
|
|
5674
5511
|
return marginBottom + "px";
|
|
5675
5512
|
});
|
|
5676
5513
|
var PromoWithTagsAdditionalText = /*#__PURE__*/styled(PromoWithTagsText)(_templateObject9$4 || (_templateObject9$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 24px 0;\n"])));
|
|
5677
5514
|
var TextLinksContainer = /*#__PURE__*/styled.div(_templateObject10$3 || (_templateObject10$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n margin: 24px 0 4px 0;\n"])));
|
|
5678
5515
|
var TextLinkWrapper$2 = /*#__PURE__*/styled.div(_templateObject11$2 || (_templateObject11$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 24px;\n margin-bottom: 20px;\n\n &:last-child {\n margin-right: 0;\n }\n"])));
|
|
5679
|
-
var ExtraContentWrapper = /*#__PURE__*/styled.div(_templateObject12 || (_templateObject12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding-right: 68px;\n\n @media ", " {\n padding: 30px 0 0;\n }\n\n @media ", " {\n padding: 0;\n position: initial;\n }\n"])), devices.tablet, devices.mobile);
|
|
5680
|
-
var IconWrapper$2 = /*#__PURE__*/styled.div(_templateObject13 || (_templateObject13 = /*#__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);
|
|
5681
|
-
var PrimaryButtonWrapper$2 = /*#__PURE__*/styled.div(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: var(--button-height);\n"])));
|
|
5682
|
-
var MobileTitleWrapper = /*#__PURE__*/styled.div(_templateObject15 || (_templateObject15 = /*#__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);
|
|
5683
5516
|
|
|
5684
5517
|
var _excluded$i = ["text"],
|
|
5685
5518
|
_excluded2$2 = ["text"],
|
|
@@ -5701,12 +5534,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
5701
5534
|
aboveTitleTags = _ref.aboveTitleTags,
|
|
5702
5535
|
belowTitleTags = _ref.belowTitleTags,
|
|
5703
5536
|
middleText = _ref.middleText,
|
|
5704
|
-
bottomText = _ref.bottomText
|
|
5705
|
-
image = _ref.image;
|
|
5706
|
-
|
|
5707
|
-
var _useState = useState(false),
|
|
5708
|
-
showExtraContent = _useState[0],
|
|
5709
|
-
setShowExtraContent = _useState[1];
|
|
5537
|
+
bottomText = _ref.bottomText;
|
|
5710
5538
|
|
|
5711
5539
|
var truncate = function truncate(str, n) {
|
|
5712
5540
|
return str.length >= n ? str.substr(0, n) : str;
|
|
@@ -5714,19 +5542,6 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
5714
5542
|
|
|
5715
5543
|
var imageToLeft = imagePosition === 'left';
|
|
5716
5544
|
var titleLevel = titleSize === 'large' ? 2 : 3;
|
|
5717
|
-
var isExtraContentPresent = !!children;
|
|
5718
|
-
var anchorLink = title.replace(' ', '-').toLocaleLowerCase() + "-content";
|
|
5719
|
-
|
|
5720
|
-
var handleExtraContent = function handleExtraContent(e) {
|
|
5721
|
-
e.preventDefault();
|
|
5722
|
-
setShowExtraContent(true);
|
|
5723
|
-
|
|
5724
|
-
if (window.matchMedia && window.matchMedia(devices.mobile).matches) {
|
|
5725
|
-
window.location.href = "#" + anchorLink;
|
|
5726
|
-
}
|
|
5727
|
-
};
|
|
5728
|
-
|
|
5729
|
-
var defaultOnClickHandler = isExtraContentPresent ? handleExtraContent : undefined;
|
|
5730
5545
|
var primaryButton = links == null ? void 0 : links[0];
|
|
5731
5546
|
|
|
5732
5547
|
var _ref2 = primaryButton || {},
|
|
@@ -5751,12 +5566,15 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
5751
5566
|
return /*#__PURE__*/React__default.createElement(TextLinkWrapper$2, null, /*#__PURE__*/React__default.createElement(TextLink, Object.assign({}, restTextLink), textLinkText));
|
|
5752
5567
|
}) : null;
|
|
5753
5568
|
return /*#__PURE__*/React__default.createElement(PromoWithTagsGrid, {
|
|
5754
|
-
id: anchorLink,
|
|
5755
5569
|
imageToLeft: imageToLeft
|
|
5756
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
5570
|
+
}, /*#__PURE__*/React__default.createElement(PromoWithTagsImageWrapper, {
|
|
5571
|
+
"data-testid": "image-wrapper",
|
|
5572
|
+
imageToLeft: imageToLeft
|
|
5573
|
+
}, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
|
|
5574
|
+
aspectRatio: AspectRatio['4:3']
|
|
5575
|
+
}, children)), /*#__PURE__*/React__default.createElement(PromoWithTagsContentWrapper, {
|
|
5757
5576
|
"data-testid": "content-wrapper",
|
|
5758
|
-
imageToLeft: imageToLeft
|
|
5759
|
-
hideSection: showExtraContent
|
|
5577
|
+
imageToLeft: imageToLeft
|
|
5760
5578
|
}, /*#__PURE__*/React__default.createElement(PromoWithTagsContainer, null, !!(aboveTitleTags != null && aboveTitleTags.length) && /*#__PURE__*/React__default.createElement(PromoWithTagsTagWrapper, {
|
|
5761
5579
|
marginBottom: 16
|
|
5762
5580
|
}, /*#__PURE__*/React__default.createElement(TypeTags, {
|
|
@@ -5784,53 +5602,28 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
5784
5602
|
"data-testid": "buttons-wrapper",
|
|
5785
5603
|
primaryButtonTextLength: primaryButtonText.length,
|
|
5786
5604
|
tertiaryButtonTextLength: tertiaryButtonText.length
|
|
5787
|
-
}, primaryButton && /*#__PURE__*/React__default.createElement(
|
|
5788
|
-
onClick: defaultOnClickHandler
|
|
5789
|
-
}, restPrimaryButton), primaryButtonTextTruncate)), tertiaryButton && /*#__PURE__*/React__default.createElement(Button$1, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate))), /*#__PURE__*/React__default.createElement(PromoWithTagsExtraContentWrapper, {
|
|
5790
|
-
"data-testid": "extra-content-wrapper",
|
|
5791
|
-
imageToLeft: imageToLeft
|
|
5792
|
-
}, showExtraContent && /*#__PURE__*/React__default.createElement(MobileTitleWrapper, null, /*#__PURE__*/React__default.createElement(Header, {
|
|
5793
|
-
level: titleLevel
|
|
5794
|
-
}, title)), /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
|
|
5795
|
-
aspectRatio: AspectRatio['4:3']
|
|
5796
|
-
}, isExtraContentPresent && showExtraContent ? /*#__PURE__*/React__default.createElement(ExtraContentWrapper, null, children, /*#__PURE__*/React__default.createElement(IconWrapper$2, {
|
|
5797
|
-
"data-testid": "extra-content-close-button",
|
|
5798
|
-
onClick: function onClick() {
|
|
5799
|
-
return setShowExtraContent(false);
|
|
5800
|
-
},
|
|
5801
|
-
tabIndex: 0,
|
|
5802
|
-
onKeyPress: function onKeyPress(e) {
|
|
5803
|
-
e.key === 'Enter' && setShowExtraContent(false);
|
|
5804
|
-
}
|
|
5805
|
-
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
5806
|
-
iconName: "Close",
|
|
5807
|
-
color: Colors.Black
|
|
5808
|
-
}))) : image && /*#__PURE__*/React__default.createElement("img", {
|
|
5809
|
-
"data-testid": "promo-with-tags-image",
|
|
5810
|
-
src: image.src,
|
|
5811
|
-
alt: image.alt
|
|
5812
|
-
}))));
|
|
5605
|
+
}, primaryButton && /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate), tertiaryButton && /*#__PURE__*/React__default.createElement(Button$1, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate))));
|
|
5813
5606
|
};
|
|
5814
5607
|
|
|
5815
|
-
var _templateObject$
|
|
5608
|
+
var _templateObject$P, _templateObject2$x, _templateObject3$p, _templateObject4$j, _templateObject5$f, _templateObject6$c, _templateObject7$8;
|
|
5816
5609
|
var LENGTH_TEXT$2 = 28;
|
|
5817
5610
|
var LENGTH_TEXT_TABLET$2 = 10;
|
|
5818
|
-
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$
|
|
5611
|
+
var PromoWithTitleGrid = /*#__PURE__*/styled(Grid)(_templateObject$P || (_templateObject$P = /*#__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) {
|
|
5819
5612
|
var imageToLeft = _ref.imageToLeft;
|
|
5820
5613
|
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'";
|
|
5821
5614
|
}, devices.tablet, function (_ref2) {
|
|
5822
5615
|
var imageToLeft = _ref2.imageToLeft;
|
|
5823
5616
|
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'";
|
|
5824
5617
|
}, devices.mobile);
|
|
5825
|
-
var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
5618
|
+
var PromoWithTitleImageWrapper = /*#__PURE__*/styled.div(_templateObject2$x || (_templateObject2$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: ", ";\n align-self: center;\n @media ", " {\n & {\n grid-area: row1;\n }\n }\n"])), function (_ref3) {
|
|
5826
5619
|
var imageToLeft = _ref3.imageToLeft;
|
|
5827
5620
|
return imageToLeft ? 'left' : 'right';
|
|
5828
5621
|
}, devices.mobile);
|
|
5829
|
-
var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$
|
|
5622
|
+
var PromoWithTitleContentWrapper = /*#__PURE__*/styled.div(_templateObject3$p || (_templateObject3$p = /*#__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) {
|
|
5830
5623
|
var imageToLeft = _ref4.imageToLeft;
|
|
5831
5624
|
return imageToLeft ? 'right' : 'left';
|
|
5832
5625
|
}, devices.mobile);
|
|
5833
|
-
var PromoWithTitleContainer = /*#__PURE__*/styled.div(_templateObject4$
|
|
5626
|
+
var PromoWithTitleContainer = /*#__PURE__*/styled.div(_templateObject4$j || (_templateObject4$j = /*#__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);
|
|
5834
5627
|
var PromoWithTitleSubtitle = /*#__PURE__*/styled.span(_templateObject5$f || (_templateObject5$f = /*#__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"])));
|
|
5835
5628
|
var PromoWithTitleText = /*#__PURE__*/styled.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n text-transform: var(--text-transform-body);\n margin: 0;\n padding: 0;\n white-space: break-spaces;\n overflow-wrap: break-word;\n\n h5,\n h6 {\n margin: 0 0 4px 0;\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-size: var(--font-size-subtitle-2);\n font-weight: var(--font-weight-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n text-transform: var(--text-transform-subtitle);\n overflow-wrap: break-word;\n }\n\n em {\n font-family: var(--font-family-body-italics);\n }\n\n a {\n text-decoration: underline;\n cursor: pointer;\n\n &[href^='tel:'] {\n text-decoration: none;\n }\n\n &:link {\n color: ", ";\n }\n\n &:visited {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n }\n }\n"])), function (_ref5) {
|
|
5836
5629
|
var theme = _ref5.theme;
|
|
@@ -5929,8 +5722,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
5929
5722
|
}, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? /*#__PURE__*/React__default.createElement(Button$1, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate) : null) : null));
|
|
5930
5723
|
};
|
|
5931
5724
|
|
|
5932
|
-
var _templateObject$
|
|
5933
|
-
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$
|
|
5725
|
+
var _templateObject$Q;
|
|
5726
|
+
var SectionTitleWrapper = /*#__PURE__*/styled.div(_templateObject$Q || (_templateObject$Q = /*#__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);
|
|
5934
5727
|
|
|
5935
5728
|
var SectionTitle = function SectionTitle(_ref) {
|
|
5936
5729
|
var title = _ref.title,
|
|
@@ -5956,8 +5749,8 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
5956
5749
|
}, description))));
|
|
5957
5750
|
};
|
|
5958
5751
|
|
|
5959
|
-
var _templateObject$
|
|
5960
|
-
var TextContainer$1 = /*#__PURE__*/styled.div(_templateObject$
|
|
5752
|
+
var _templateObject$R;
|
|
5753
|
+
var TextContainer$1 = /*#__PURE__*/styled.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1,\n h2,\n h3,\n h4 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n }\n\n p {\n margin: 30px 0;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & strong {\n font-weight: bold;\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n & ul {\n padding: 0;\n list-style: none;\n margin: 0 0 0 30px;\n\n li {\n text-indent: -24px;\n line-height: var(--line-height-listing);\n }\n }\n\n & ol {\n padding: 0;\n margin: 0 0 0 20px;\n\n li {\n line-height: var(--line-height-listing);\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n width: 0px;\n margin-left: 20px;\n }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
|
|
5961
5754
|
var theme = _ref.theme;
|
|
5962
5755
|
return theme.colors.primary;
|
|
5963
5756
|
});
|
|
@@ -5985,8 +5778,8 @@ var TextOnly = function TextOnly(_ref) {
|
|
|
5985
5778
|
})));
|
|
5986
5779
|
};
|
|
5987
5780
|
|
|
5988
|
-
var _templateObject$
|
|
5989
|
-
var Wrapper$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
5781
|
+
var _templateObject$S, _templateObject2$y;
|
|
5782
|
+
var Wrapper$3 = /*#__PURE__*/styled.div(_templateObject$S || (_templateObject$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n height: 100%;\n width: fit-content;\n\n ", " {\n height: calc(100% - 12px - var(--line-height-body-2));\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), ImageAspectRatioWrapper, function (_ref) {
|
|
5990
5783
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
5991
5784
|
aspectRatio = _ref$aspectRatio === void 0 ? AspectRatio['1:1'] : _ref$aspectRatio;
|
|
5992
5785
|
return aspectRatio;
|
|
@@ -5996,7 +5789,7 @@ var Wrapper$3 = /*#__PURE__*/styled.div(_templateObject$T || (_templateObject$T
|
|
|
5996
5789
|
height = _ref2.height;
|
|
5997
5790
|
return "calc(calc(" + height + "px - 12px - var(--line-height-body-2)) * " + AspectRatioWidth[aspectRatio] + ")";
|
|
5998
5791
|
});
|
|
5999
|
-
var CaptionWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
5792
|
+
var CaptionWrapper = /*#__PURE__*/styled.div(_templateObject2$y || (_templateObject2$y = /*#__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"])));
|
|
6000
5793
|
|
|
6001
5794
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
6002
5795
|
var caption = _ref.caption,
|
|
@@ -6034,13 +5827,13 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
6034
5827
|
}, children), /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
6035
5828
|
};
|
|
6036
5829
|
|
|
6037
|
-
var _templateObject$
|
|
6038
|
-
var TextWrapper$3 = /*#__PURE__*/styled.div(_templateObject$
|
|
6039
|
-
var AttributionWrapper = /*#__PURE__*/styled.div(_templateObject2$
|
|
5830
|
+
var _templateObject$T, _templateObject2$z, _templateObject3$q;
|
|
5831
|
+
var TextWrapper$3 = /*#__PURE__*/styled.div(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
|
|
5832
|
+
var AttributionWrapper = /*#__PURE__*/styled.div(_templateObject2$z || (_templateObject2$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
6040
5833
|
var displayAttribution = _ref.displayAttribution;
|
|
6041
5834
|
return "display: " + (displayAttribution ? 'block' : 'none') + ";";
|
|
6042
5835
|
});
|
|
6043
|
-
var Line = /*#__PURE__*/styled.div(_templateObject3$
|
|
5836
|
+
var Line = /*#__PURE__*/styled.div(_templateObject3$q || (_templateObject3$q = /*#__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);
|
|
6044
5837
|
|
|
6045
5838
|
var Quote = function Quote(_ref) {
|
|
6046
5839
|
var text = _ref.text,
|
|
@@ -6064,8 +5857,8 @@ var Quote = function Quote(_ref) {
|
|
|
6064
5857
|
}, attribution))));
|
|
6065
5858
|
};
|
|
6066
5859
|
|
|
6067
|
-
var _templateObject$
|
|
6068
|
-
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
5860
|
+
var _templateObject$U;
|
|
5861
|
+
var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$U || (_templateObject$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
6069
5862
|
var theme = _ref.theme;
|
|
6070
5863
|
return theme.colors.primary;
|
|
6071
5864
|
}, function (_ref2) {
|
|
@@ -6958,5 +6751,5 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$V || (_templat
|
|
|
6958
6751
|
return theme.fonts.tablet.sizes.body[1];
|
|
6959
6752
|
}, devices.desktop, devices.largeDesktop);
|
|
6960
6753
|
|
|
6961
|
-
export { Accordion, Accordions, AltHeader, AnchorTabBar, AnnouncementBanner, AspectRatio, BodyText, Card, Cards, Carousel, CarouselType, CinemaBadge, Colors, ContactCard, ControlledDropdown, Editorial, Footer, GlobalStyles, Grid, GridItem, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, Icon, ImageAspectRatioWrapper, ImageWithCaption,
|
|
6754
|
+
export { Accordion, Accordions, AltHeader, AnchorTabBar, AnnouncementBanner, AspectRatio, BodyText, Card, Cards, Carousel, CarouselType, CinemaBadge, Colors, ContactCard, ControlledDropdown, Editorial, Footer, GlobalStyles, Grid, GridItem, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, Icon, ImageAspectRatioWrapper, ImageWithCaption, LiveChat, Navigation, Overline, PageHeadingCinema, PageHeadingCore, PageHeadingImpact, PageHeadingStream, PeopleListing, PrimaryButton, PromoWithTags, PromoWithTitle, Quote, RotatorButtons, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Sponsorship, StickyBar, StreamBadge, Subtitle, Tab, TabLink, Tabs, Button$1 as TertiaryButton, TextLink, TextOnly, Theme as ThemeProvider, ThemeType, Tickbox, TickboxMode, TitleWithCTA, TypeTags, devices };
|
|
6962
6755
|
//# sourceMappingURL=chord.esm.js.map
|