@royaloperahouse/harmonic 0.11.0-f → 0.11.0-h

package/dist/components/atoms/SectionSplitter/SectionSplitter.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { ISectionSplitterProps } from '../../../types/types';
-declare const SectionSplitter: ({ fullWidth }: ISectionSplitterProps) => React.JSX.Element;
+declare const SectionSplitter: ({ fullWidth, className }: ISectionSplitterProps) => React.JSX.Element;
 export default SectionSplitter;

package/dist/harmonic.cjs.development.js

@@ -3539,12 +3539,15 @@ var SecondaryLogo = function SecondaryLogo(_ref) {
 
 var _templateObject$h, _templateObject2$a;
 var SectionSplitterContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 4px;\n"])));
-var Splitter = /*#__PURE__*/styled__default.div(_templateObject2$a || (_templateObject2$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  height: 4px;\n  background: var(--base-color-light-grey);\n"])));
+var Splitter = /*#__PURE__*/styled__default.div(_templateObject2$a || (_templateObject2$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  height: 4px;\n  background: var(--color-base-light-grey);\n"])));
 
 var SectionSplitter = function SectionSplitter(_ref) {
   var _ref$fullWidth = _ref.fullWidth,
-    fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth;
-  return /*#__PURE__*/React__default.createElement(SectionSplitterContainer, null, fullWidth ? (/*#__PURE__*/React__default.createElement(GridItem, {
+    fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth,
+    className = _ref.className;
+  return /*#__PURE__*/React__default.createElement(SectionSplitterContainer, {
+    className: className
+  }, fullWidth ? (/*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: 1,
     columnSpanDesktop: 16,
     columnStartDevice: 1,
@@ -4492,7 +4495,7 @@ var TypeTags = function TypeTags(_ref) {
     return /*#__PURE__*/React__default.createElement("li", {
       key: t
     }, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
-      size: "large"
+      size: "medium"
     }, t));
   }));
 };
@@ -9956,12 +9959,12 @@ var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$H ||
   }
   return '';
 });
-var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: ", ";\n\n  @media ", " {\n    margin-bottom: ", ";\n  }\n"])), function (_ref7) {
+var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: ", ";\n\n  ", "\n"])), function (_ref7) {
   var marginBottom = _ref7.marginBottom;
   return marginBottom + "px";
-}, devices.mobile, function (_ref8) {
+}, function (_ref8) {
   var mobileMarginBottom = _ref8.mobileMarginBottom;
-  return mobileMarginBottom + "px";
+  return mobileMarginBottom && "\n      @media " + devices.mobile + " {\n        margin-bottom: " + mobileMarginBottom + "px;\n      }\n    ";
 });
 var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-wrap: wrap;\n  margin: 24px 0 4px 0;\n"])));
 var TextLinkWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-right: 24px;\n  margin-bottom: 20px;\n\n  &:last-child {\n    margin-right: 0;\n  }\n"])));
@@ -9986,7 +9989,7 @@ var PromoWithTagsContentWrapper = /*#__PURE__*/styled__default.div(_templateObje
 });
 var TimerWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject12$3 || (_templateObject12$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 32px;\n"])));
 var EndDateText = /*#__PURE__*/styled__default.div(_templateObject13$2 || (_templateObject13$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-bottom: 1px solid var(--color-base-black);\n  padding-bottom: 32px;\n  margin-bottom: 32px;\n\n  @media ", " {\n    padding-bottom: 20px;\n    margin-bottom: 20px;\n  }\n"])), devices.mobile);
-var HarmonicHeaderWithWrapper = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject14$1 || (_templateObject14$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0;\n  padding-bottom: 32px;\n\n  @media ", " {\n    padding-bottom: 24px;\n  }\n"])), devices.mobile);
+var HarmonicHeaderWithWrapper = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject14$1 || (_templateObject14$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0;\n  padding-bottom: 32px;\n\n  @media ", " {\n    padding-bottom: 24px;\n  }\n"])), devices.mobileAndTablet);
 var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject15$1 || (_templateObject15$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0;\n  margin: 0;\n  margin-bottom: 32px;\n  whiete-space: break-spaces;\n  overflow-wrap: break-word;\n\n  a {\n    text-decoration: underline;\n    cursor: pointer;\n\n    &[href^='tel:'] {\n      text-decoration: none;\n    }\n\n    &:link {\n      color: var(--color-primary-black);\n    }\n\n    &:visited {\n      color: var(--color-base-dark-grey);\n    }\n\n    &:hover {\n      color: var(--color-primary-red);\n    }\n  }\n  @media ", " {\n    margin-bottom: 24px;\n  }\n"])), devices.mobile);
 var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-wrap: break-word;\n  margin-bottom: 16px;\n"])));
 
@@ -10101,8 +10104,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
     hideSection: showExtraContent,
     asCard: asCard
   }, renderTimerBlock(), /*#__PURE__*/React__default.createElement(React__default.Fragment, null, !!(aboveTitleTags != null && aboveTitleTags.length) && (/*#__PURE__*/React__default.createElement(PromoWithTagsTagWrapper, {
-    marginBottom: 24,
-    mobileMarginBottom: 24
+    marginBottom: 24
   }, /*#__PURE__*/React__default.createElement(TypeTags, {
     list: aboveTitleTags
   }))), /*#__PURE__*/React__default.createElement(HarmonicHeaderWithWrapper, {
@@ -10114,7 +10116,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
   }, /*#__PURE__*/React__default.createElement(TypeTags, {
     list: belowTitleTags
   }))), subtitle ? /*#__PURE__*/React__default.createElement(HarmonicSubtitleWithWrapper, {
-    size: "medium"
+    size: "large"
   }, subtitle) : null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$1, {
     size: "large",
     dangerouslySetInnerHTML: {