diy-template-components 1.0.43 → 1.0.45

package/build/index.es.js

@@ -3084,12 +3084,13 @@ const useSectionStyles$6 = createUseStyles(theme => {
       objectPosition: '50% 50%'
     },
     overlay: {
+      zIndex: 1,
       position: 'absolute',
       top: 0,
       left: 0,
       width: '100%',
       height: '100%',
-      backgroundColor: 'rgba(0, 0, 0, 0.5)'
+      backgroundColor: 'rgba(0, 0, 0, 0.4)'
     },
     '@media screen and (max-width: 767px)': {
       heading: {
@@ -3147,7 +3148,7 @@ const Section$3 = ({
     isCustomWebsite,
     countryCode
   } = useContext(PageContext);
-  const hasContent = nodeData.cardHeading.metadata.value.length || nodeData.title.metadata.valu.length || nodeData.description.metadata.value.length;
+  const hasContent = Boolean(nodeData.cardHeading.metadata.value || nodeData.title.metadata.valu || nodeData.description.metadata.value);
   const classes = useSectionStyles$6({
     wordBreakValue: wordBreakValue(countryCode),
     imageUrl: nodeData.image.metadata.value,
@@ -3155,6 +3156,8 @@ const Section$3 = ({
     isCustomWebsite,
     hasContent
   });
+  const mobileImageSrc = isMobile && nodeData?.mobileImage?.metadata?.value;
+  const desktopImageSrc = nodeData?.image?.metadata?.value;
   return /*#__PURE__*/React.createElement("section", {
     className: classes.bannerCarouselCenterSection
   }, /*#__PURE__*/React.createElement("div", {
@@ -3195,7 +3198,7 @@ const Section$3 = ({
   }, /*#__PURE__*/React.createElement("div", {
     className: hasContent && classes?.overlay
   }), /*#__PURE__*/React.createElement(NextImageRenderer, {
-    src: nodeData.image.metadata.value,
+    src: mobileImageSrc ? mobileImageSrc : desktopImageSrc,
     className: classes?.centerBgImage,
     sectionIndex: sectionIndex
   }))));
@@ -4370,7 +4373,7 @@ const useVideoTestimonialStyles = createUseStyles(theme => {
       marginBottom: '8px'
     },
     videoTestimonialTitle: {
-      fontSize: theme.typography.fontSize.h1,
+      fontSize: theme.typography.fontSize.h2,
       // lineHeight: '71px',
       letterSpacing: '-3px',
       fontWeight: theme.typography.fontWeight.bold,
@@ -4380,15 +4383,16 @@ const useVideoTestimonialStyles = createUseStyles(theme => {
     },
     videoCarousel: {
       display: 'flex',
-      alignItems: 'center',
       justifyContent: 'flex-start',
-      gap: theme.spacing.margin.small
+      gap: '40px'
     },
     iframeSuperContainer: {
       height: '100%',
       width: '100%',
       display: 'flex',
-      alignItems: 'center'
+      alignItems: 'center',
+      marginTop: '16px',
+      borderRadius: '8px'
     },
     iframeContainer: {
       width: '100%',
@@ -4418,13 +4422,13 @@ const useVideoTestimonialStyles = createUseStyles(theme => {
       fontWeight: theme.typography.fontWeight.bold
     },
     videoDetailsContent: {
-      fontSize: theme.typography.fontSize.subHead,
+      fontSize: theme.typography.fontSize.body,
       lineHeight: '24px',
       wordBreak: 'break-word',
       color: theme.palette.font.primary
     },
     videoDetailsSubContent: {
-      fontSize: theme.typography.fontSize.subHead,
+      fontSize: theme.typography.fontSize.h6,
       lineHeight: '24px',
       margin: '0',
       color: theme.palette.font.primary,