@royaloperahouse/chord 0.5.0 → 0.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/chord.esm.js CHANGED
@@ -4156,7 +4156,7 @@ var Carousel = function Carousel(_ref) {
4156
4156
 
4157
4157
  var _templateObject$y, _templateObject2$i, _templateObject3$c, _templateObject4$9, _templateObject5$5, _templateObject6$5, _templateObject7$3, _templateObject8$3, _templateObject9$2, _templateObject10$1;
4158
4158
  var HighlightsGrid = /*#__PURE__*/styled(Grid)(_templateObject$y || (_templateObject$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n grid-template-rows: max-content minmax(0, 1fr);\n gap: 0 var(--grid-column-gap);\n background-color: var(--base-color-black);\n color: var(--base-color-white);\n user-select: none;\n\n @media ", " {\n & {\n grid-template-rows: min-content max-content max-content;\n }\n }\n"])), devices.mobile);
4159
- var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$i || (_templateObject2$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 1 / 1 / 7;\n width: calc(100% + var(--grid-column-gap) - 86px);\n padding-top: 40px;\n padding-left: 50px;\n padding-right: 36px;\n user-select: text;\n\n h4 {\n margin: 0;\n padding: 0;\n }\n\n h5 {\n display: none;\n }\n\n @media ", " {\n & {\n width: calc(100% - 78px + var(--grid-column-gap));\n grid-area: 1 / 1 / 1 / 6;\n padding-top: 32px;\n padding-right: 28px;\n\n h4 {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n }\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 11;\n width: calc(100% - 20px);\n padding: 8px 0 8px 20px;\n min-height: var(--line-height-altHeader-5);\n\n h4 {\n display: none;\n }\n\n h5 {\n margin: 0;\n padding: 0;\n display: block;\n }\n }\n }\n"])), devices.tablet, function (_ref) {
4159
+ var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$i || (_templateObject2$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 1 / 1 / 1 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n padding-top: 40px;\n padding-left: 50px;\n padding-right: 36px;\n user-select: text;\n\n h4 {\n margin: 0;\n padding: 0;\n }\n\n h5 {\n display: none;\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 1 / 6;\n padding-top: 32px;\n padding-right: 28px;\n\n h4 {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n }\n }\n\n @media ", " {\n & {\n grid-area: 1 / 1 / 2 / 11;\n width: 100%;\n padding: 8px 0 8px 20px;\n min-height: var(--line-height-altHeader-5);\n\n h4 {\n display: none;\n }\n\n h5 {\n margin: 0;\n padding: 0;\n display: block;\n }\n }\n }\n"])), devices.tablet, function (_ref) {
4160
4160
  var theme = _ref.theme;
4161
4161
  return theme.fonts.mobile.sizes.altHeaders[4];
4162
4162
  }, function (_ref2) {
@@ -4169,7 +4169,7 @@ var CarouselTitleWrapper = /*#__PURE__*/styled.div(_templateObject2$i || (_templ
4169
4169
  var theme = _ref4.theme;
4170
4170
  return theme.fonts.mobile.lineHeights.altHeaders[4];
4171
4171
  }, devices.mobile);
4172
- var InfoWrapper = /*#__PURE__*/styled.div(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 2 / 1 / 2 / 7;\n width: calc(100% + var(--grid-column-gap) - 86px);\n align-self: center;\n padding: 36px 36px 36px 50px;\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 2 / 6;\n width: calc(100% + var(--grid-column-gap) - 78px);\n padding: 28px 28px 28px 50px;\n }\n }\n\n @media ", " {\n & {\n grid-area: 3 / 1 / 4 / 15;\n width: calc(100% - 40px);\n padding: 0 20px;\n margin: 24px 0;\n }\n }\n"])), devices.tablet, devices.mobile);
4172
+ var InfoWrapper = /*#__PURE__*/styled.div(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: 2 / 1 / 2 / 7;\n box-sizing: border-box;\n width: calc(100% + var(--grid-column-gap));\n align-self: center;\n padding: 36px 36px 36px 50px;\n\n @media ", " {\n & {\n grid-area: 2 / 1 / 2 / 6;\n padding: 28px 28px 28px 50px;\n }\n }\n\n @media ", " {\n & {\n grid-area: 3 / 1 / 4 / 15;\n width: 100%;\n padding: 0 20px;\n margin: 24px 0;\n }\n }\n"])), devices.tablet, devices.mobile);
4173
4173
  var InfoLogoWrapper = /*#__PURE__*/styled.div(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n width: 132px;\n height: 36px;\n\n @media ", " {\n & {\n margin-bottom: 20px;\n width: 102px;\n height: 28px;\n }\n }\n"])), devices.mobile);
4174
4174
  var InfoTitleWrapper = /*#__PURE__*/styled.div(_templateObject5$5 || (_templateObject5$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: text;\n h3 {\n padding: 0;\n margin: 0 0 8px 0;\n }\n\n h6 {\n padding: 0;\n margin: 0;\n }\n\n @media ", " {\n & {\n h3 {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n\n h6 {\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n line-height: ", ";\n }\n }\n }\n"])), devices.tablet, function (_ref5) {
4175
4175
  var theme = _ref5.theme;