@royaloperahouse/chord 2.2.4 → 2.2.5-a-chord-development
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +213 -7
- package/README.md +250 -40
- package/dist/chord.cjs.development.js +201 -128
- 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 +201 -129
- package/dist/chord.esm.js.map +1 -1
- package/dist/components/index.d.ts +2 -2
- package/dist/components/molecules/PageHeading/index.d.ts +1 -1
- package/dist/components/molecules/PeopleListing/CreditListing/CreditListing.style.d.ts +1 -0
- package/dist/components/molecules/StatusBanner/StatusBanner.d.ts +4 -0
- package/dist/components/molecules/StatusBanner/StatusBanner.style.d.ts +3 -0
- package/dist/components/molecules/StatusBanner/index.d.ts +2 -0
- package/dist/components/molecules/index.d.ts +3 -2
- package/dist/index.d.ts +3 -2
- package/dist/types/formTypes.d.ts +12 -9
- package/dist/types/types.d.ts +10 -0
- package/package.json +1 -1
- package/README.GIT +0 -277
|
@@ -5786,7 +5786,8 @@ var Accordions = function Accordions(_ref) {
|
|
|
5786
5786
|
visibleStandfirst: accordion.visibleStandfirst,
|
|
5787
5787
|
contentType: accordion.contentType,
|
|
5788
5788
|
displayLevel: accordion.displayLevel,
|
|
5789
|
-
semanticLevel: accordion.semanticLevel
|
|
5789
|
+
semanticLevel: accordion.semanticLevel,
|
|
5790
|
+
initOpen: accordion.initOpen
|
|
5790
5791
|
}, accordion.children);
|
|
5791
5792
|
}));
|
|
5792
5793
|
};
|
|
@@ -6906,7 +6907,7 @@ var CompactHeaderBranding = function CompactHeaderBranding(_ref) {
|
|
|
6906
6907
|
var isIOS = function isIOS() {
|
|
6907
6908
|
try {
|
|
6908
6909
|
console.warn('Do not use this on server side rendering, it may throw an error.');
|
|
6909
|
-
if (typeof navigator === undefined) return false;
|
|
6910
|
+
if (typeof navigator === 'undefined') return false;
|
|
6910
6911
|
return ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) || // iPad on iOS 13 detection
|
|
6911
6912
|
navigator.userAgent.includes('Mac') && 'ontouchend' in document;
|
|
6912
6913
|
} catch (e) {
|
|
@@ -6922,7 +6923,7 @@ var useIOS = function useIOS() {
|
|
|
6922
6923
|
setIOS = _useState[1];
|
|
6923
6924
|
|
|
6924
6925
|
React.useEffect(function () {
|
|
6925
|
-
if (typeof navigator === undefined) return;
|
|
6926
|
+
if (typeof navigator === 'undefined') return;
|
|
6926
6927
|
setIOS(isIOS());
|
|
6927
6928
|
}, []);
|
|
6928
6929
|
return IOS;
|
|
@@ -7243,8 +7244,8 @@ var PeopleListing = function PeopleListing(_ref) {
|
|
|
7243
7244
|
var _templateObject$_, _templateObject2$I, _templateObject3$A, _templateObject4$s;
|
|
7244
7245
|
var ReplacementWrapper = /*#__PURE__*/styled__default.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n"])));
|
|
7245
7246
|
var CreditListingWrapper = /*#__PURE__*/styled__default(PeopleListingGrid)(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n p {\n line-height: 1.5;\n }\n"])));
|
|
7246
|
-
var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height:
|
|
7247
|
-
var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$s || (_templateObject4$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n
|
|
7247
|
+
var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n p {\n line-height: 1.5;\n margin-bottom: 4px;\n }\n"])));
|
|
7248
|
+
var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$s || (_templateObject4$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: var(--base-color-darkgrey);\n overflow-wrap: break-word;\n"])));
|
|
7248
7249
|
|
|
7249
7250
|
var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
|
|
7250
7251
|
return array.reduce(function (acc, item) {
|
|
@@ -7255,12 +7256,18 @@ var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop)
|
|
|
7255
7256
|
var concatenateMusicTitle = function concatenateMusicTitle(musicTitle) {
|
|
7256
7257
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, musicTitle.map(function (title, index) {
|
|
7257
7258
|
if (musicTitle.length > 1 && index === musicTitle.length - 1) {
|
|
7258
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i",
|
|
7259
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, ' ', "and ", /*#__PURE__*/React__default.createElement("i", {
|
|
7260
|
+
key: index
|
|
7261
|
+
}, title));
|
|
7259
7262
|
} else if (index > 0) {
|
|
7260
|
-
return /*#__PURE__*/React__default.createElement("i",
|
|
7263
|
+
return /*#__PURE__*/React__default.createElement("i", {
|
|
7264
|
+
key: index
|
|
7265
|
+
}, ", ", title);
|
|
7261
7266
|
}
|
|
7262
7267
|
|
|
7263
|
-
return /*#__PURE__*/React__default.createElement("i",
|
|
7268
|
+
return /*#__PURE__*/React__default.createElement("i", {
|
|
7269
|
+
key: index
|
|
7270
|
+
}, title);
|
|
7264
7271
|
}));
|
|
7265
7272
|
};
|
|
7266
7273
|
|
|
@@ -7766,8 +7773,73 @@ var RadioGroup = function RadioGroup(_ref) {
|
|
|
7766
7773
|
})));
|
|
7767
7774
|
};
|
|
7768
7775
|
|
|
7769
|
-
var _templateObject$12;
|
|
7770
|
-
var
|
|
7776
|
+
var _templateObject$12, _templateObject2$L, _templateObject3$D;
|
|
7777
|
+
var StatusBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 26px 150px;\n display: flex;\n justify-content: space-between;\n background-color: var(--base-color-lightgrey);\n transition: transform 0.3s ease;\n transform-origin: top;\n\n @media ", " {\n padding: 20px 20px;\n }\n\n @media ", " {\n padding: 20px 50px;\n }\n\n &.closing {\n transform: scaleY(0);\n }\n"])), devices.mobile, devices.tablet);
|
|
7778
|
+
var ContentContainer$3 = /*#__PURE__*/styled__default.div(_templateObject2$L || (_templateObject2$L = /*#__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"])));
|
|
7779
|
+
var SvgContainer$3 = /*#__PURE__*/styled__default.div(_templateObject3$D || (_templateObject3$D = /*#__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);
|
|
7780
|
+
|
|
7781
|
+
var StatusBanner = function StatusBanner(_ref) {
|
|
7782
|
+
var statusText = _ref.statusText,
|
|
7783
|
+
_ref$visibility = _ref.visibility,
|
|
7784
|
+
visibility = _ref$visibility === void 0 ? true : _ref$visibility;
|
|
7785
|
+
|
|
7786
|
+
var _useState = React.useState(visibility),
|
|
7787
|
+
isVisible = _useState[0],
|
|
7788
|
+
setIsVisible = _useState[1];
|
|
7789
|
+
|
|
7790
|
+
var _useState2 = React.useState(false),
|
|
7791
|
+
isClosing = _useState2[0],
|
|
7792
|
+
setIsClosing = _useState2[1];
|
|
7793
|
+
|
|
7794
|
+
var content = React.useRef(null);
|
|
7795
|
+
|
|
7796
|
+
var handleCloseBanner = function handleCloseBanner() {
|
|
7797
|
+
setIsClosing(true);
|
|
7798
|
+
|
|
7799
|
+
var transitionEnd = function transitionEnd() {
|
|
7800
|
+
setIsVisible(!visibility);
|
|
7801
|
+
|
|
7802
|
+
if (content.current) {
|
|
7803
|
+
content.current.removeEventListener('transitionend', transitionEnd);
|
|
7804
|
+
}
|
|
7805
|
+
};
|
|
7806
|
+
|
|
7807
|
+
if (content.current) {
|
|
7808
|
+
content.current.addEventListener('transitionend', transitionEnd);
|
|
7809
|
+
}
|
|
7810
|
+
|
|
7811
|
+
setTimeout(function () {
|
|
7812
|
+
setIsVisible(!visibility);
|
|
7813
|
+
}, 300);
|
|
7814
|
+
};
|
|
7815
|
+
|
|
7816
|
+
var onKeyboardCloseHandler = function onKeyboardCloseHandler(e) {
|
|
7817
|
+
if (e.key === 'Enter') {
|
|
7818
|
+
handleCloseBanner();
|
|
7819
|
+
}
|
|
7820
|
+
};
|
|
7821
|
+
|
|
7822
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, isVisible && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(StatusBannerWrapper, {
|
|
7823
|
+
role: "alert",
|
|
7824
|
+
className: isClosing ? 'closing' : '',
|
|
7825
|
+
"data-testid": "statusContainer"
|
|
7826
|
+
}, /*#__PURE__*/React__default.createElement(ContentContainer$3, null, /*#__PURE__*/React__default.createElement("div", {
|
|
7827
|
+
dangerouslySetInnerHTML: {
|
|
7828
|
+
__html: statusText
|
|
7829
|
+
}
|
|
7830
|
+
})), /*#__PURE__*/React__default.createElement(SvgContainer$3, {
|
|
7831
|
+
onClick: handleCloseBanner,
|
|
7832
|
+
tabIndex: 0,
|
|
7833
|
+
role: "button",
|
|
7834
|
+
"aria-label": "Close",
|
|
7835
|
+
onKeyDown: onKeyboardCloseHandler
|
|
7836
|
+
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
7837
|
+
iconName: "Close"
|
|
7838
|
+
})))));
|
|
7839
|
+
};
|
|
7840
|
+
|
|
7841
|
+
var _templateObject$13;
|
|
7842
|
+
var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$13 || (_templateObject$13 = /*#__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);
|
|
7771
7843
|
|
|
7772
7844
|
var SectionTitle = function SectionTitle(_ref) {
|
|
7773
7845
|
var title = _ref.title,
|
|
@@ -7793,8 +7865,8 @@ var SectionTitle = function SectionTitle(_ref) {
|
|
|
7793
7865
|
}, description))));
|
|
7794
7866
|
};
|
|
7795
7867
|
|
|
7796
|
-
var _templateObject$
|
|
7797
|
-
var stateStyles = /*#__PURE__*/styled.css(_templateObject$
|
|
7868
|
+
var _templateObject$14, _templateObject2$M, _templateObject3$E, _templateObject4$v, _templateObject5$n, _templateObject6$i, _templateObject7$e, _templateObject8$a, _templateObject9$5, _templateObject10$5, _templateObject11$3;
|
|
7869
|
+
var stateStyles = /*#__PURE__*/styled.css(_templateObject$14 || (_templateObject$14 = /*#__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) {
|
|
7798
7870
|
var theme = _ref.theme;
|
|
7799
7871
|
return "3px solid " + theme.colors.lapisLazuli;
|
|
7800
7872
|
}, function (_ref2) {
|
|
@@ -7804,11 +7876,11 @@ var stateStyles = /*#__PURE__*/styled.css(_templateObject$13 || (_templateObject
|
|
|
7804
7876
|
var theme = _ref3.theme;
|
|
7805
7877
|
return theme.colors.lightgrey;
|
|
7806
7878
|
});
|
|
7807
|
-
var borderStyles = /*#__PURE__*/styled.css(_templateObject2$
|
|
7879
|
+
var borderStyles = /*#__PURE__*/styled.css(_templateObject2$M || (_templateObject2$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-radius: 0;\n outline: 1px solid ", ";\n"])), function (_ref4) {
|
|
7808
7880
|
var theme = _ref4.theme;
|
|
7809
7881
|
return theme.colors.darkgrey;
|
|
7810
7882
|
});
|
|
7811
|
-
var noMarginAndPaddingStyles = /*#__PURE__*/styled.css(_templateObject3$
|
|
7883
|
+
var noMarginAndPaddingStyles = /*#__PURE__*/styled.css(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0;\n padding: 0;\n"])));
|
|
7812
7884
|
var listItemStyles = /*#__PURE__*/styled.css(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n list-style: none;\n user-select: none;\n"])));
|
|
7813
7885
|
var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
|
|
7814
7886
|
var theme = _ref5.theme;
|
|
@@ -8215,8 +8287,8 @@ function Select(_ref3) {
|
|
|
8215
8287
|
}))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
|
|
8216
8288
|
}
|
|
8217
8289
|
|
|
8218
|
-
var _templateObject$
|
|
8219
|
-
var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8290
|
+
var _templateObject$15;
|
|
8291
|
+
var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n text-transform: var(--text-transform-body);\n\n & h1,\n h2,\n h3,\n h4 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n }\n\n p {\n margin: 30px 0;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & strong {\n font-weight: bold;\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n & ul {\n padding: 0;\n list-style: none;\n margin: 0 0 0 30px;\n\n li {\n text-indent: -20px;\n line-height: var(--line-height-listing);\n }\n }\n\n & ol {\n padding: 0;\n margin: 0 0 0 20px;\n\n li {\n line-height: var(--line-height-listing);\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n width: 0px;\n margin-left: 12px;\n margin-right: 8px;\n }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
|
|
8220
8292
|
var theme = _ref.theme;
|
|
8221
8293
|
return theme.colors.primary;
|
|
8222
8294
|
});
|
|
@@ -8244,8 +8316,8 @@ var TextOnly = function TextOnly(_ref) {
|
|
|
8244
8316
|
})));
|
|
8245
8317
|
};
|
|
8246
8318
|
|
|
8247
|
-
var _templateObject$
|
|
8248
|
-
var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8319
|
+
var _templateObject$16, _templateObject2$N;
|
|
8320
|
+
var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$16 || (_templateObject$16 = /*#__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) {
|
|
8249
8321
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
8250
8322
|
aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
|
|
8251
8323
|
return aspectRatio;
|
|
@@ -8255,7 +8327,7 @@ var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$15 || (_templat
|
|
|
8255
8327
|
height = _ref2.height;
|
|
8256
8328
|
return "calc(calc(" + height + "px - 12px - var(--line-height-body-2)) * " + AspectRatioWidth[aspectRatio] + ")";
|
|
8257
8329
|
});
|
|
8258
|
-
var CaptionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8330
|
+
var CaptionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$N || (_templateObject2$N = /*#__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"])));
|
|
8259
8331
|
|
|
8260
8332
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
8261
8333
|
var caption = _ref.caption,
|
|
@@ -8293,13 +8365,13 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
8293
8365
|
}, children), /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
8294
8366
|
};
|
|
8295
8367
|
|
|
8296
|
-
var _templateObject$
|
|
8297
|
-
var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8298
|
-
var AttributionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8368
|
+
var _templateObject$17, _templateObject2$O, _templateObject3$F;
|
|
8369
|
+
var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
|
|
8370
|
+
var AttributionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
8299
8371
|
var displayAttribution = _ref.displayAttribution;
|
|
8300
8372
|
return "display: " + (displayAttribution ? 'block' : 'none') + ";";
|
|
8301
8373
|
});
|
|
8302
|
-
var Line$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8374
|
+
var Line$1 = /*#__PURE__*/styled__default.div(_templateObject3$F || (_templateObject3$F = /*#__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);
|
|
8303
8375
|
|
|
8304
8376
|
var Quote = function Quote(_ref) {
|
|
8305
8377
|
var text = _ref.text,
|
|
@@ -8323,10 +8395,10 @@ var Quote = function Quote(_ref) {
|
|
|
8323
8395
|
}, attribution))));
|
|
8324
8396
|
};
|
|
8325
8397
|
|
|
8326
|
-
var _templateObject$
|
|
8327
|
-
var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8328
|
-
var ContentContainer$
|
|
8329
|
-
var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$
|
|
8398
|
+
var _templateObject$18, _templateObject2$P, _templateObject3$G, _templateObject4$w, _templateObject5$o, _templateObject6$j;
|
|
8399
|
+
var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$18 || (_templateObject$18 = /*#__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"])));
|
|
8400
|
+
var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
8401
|
+
var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
8330
8402
|
var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
8331
8403
|
var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$o || (_templateObject5$o = /*#__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);
|
|
8332
8404
|
var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$j || (_templateObject6$j = /*#__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);
|
|
@@ -8360,18 +8432,18 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
8360
8432
|
columnSpanDevice: 4,
|
|
8361
8433
|
columnStartDesktop: 4,
|
|
8362
8434
|
columnSpanDesktop: 4
|
|
8363
|
-
}, /*#__PURE__*/React__default.createElement(ContentContainer$
|
|
8435
|
+
}, /*#__PURE__*/React__default.createElement(ContentContainer$4, null, /*#__PURE__*/React__default.createElement(Overline, {
|
|
8364
8436
|
level: 4
|
|
8365
8437
|
}, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$2, null, /*#__PURE__*/React__default.createElement(Overline, {
|
|
8366
8438
|
level: 2
|
|
8367
8439
|
}, title)))));
|
|
8368
8440
|
};
|
|
8369
8441
|
|
|
8370
|
-
var _templateObject$
|
|
8371
|
-
var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8372
|
-
var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8373
|
-
var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8374
|
-
var ContentContainer$
|
|
8442
|
+
var _templateObject$19, _templateObject2$Q, _templateObject3$H, _templateObject4$x;
|
|
8443
|
+
var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$19 || (_templateObject$19 = /*#__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"])));
|
|
8444
|
+
var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n"])));
|
|
8445
|
+
var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
8446
|
+
var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject4$x || (_templateObject4$x = /*#__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"])));
|
|
8375
8447
|
|
|
8376
8448
|
var keyDown = function keyDown(e, toggleFunction) {
|
|
8377
8449
|
if (e.key === 'Enter' || e.key === 'Space') {
|
|
@@ -8434,7 +8506,7 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
8434
8506
|
var truncatedText = truncate ? truncateReactNodeString(introText != null ? introText : '', INTRO_CHAR_LIMIT, true) : introText;
|
|
8435
8507
|
|
|
8436
8508
|
var IntroText = function IntroText() {
|
|
8437
|
-
return introText ? /*#__PURE__*/React__default.createElement(ContentContainer$
|
|
8509
|
+
return introText ? /*#__PURE__*/React__default.createElement(ContentContainer$5, null, /*#__PURE__*/React__default.createElement(FullTextContainer, null, truncate ? /*#__PURE__*/React__default.createElement("div", {
|
|
8438
8510
|
dangerouslySetInnerHTML: {
|
|
8439
8511
|
__html: "" + truncatedText
|
|
8440
8512
|
}
|
|
@@ -8452,7 +8524,7 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
8452
8524
|
}, /*#__PURE__*/React__default.createElement(Header, {
|
|
8453
8525
|
level: 5,
|
|
8454
8526
|
semanticLevel: 3
|
|
8455
|
-
}, title)), !isFullTextOpen && /*#__PURE__*/React__default.createElement(IntroText, null), /*#__PURE__*/React__default.createElement(ContentContainer$
|
|
8527
|
+
}, title)), !isFullTextOpen && /*#__PURE__*/React__default.createElement(IntroText, null), /*#__PURE__*/React__default.createElement(ContentContainer$5, {
|
|
8456
8528
|
"data-testid": "richcontainer",
|
|
8457
8529
|
ref: readMoreContent,
|
|
8458
8530
|
id: contentContainerId,
|
|
@@ -8469,96 +8541,14 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
8469
8541
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText)));
|
|
8470
8542
|
};
|
|
8471
8543
|
|
|
8472
|
-
var _templateObject$
|
|
8473
|
-
var MenuContainer$2 = /*#__PURE__*/styled__default.menu(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
8474
|
-
var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n @media ", " {\n margin-left: 0px;\n }\n }\n @media ", " {\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n }\n"])), exports.Colors.LightGrey, devices.mobile, devices.mobile, function (_ref) {
|
|
8475
|
-
var mobileOpen = _ref.mobileOpen;
|
|
8476
|
-
return mobileOpen ? "block" : 'none';
|
|
8477
|
-
}, exports.Colors.White, exports.Colors.DarkGrey);
|
|
8478
|
-
var MenuItem$1 = /*#__PURE__*/styled__default.button(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 20px 15px 5px;\n border: 0;\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n @media ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), exports.Colors.Black, function (_ref2) {
|
|
8479
|
-
var active = _ref2.active;
|
|
8480
|
-
return active ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
|
|
8481
|
-
}, exports.Colors.MidGrey, devices.mobile);
|
|
8482
|
-
var MobileButton = /*#__PURE__*/styled__default.button(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 46px 14px 20px;\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-radius: 0;\n display: none;\n width: 100%;\n text-align: left;\n cursor: pointer;\n position: relative;\n span {\n width: 25px;\n height: 25px;\n position: absolute;\n top: 50%;\n margin-top: -12px;\n right: 10px;\n }\n @media ", " {\n display: block;\n }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey, devices.mobile);
|
|
8483
|
-
|
|
8484
|
-
/**
|
|
8485
|
-
* Vertical menu component uses for navigation
|
|
8486
|
-
* inside website chapter. It looks like a vertical
|
|
8487
|
-
* list with clickable items on desktop and dropdown
|
|
8488
|
-
* list on mobile.
|
|
8489
|
-
*
|
|
8490
|
-
* ## Menu items
|
|
8491
|
-
* Menu items should be passed as `items` prop. This
|
|
8492
|
-
* should be an array of objects. Each object should
|
|
8493
|
-
* have `text` (text displayed as a menu item) and
|
|
8494
|
-
* `onClick` (click handler function)
|
|
8495
|
-
*
|
|
8496
|
-
* ## Active menu item
|
|
8497
|
-
* Active menu item should be passed as component `activeItem`
|
|
8498
|
-
* prop. This indicates on which menu item should be highlighted
|
|
8499
|
-
* as active one. Should be equal to `text` prop from one of the `items`
|
|
8500
|
-
*/
|
|
8501
|
-
|
|
8502
|
-
var AuxiliaryNav = function AuxiliaryNav(_ref) {
|
|
8503
|
-
var items = _ref.items,
|
|
8504
|
-
activeItem = _ref.activeItem;
|
|
8505
|
-
|
|
8506
|
-
var _useState = React.useState(false),
|
|
8507
|
-
mobileOpen = _useState[0],
|
|
8508
|
-
setMobileOpen = _useState[1];
|
|
8509
|
-
|
|
8510
|
-
var containerRef = React.useRef(null);
|
|
8511
|
-
|
|
8512
|
-
var mobileButtonClickHandler = function mobileButtonClickHandler() {
|
|
8513
|
-
setMobileOpen(function (prev) {
|
|
8514
|
-
return !prev;
|
|
8515
|
-
});
|
|
8516
|
-
};
|
|
8517
|
-
|
|
8518
|
-
var outsideClickHandler = function outsideClickHandler(event) {
|
|
8519
|
-
if (containerRef.current && !containerRef.current.contains(event.target)) {
|
|
8520
|
-
setMobileOpen(false);
|
|
8521
|
-
}
|
|
8522
|
-
};
|
|
8523
|
-
|
|
8524
|
-
React.useEffect(function () {
|
|
8525
|
-
document.addEventListener('mousedown', outsideClickHandler);
|
|
8526
|
-
return function () {
|
|
8527
|
-
document.removeEventListener('mousedown', outsideClickHandler);
|
|
8528
|
-
};
|
|
8529
|
-
}, [containerRef]);
|
|
8530
|
-
return /*#__PURE__*/React__default.createElement(MenuContainer$2, {
|
|
8531
|
-
ref: containerRef,
|
|
8532
|
-
"data-testid": "nav-menu-container"
|
|
8533
|
-
}, /*#__PURE__*/React__default.createElement(MobileButton, {
|
|
8534
|
-
mobileOpen: mobileOpen,
|
|
8535
|
-
onClick: mobileButtonClickHandler,
|
|
8536
|
-
"data-testid": "nav-menu-mobile-button"
|
|
8537
|
-
}, activeItem, /*#__PURE__*/React__default.createElement(Icon, {
|
|
8538
|
-
iconName: "DropdownArrow",
|
|
8539
|
-
direction: mobileOpen ? 'left' : 'right'
|
|
8540
|
-
})), /*#__PURE__*/React__default.createElement(MenuList, {
|
|
8541
|
-
mobileOpen: mobileOpen,
|
|
8542
|
-
"data-testid": "nav-menu-list"
|
|
8543
|
-
}, items.map(function (item, idx) {
|
|
8544
|
-
return /*#__PURE__*/React__default.createElement("li", {
|
|
8545
|
-
key: item.text + "-" + idx
|
|
8546
|
-
}, /*#__PURE__*/React__default.createElement(MenuItem$1, {
|
|
8547
|
-
onClick: item.onClick,
|
|
8548
|
-
active: item.text === activeItem,
|
|
8549
|
-
"data-testid": "nav-menu-item" + (item.text === activeItem ? '-active' : '')
|
|
8550
|
-
}, item.text));
|
|
8551
|
-
})));
|
|
8552
|
-
};
|
|
8553
|
-
|
|
8554
|
-
var _templateObject$1a, _templateObject2$R, _templateObject3$I, _templateObject4$z, _templateObject5$p, _templateObject6$k;
|
|
8544
|
+
var _templateObject$1a, _templateObject2$R, _templateObject3$I, _templateObject4$y, _templateObject5$p, _templateObject6$k;
|
|
8555
8545
|
var Container$1 = /*#__PURE__*/styled__default.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
8556
8546
|
var Sections = /*#__PURE__*/styled__default.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
8557
8547
|
var Section = /*#__PURE__*/styled__default.div(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
8558
8548
|
var color = _ref.color;
|
|
8559
8549
|
return "var(--base-color-" + color + ")";
|
|
8560
8550
|
});
|
|
8561
|
-
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8551
|
+
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
8562
8552
|
var Text = /*#__PURE__*/styled__default.div(_templateObject5$p || (_templateObject5$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
8563
8553
|
var color = _ref2.color;
|
|
8564
8554
|
return "var(--base-color-" + color + ")";
|
|
@@ -8649,6 +8639,88 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
8649
8639
|
}, strengthLabel))));
|
|
8650
8640
|
};
|
|
8651
8641
|
|
|
8642
|
+
var _templateObject$1b, _templateObject2$S, _templateObject3$J, _templateObject4$z;
|
|
8643
|
+
var MenuContainer$2 = /*#__PURE__*/styled__default.menu(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
8644
|
+
var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n @media ", " {\n margin-left: 0px;\n }\n }\n @media ", " {\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n }\n"])), exports.Colors.LightGrey, devices.mobile, devices.mobile, function (_ref) {
|
|
8645
|
+
var mobileOpen = _ref.mobileOpen;
|
|
8646
|
+
return mobileOpen ? "block" : 'none';
|
|
8647
|
+
}, exports.Colors.White, exports.Colors.DarkGrey);
|
|
8648
|
+
var MenuItem$1 = /*#__PURE__*/styled__default.button(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 20px 15px 5px;\n border: 0;\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n @media ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), exports.Colors.Black, function (_ref2) {
|
|
8649
|
+
var active = _ref2.active;
|
|
8650
|
+
return active ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
|
|
8651
|
+
}, exports.Colors.MidGrey, devices.mobile);
|
|
8652
|
+
var MobileButton = /*#__PURE__*/styled__default.button(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 46px 14px 20px;\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-radius: 0;\n display: none;\n width: 100%;\n text-align: left;\n cursor: pointer;\n position: relative;\n span {\n width: 25px;\n height: 25px;\n position: absolute;\n top: 50%;\n margin-top: -12px;\n right: 10px;\n }\n @media ", " {\n display: block;\n }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey, devices.mobile);
|
|
8653
|
+
|
|
8654
|
+
/**
|
|
8655
|
+
* Vertical menu component uses for navigation
|
|
8656
|
+
* inside website chapter. It looks like a vertical
|
|
8657
|
+
* list with clickable items on desktop and dropdown
|
|
8658
|
+
* list on mobile.
|
|
8659
|
+
*
|
|
8660
|
+
* ## Menu items
|
|
8661
|
+
* Menu items should be passed as `items` prop. This
|
|
8662
|
+
* should be an array of objects. Each object should
|
|
8663
|
+
* have `text` (text displayed as a menu item) and
|
|
8664
|
+
* `onClick` (click handler function)
|
|
8665
|
+
*
|
|
8666
|
+
* ## Active menu item
|
|
8667
|
+
* Active menu item should be passed as component `activeItem`
|
|
8668
|
+
* prop. This indicates on which menu item should be highlighted
|
|
8669
|
+
* as active one. Should be equal to `text` prop from one of the `items`
|
|
8670
|
+
*/
|
|
8671
|
+
|
|
8672
|
+
var AuxiliaryNav = function AuxiliaryNav(_ref) {
|
|
8673
|
+
var items = _ref.items,
|
|
8674
|
+
activeItem = _ref.activeItem;
|
|
8675
|
+
|
|
8676
|
+
var _useState = React.useState(false),
|
|
8677
|
+
mobileOpen = _useState[0],
|
|
8678
|
+
setMobileOpen = _useState[1];
|
|
8679
|
+
|
|
8680
|
+
var containerRef = React.useRef(null);
|
|
8681
|
+
|
|
8682
|
+
var mobileButtonClickHandler = function mobileButtonClickHandler() {
|
|
8683
|
+
setMobileOpen(function (prev) {
|
|
8684
|
+
return !prev;
|
|
8685
|
+
});
|
|
8686
|
+
};
|
|
8687
|
+
|
|
8688
|
+
var outsideClickHandler = function outsideClickHandler(event) {
|
|
8689
|
+
if (containerRef.current && !containerRef.current.contains(event.target)) {
|
|
8690
|
+
setMobileOpen(false);
|
|
8691
|
+
}
|
|
8692
|
+
};
|
|
8693
|
+
|
|
8694
|
+
React.useEffect(function () {
|
|
8695
|
+
document.addEventListener('mousedown', outsideClickHandler);
|
|
8696
|
+
return function () {
|
|
8697
|
+
document.removeEventListener('mousedown', outsideClickHandler);
|
|
8698
|
+
};
|
|
8699
|
+
}, [containerRef]);
|
|
8700
|
+
return /*#__PURE__*/React__default.createElement(MenuContainer$2, {
|
|
8701
|
+
ref: containerRef,
|
|
8702
|
+
"data-testid": "nav-menu-container"
|
|
8703
|
+
}, /*#__PURE__*/React__default.createElement(MobileButton, {
|
|
8704
|
+
mobileOpen: mobileOpen,
|
|
8705
|
+
onClick: mobileButtonClickHandler,
|
|
8706
|
+
"data-testid": "nav-menu-mobile-button"
|
|
8707
|
+
}, activeItem, /*#__PURE__*/React__default.createElement(Icon, {
|
|
8708
|
+
iconName: "DropdownArrow",
|
|
8709
|
+
direction: mobileOpen ? 'left' : 'right'
|
|
8710
|
+
})), /*#__PURE__*/React__default.createElement(MenuList, {
|
|
8711
|
+
mobileOpen: mobileOpen,
|
|
8712
|
+
"data-testid": "nav-menu-list"
|
|
8713
|
+
}, items.map(function (item, idx) {
|
|
8714
|
+
return /*#__PURE__*/React__default.createElement("li", {
|
|
8715
|
+
key: item.text + "-" + idx
|
|
8716
|
+
}, /*#__PURE__*/React__default.createElement(MenuItem$1, {
|
|
8717
|
+
onClick: item.onClick,
|
|
8718
|
+
active: item.text === activeItem,
|
|
8719
|
+
"data-testid": "nav-menu-item" + (item.text === activeItem ? '-active' : '')
|
|
8720
|
+
}, item.text));
|
|
8721
|
+
})));
|
|
8722
|
+
};
|
|
8723
|
+
|
|
8652
8724
|
var UpsellSection = function UpsellSection(_ref) {
|
|
8653
8725
|
var title = _ref.title,
|
|
8654
8726
|
richText = _ref.richText,
|
|
@@ -8737,9 +8809,9 @@ var LiveChat = function LiveChat() {
|
|
|
8737
8809
|
});
|
|
8738
8810
|
};
|
|
8739
8811
|
|
|
8740
|
-
var _templateObject$
|
|
8741
|
-
var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8742
|
-
var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
8812
|
+
var _templateObject$1c, _templateObject2$T;
|
|
8813
|
+
var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--base-color-white);\n"])), zIndexes.anchor);
|
|
8814
|
+
var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n padding: 28px 0 26px;\n\n @media ", " {\n padding: 24px 0 28px;\n }\n\n @media ", " {\n border-bottom: none;\n }\n"])), function (_ref) {
|
|
8743
8815
|
var hideBottomBorder = _ref.hideBottomBorder;
|
|
8744
8816
|
return !hideBottomBorder && 'border-bottom: 2px solid var(--base-color-lightgrey);';
|
|
8745
8817
|
}, devices.mobileAndTablet, devices.mobile);
|
|
@@ -8767,10 +8839,10 @@ var StickyBar = function StickyBar(_ref) {
|
|
|
8767
8839
|
}, children)));
|
|
8768
8840
|
};
|
|
8769
8841
|
|
|
8770
|
-
var _templateObject$
|
|
8771
|
-
var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8772
|
-
var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$
|
|
8773
|
-
var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8842
|
+
var _templateObject$1d, _templateObject2$U, _templateObject3$K, _templateObject4$A;
|
|
8843
|
+
var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 62px;\n background-color: var(--base-color-white);\n z-index: ", ";\n position: relative;\n\n @media ", ", ", " {\n height: 100vh;\n padding: 62px 0 0;\n }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
|
|
8844
|
+
var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n right: 0;\n margin: 15px;\n height: 26px;\n width: 26px;\n padding: 0;\n background-color: transparent;\n border: none;\n cursor: pointer;\n @media ", " {\n margin: 25px;\n }\n @media ", ", ", " {\n margin: 30px;\n }\n"])), devices.tablet, devices.desktop, devices.largeDesktop);
|
|
8845
|
+
var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
8774
8846
|
var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n align-content: center;\n background-color: rgba(0, 0, 0, 0.4);\n"])));
|
|
8775
8847
|
|
|
8776
8848
|
var _excluded$k = ["isOpen", "setIsOpen", "children", "appElementId"];
|
|
@@ -8892,8 +8964,8 @@ var ModalWindow = function ModalWindow(_ref) {
|
|
|
8892
8964
|
})), /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, children))), /*#__PURE__*/React__default.createElement(ScrollLock, null)));
|
|
8893
8965
|
};
|
|
8894
8966
|
|
|
8895
|
-
var _templateObject$
|
|
8896
|
-
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
8967
|
+
var _templateObject$1e;
|
|
8968
|
+
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
8897
8969
|
var theme = _ref.theme;
|
|
8898
8970
|
return theme.colors.primary;
|
|
8899
8971
|
}, function (_ref2) {
|
|
@@ -9888,6 +9960,7 @@ exports.SectionSplitter = SectionSplitter;
|
|
|
9888
9960
|
exports.SectionTitle = SectionTitle;
|
|
9889
9961
|
exports.Select = Select;
|
|
9890
9962
|
exports.Sponsorship = Sponsorship;
|
|
9963
|
+
exports.StatusBanner = StatusBanner;
|
|
9891
9964
|
exports.Stepper = Component;
|
|
9892
9965
|
exports.StickyBar = StickyBar;
|
|
9893
9966
|
exports.StreamBadge = StreamBadge;
|