diy-template-components 0.2.88 → 0.3.0

package/build/index.es.js

@@ -579,7 +579,7 @@ var menu = "data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20v
 
 var clpLogo = "478367302082f28d.svg";
 
-var videoPlay = "data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M8%200.5C3.86%200.5%200.5%203.86%200.5%208C0.5%2012.14%203.86%2015.5%208%2015.5C12.14%2015.5%2015.5%2012.14%2015.5%208C15.5%203.86%2012.14%200.5%208%200.5ZM6.5%2011.375V4.625L11%208L6.5%2011.375Z%22%20fill%3D%22%234E93FF%22%2F%3E%3C%2Fsvg%3E";
+var videoPlay = "data:image/svg+xml,%3Csvg%20width%3D%2297%22%20height%3D%2266%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20%20%3E%3Cpath%20d%3D%22M8%200.5C3.86%200.5%200.5%203.86%200.5%208C0.5%2012.14%203.86%2015.5%208%2015.5C12.14%2015.5%2015.5%2012.14%2015.5%208C15.5%203.86%2012.14%200.5%208%200.5ZM6.5%2011.375V4.625L11%208L6.5%2011.375Z%22%20fill%3D%22%234E93FF%22%2F%3E%3C%2Fsvg%3E";
 
 var stockGrowth = "data:image/svg+xml,%3Csvg%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M44%205.5H4C3.18%205.5%202.5%204.82%202.5%204C2.5%203.18%203.18%202.5%204%202.5H44C44.82%202.5%2045.5%203.18%2045.5%204C45.5%204.82%2044.82%205.5%2044%205.5Z%22%20fill%3D%22%23549BF6%22%2F%3E%3Cpath%20d%3D%22M33.34%2044.68C33.08%2045.2%2032.54%2045.5%2032%2045.5C31.78%2045.5%2031.54%2045.44%2031.34%2045.34L24%2041.68L16.66%2045.34C16.46%2045.44%2016.22%2045.5%2016%2045.5C15.46%2045.5%2014.92%2045.2%2014.66%2044.68C14.28%2043.92%2014.58%2043.02%2015.34%2042.66L22.5%2039.08V34H25.5V39.08L32.66%2042.66C33.42%2043.02%2033.72%2043.92%2033.34%2044.68Z%22%20fill%3D%22%23549BF6%22%2F%3E%3Cpath%20d%3D%22M6%204V28.2C6%2032%208%2034%2011.8%2034H36.2C40%2034%2042%2032%2042%2028.2V4H6ZM33.96%2017.16L27.66%2022.42C27.08%2022.9%2026.34%2023.1%2025.64%2022.98C24.92%2022.86%2024.3%2022.42%2023.92%2021.78L21.82%2018.28L15.96%2023.16C15.68%2023.4%2015.34%2023.5%2015%2023.5C14.58%2023.5%2014.14%2023.32%2013.84%2022.96C13.3%2022.32%2013.4%2021.38%2014.04%2020.84L20.34%2015.58C20.92%2015.1%2021.66%2014.9%2022.36%2015.02C23.08%2015.14%2023.7%2015.58%2024.08%2016.22L26.18%2019.72L32.04%2014.84C32.68%2014.3%2033.62%2014.4%2034.16%2015.04C34.68%2015.68%2034.6%2016.62%2033.96%2017.16Z%22%20fill%3D%22%23549BF6%22%2F%3E%3C%2Fsvg%3E";
 
@@ -2256,12 +2256,13 @@ const useSectionStyles$8 = createUseStyles(theme => ({
   imageContainer: {
     width: '100%',
     position: 'relative',
-    height: '100%',
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'center',
-    borderRadius: '8px',
-    overflow: 'hidden'
+    paddingBottom: ({
+      isCustomWebsite
+    }) => isCustomWebsite ? '35%' : '',
+    '& img': {
+      height: '520px',
+      objectFit: 'cover'
+    }
   },
   subTitleHeading: {
     marginBottom: '8px',
@@ -3389,7 +3390,7 @@ const useSectionStyles$4 = createUseStyles(theme => ({
     fontWeight: theme.typography.fontWeight.bold,
     lineHeight: '71px',
     letterSpacing: '-3px',
-    color: theme?.palette?.font?.secondary,
+    color: theme?.palette?.font?.default,
     marginBottom: theme.spacing.padding.tiny,
     wordBreak: 'break-word'
   },
@@ -4146,7 +4147,8 @@ const useVideoStyles$1 = createUseStyles(theme => {
       height: '100%',
       width: '100%',
       objectFit: 'cover',
-      objectPosition: 'top'
+      objectPosition: 'top',
+      opacity: '0.8'
     },
     '@media (max-width: 767px)': {
       iframe: {
@@ -4181,7 +4183,10 @@ function VideoPlayer(props) {
     }
   }
   return /*#__PURE__*/React.createElement(React.Fragment, null, !isLoaded && /*#__PURE__*/React.createElement("div", {
-    className: classes.imgContainer
+    className: classes.imgContainer,
+    onClick: () => {
+      setIsEnableed(true);
+    }
   }, /*#__PURE__*/React.createElement(NextImageRenderer, {
     src: imageUrl,
     sectionIndex: props?.sectionIndex,
@@ -4566,7 +4571,10 @@ const SingleSlide$1 = props => {
     className: classes.singleSlideContainer
   }, /*#__PURE__*/React.createElement("div", {
     ref: data?.videoFrame?.refSetter,
-    className: classes.iframeContainer
+    className: classes.iframeContainer,
+    style: {
+      background: 'linear-gradient(#333333,rgb(0 0 0))'
+    }
   }, /*#__PURE__*/React.createElement(VideoPlayer, {
     imageUrl: data.videoFrame.metadata?.thumbnail,
     videoUrl: data.videoFrame.metadata?.value
@@ -8700,7 +8708,8 @@ function Section({
     style: {
       textAlign: 'center',
       width: '100%',
-      backgroundColor: '#ffffff'
+      backgroundColor: '#ffffff',
+      padding: '0px 24px'
     }
   }, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("p", {
     style: {
@@ -8727,10 +8736,10 @@ function Section({
       marginBottom: '15px'
     },
     ref: body?.components[1]?.refSetter
-  }, body?.components[1]?.metadata?.text), /*#__PURE__*/React.createElement("p", {
+  }, body?.components[1]?.metadata?.text), /*#__PURE__*/React.createElement("div", {
     style: {
       maxWidth: '435px',
-      margin: 'auto',
+      // margin: '0px 10px',
       // fontFamily: 'Roboto',
       fontStyle: 'normal',
       fontWeight: '400',