From cebe5373f18c0f0b4d9249b04d63486a8f33a9a4 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Thu, 10 Oct 2024 23:09:35 -0300
Subject: [PATCH 01/20] Solve warning caused by some blog posts missing
 alternative text for their image

---
 src/components/AuthorBlogPostCard/index.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/AuthorBlogPostCard/index.tsx b/src/components/AuthorBlogPostCard/index.tsx
index bfd9227a..869ab173 100644
--- a/src/components/AuthorBlogPostCard/index.tsx
+++ b/src/components/AuthorBlogPostCard/index.tsx
@@ -30,7 +30,7 @@ interface AuthorBlogPostCardProps {
         };
         tags: { type: string; name: string }[];
         authors: { id: string; name: string; role?: string; picture?: any }[];
-        hero: { alternativeText: string; localFile: any };
+        hero: { alternativeText?: string; localFile: any };
     };
 }
 
@@ -59,7 +59,7 @@ const AuthorBlogPostCard = ({ data: blogPost }: AuthorBlogPostCardProps) => {
         <Link to={`/${blogPost.slug}`} className={container}>
             <GatsbyImage
                 image={blogPostImage}
-                alt={blogPost.hero.alternativeText}
+                alt={blogPost.hero.alternativeText ?? 'Blog post image'}
                 className={popularArticlesImage}
             />
             <div className={articleCardHeader}>

From 1b1cd43fecb5e49a2c847db6bde10db7291d56c6 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Thu, 10 Oct 2024 23:10:38 -0300
Subject: [PATCH 02/20] "apple-mobile-web-app-capable" is deprecated, now we
 should use "mobile-web-app-capable"

---
 src/components/seo.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/seo.tsx b/src/components/seo.tsx
index 745fa1c8..386c5ebf 100644
--- a/src/components/seo.tsx
+++ b/src/components/seo.tsx
@@ -84,7 +84,7 @@ const Seo: React.FC<SeoProps> = ({
                 name="viewport"
                 content="width=device-width, initial-scale=1.0"
             />
-            <meta name="apple-mobile-web-app-capable" content="yes" />
+            <meta name="mobile-web-app-capable" content="yes" />
             {children}
             <script type="application/ld+json">
                 {JSON.stringify({

From e5d24365d0993e16bb879033071c0b17fc77064b Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Fri, 11 Oct 2024 10:29:53 -0300
Subject: [PATCH 03/20] Migrate BigImageBackground component to use
 gatsby-plugin-image instead of gatsby-background-image

---
 .../BackgroundImages/BigImageBackground.tsx   | 49 +++++++++----------
 .../BackgroundImages/styles.module.less       |  6 ---
 2 files changed, 24 insertions(+), 31 deletions(-)
 delete mode 100644 src/components/BackgroundImages/styles.module.less

diff --git a/src/components/BackgroundImages/BigImageBackground.tsx b/src/components/BackgroundImages/BigImageBackground.tsx
index db72946c..374279b7 100644
--- a/src/components/BackgroundImages/BigImageBackground.tsx
+++ b/src/components/BackgroundImages/BigImageBackground.tsx
@@ -1,34 +1,33 @@
-import { graphql, useStaticQuery } from 'gatsby';
 import React from 'react';
-import BackgroundImage from 'gatsby-background-image';
-import { backgroundIndexWrapper } from './styles.module.less';
+import { StaticImage } from 'gatsby-plugin-image';
 
 const BigImageBackground = ({
     children,
-    ...rest
 }: React.BaseHTMLAttributes<HTMLDivElement>) => {
-    const imageData = useStaticQuery(graphql`
-        query {
-            background: file(relativePath: { eq: "blogs-bg.png" }) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 1920) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-        }
-    `);
-
     return (
-        <BackgroundImage
-            fadeIn={false}
-            critical
-            className={backgroundIndexWrapper}
-            fluid={imageData.background.childImageSharp.fluid}
-            {...{ ...{ children, rest }, children: undefined }}
-        >
-            {children}
-        </BackgroundImage>
+        <>
+            <StaticImage
+                layout="fullWidth"
+                alt=""
+                src="../../images/blogs-bg.png"
+                formats={['auto', 'webp', 'avif']}
+                style={{
+                    position: 'absolute',
+                    right: 0,
+                    width: '100%',
+                }}
+            />
+            <div
+                style={{
+                    position: 'relative',
+                    display: 'grid',
+                    gridArea: '1/1',
+                    placeItems: 'center',
+                }}
+            >
+                {children}
+            </div>
+        </>
     );
 };
 
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
deleted file mode 100644
index ba747945..00000000
--- a/src/components/BackgroundImages/styles.module.less
+++ /dev/null
@@ -1,6 +0,0 @@
-.backgroundIndexWrapper {
-  background-size: contain;
-  background-repeat: no-repeat;
-  background-position: top right;
-  padding-bottom: 2rem;
-}
\ No newline at end of file

From b119db3deadbc52dc4f78a4f1ed2bdd9746634b2 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Fri, 11 Oct 2024 11:55:15 -0300
Subject: [PATCH 04/20] Create separate consts for the stylings

---
 .../BackgroundImages/BigImageBackground.tsx   | 32 +++++++++----------
 .../BackgroundImages/styles.module.less       |  5 +++
 2 files changed, 21 insertions(+), 16 deletions(-)
 create mode 100644 src/components/BackgroundImages/styles.module.less

diff --git a/src/components/BackgroundImages/BigImageBackground.tsx b/src/components/BackgroundImages/BigImageBackground.tsx
index 374279b7..e3c16b9e 100644
--- a/src/components/BackgroundImages/BigImageBackground.tsx
+++ b/src/components/BackgroundImages/BigImageBackground.tsx
@@ -1,6 +1,19 @@
-import React from 'react';
+import React, { CSSProperties } from 'react';
 import { StaticImage } from 'gatsby-plugin-image';
 
+const backgroundImageStyling: CSSProperties = {
+    position: 'absolute',
+    right: 0,
+    width: '100%',
+};
+
+const childrenWrapperStyling: CSSProperties = {
+    position: 'relative',
+    display: 'grid',
+    gridArea: '1 / 1',
+    placeItems: 'center',
+};
+
 const BigImageBackground = ({
     children,
 }: React.BaseHTMLAttributes<HTMLDivElement>) => {
@@ -11,22 +24,9 @@ const BigImageBackground = ({
                 alt=""
                 src="../../images/blogs-bg.png"
                 formats={['auto', 'webp', 'avif']}
-                style={{
-                    position: 'absolute',
-                    right: 0,
-                    width: '100%',
-                }}
+                style={backgroundImageStyling}
             />
-            <div
-                style={{
-                    position: 'relative',
-                    display: 'grid',
-                    gridArea: '1/1',
-                    placeItems: 'center',
-                }}
-            >
-                {children}
-            </div>
+            <div style={childrenWrapperStyling}>{children}</div>
         </>
     );
 };
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
new file mode 100644
index 00000000..00d3b5d8
--- /dev/null
+++ b/src/components/BackgroundImages/styles.module.less
@@ -0,0 +1,5 @@
+.backgroundImageStyling {
+  position: absolute;
+  right: 0;
+  width: 100%;
+}

From fec42ec2332f3d5a654e4afbda58368aff153eaf Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Fri, 11 Oct 2024 11:55:43 -0300
Subject: [PATCH 05/20] Remove unused class

---
 src/components/BackgroundImages/styles.module.less | 5 -----
 1 file changed, 5 deletions(-)
 delete mode 100644 src/components/BackgroundImages/styles.module.less

diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
deleted file mode 100644
index 00d3b5d8..00000000
--- a/src/components/BackgroundImages/styles.module.less
+++ /dev/null
@@ -1,5 +0,0 @@
-.backgroundImageStyling {
-  position: absolute;
-  right: 0;
-  width: 100%;
-}

From 2329c87ed8d528787c38cd92fdd0cdf795abf199 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Mon, 14 Oct 2024 14:09:26 -0300
Subject: [PATCH 06/20] Add new background image for light swooping lines right

---
 .../BackgroundImages/BigImageBackground.tsx   |  2 +-
 ...tSwoopingLinesRightDirectionBackground.tsx | 47 +++++--------------
 .../BackgroundImages/styles.module.less       | 14 ++++++
 3 files changed, 28 insertions(+), 35 deletions(-)
 create mode 100644 src/components/BackgroundImages/styles.module.less

diff --git a/src/components/BackgroundImages/BigImageBackground.tsx b/src/components/BackgroundImages/BigImageBackground.tsx
index e3c16b9e..0364b5d6 100644
--- a/src/components/BackgroundImages/BigImageBackground.tsx
+++ b/src/components/BackgroundImages/BigImageBackground.tsx
@@ -23,8 +23,8 @@ const BigImageBackground = ({
                 layout="fullWidth"
                 alt=""
                 src="../../images/blogs-bg.png"
-                formats={['auto', 'webp', 'avif']}
                 style={backgroundImageStyling}
+                placeholder="blurred"
             />
             <div style={childrenWrapperStyling}>{children}</div>
         </>
diff --git a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
index ddd8690c..d68ec4e3 100644
--- a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
+++ b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
@@ -1,13 +1,7 @@
-import { graphql, useStaticQuery } from 'gatsby';
 import React from 'react';
-
-import BackgroundImage, {
-    IBackgroundImageProps,
-} from 'gatsby-background-image';
-
-import clsx from 'clsx';
-import { sectionTopBottomPadding } from '../../globalStyles/sections.module.less';
-import { commonBackgroundImageProps } from './utils';
+import { IBackgroundImageProps } from 'gatsby-background-image';
+import { StaticImage } from 'gatsby-plugin-image';
+import { container, backgroundImage } from './styles.module.less';
 
 type LightSwoopingLinesRightDirectionBackgroundProps = IBackgroundImageProps & {
     children?: React.ReactNode;
@@ -16,33 +10,18 @@ type LightSwoopingLinesRightDirectionBackgroundProps = IBackgroundImageProps & {
 const LightSwoopingLinesRightDirectionBackground = ({
     children,
     className,
-    ...rest
 }: LightSwoopingLinesRightDirectionBackgroundProps) => {
-    const swoopingLines = useStaticQuery(graphql`
-        query {
-            imageData: file(
-                relativePath: { eq: "lp-connector/hero/Vector.png" }
-            ) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 2170) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-        }
-    `);
-
     return (
-        <BackgroundImage
-            Tag="section"
-            fluid={swoopingLines.imageData.childImageSharp.fluid}
-            backgroundColor="#f9fafc"
-            className={clsx(sectionTopBottomPadding, className)}
-            {...commonBackgroundImageProps}
-            {...rest}
-        >
-            {children}
-        </BackgroundImage>
+        <div className={container}>
+            <StaticImage
+                alt=""
+                src="../../images/lp-connector/hero/Vector.png"
+                className={backgroundImage}
+                placeholder="blurred"
+                quality={100}
+            />
+            <div className={className}>{children}</div>
+        </div>
     );
 };
 
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
new file mode 100644
index 00000000..ee8b4c13
--- /dev/null
+++ b/src/components/BackgroundImages/styles.module.less
@@ -0,0 +1,14 @@
+@import '../../globalStyles/sections.module.less';
+
+.container {
+  .sectionTopBottomPadding;
+  position: relative;
+  background-color: #f9fafc;
+}
+
+.background-image {
+  position: absolute !important;
+  width: 100%;
+  top: 0;
+  bottom: 0;
+}
\ No newline at end of file

From 679d56fede92bbc410bc59ceedc8d8b538125334 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Mon, 14 Oct 2024 15:00:06 -0300
Subject: [PATCH 07/20] Only one styling file for both background components

---
 .../BackgroundImages/BigImageBackground.tsx   | 28 ++++++-------------
 ...tSwoopingLinesRightDirectionBackground.tsx |  9 ++++--
 .../BackgroundImages/styles.module.less       | 19 +++++++++++--
 src/templates/blog/styles.module.less         |  1 +
 4 files changed, 33 insertions(+), 24 deletions(-)

diff --git a/src/components/BackgroundImages/BigImageBackground.tsx b/src/components/BackgroundImages/BigImageBackground.tsx
index 0364b5d6..1d395c12 100644
--- a/src/components/BackgroundImages/BigImageBackground.tsx
+++ b/src/components/BackgroundImages/BigImageBackground.tsx
@@ -1,33 +1,23 @@
-import React, { CSSProperties } from 'react';
+import React from 'react';
 import { StaticImage } from 'gatsby-plugin-image';
-
-const backgroundImageStyling: CSSProperties = {
-    position: 'absolute',
-    right: 0,
-    width: '100%',
-};
-
-const childrenWrapperStyling: CSSProperties = {
-    position: 'relative',
-    display: 'grid',
-    gridArea: '1 / 1',
-    placeItems: 'center',
-};
+import clsx from 'clsx';
+import { container, backgroundImage, bigVector } from './styles.module.less';
 
 const BigImageBackground = ({
     children,
+    className,
 }: React.BaseHTMLAttributes<HTMLDivElement>) => {
     return (
-        <>
+        <div className={container}>
             <StaticImage
-                layout="fullWidth"
                 alt=""
                 src="../../images/blogs-bg.png"
-                style={backgroundImageStyling}
+                className={clsx(backgroundImage, bigVector)}
                 placeholder="blurred"
+                quality={100}
             />
-            <div style={childrenWrapperStyling}>{children}</div>
-        </>
+            <div className={className}>{children}</div>
+        </div>
     );
 };
 
diff --git a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
index d68ec4e3..75e3d5b9 100644
--- a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
+++ b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
@@ -1,7 +1,12 @@
 import React from 'react';
 import { IBackgroundImageProps } from 'gatsby-background-image';
 import { StaticImage } from 'gatsby-plugin-image';
-import { container, backgroundImage } from './styles.module.less';
+import clsx from 'clsx';
+import {
+    container,
+    backgroundImage,
+    swoopingLines,
+} from './styles.module.less';
 
 type LightSwoopingLinesRightDirectionBackgroundProps = IBackgroundImageProps & {
     children?: React.ReactNode;
@@ -16,7 +21,7 @@ const LightSwoopingLinesRightDirectionBackground = ({
             <StaticImage
                 alt=""
                 src="../../images/lp-connector/hero/Vector.png"
-                className={backgroundImage}
+                className={clsx(backgroundImage, swoopingLines)}
                 placeholder="blurred"
                 quality={100}
             />
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
index ee8b4c13..bad628be 100644
--- a/src/components/BackgroundImages/styles.module.less
+++ b/src/components/BackgroundImages/styles.module.less
@@ -3,12 +3,25 @@
 .container {
   .sectionTopBottomPadding;
   position: relative;
-  background-color: #f9fafc;
 }
 
-.background-image {
+.backgroundImage {
   position: absolute !important;
   width: 100%;
   top: 0;
+  z-index: -1;
+}
+
+.swoopingLines {
+  background-color: #f9fafc;
   bottom: 0;
-}
\ No newline at end of file
+}
+
+.bigVector {
+  max-height: 100vh;
+
+  @media(min-width: 1700px) {
+    max-height: 100vh;
+    bottom: 0;
+  }
+}
diff --git a/src/templates/blog/styles.module.less b/src/templates/blog/styles.module.less
index ece02be4..a5446652 100644
--- a/src/templates/blog/styles.module.less
+++ b/src/templates/blog/styles.module.less
@@ -5,6 +5,7 @@
   .sectionTopBottomPadding;
   display: flex;
   align-items: center;
+  padding-top: 0;
 
   @media (max-width: 810px) {
     flex-direction: column-reverse;

From 65dbe17de2ed7a28a3ebf5b6b83d395534d1b949 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Mon, 14 Oct 2024 15:27:30 -0300
Subject: [PATCH 08/20] Add new background image for dark swooping lines left

---
 ...rkSwoopingLinesLeftDirectionBackground.tsx | 47 +++++++------------
 ...tSwoopingLinesRightDirectionBackground.tsx |  1 +
 .../BackgroundImages/styles.module.less       |  1 -
 src/components/Connectors/styles.module.less  |  1 +
 4 files changed, 20 insertions(+), 30 deletions(-)

diff --git a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
index 73587487..5fba0093 100644
--- a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
+++ b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
@@ -1,13 +1,14 @@
-import { graphql, useStaticQuery } from 'gatsby';
 import React from 'react';
 
-import BackgroundImage, {
-    IBackgroundImageProps,
-} from 'gatsby-background-image';
+import { IBackgroundImageProps } from 'gatsby-background-image';
 
 import clsx from 'clsx';
-import { sectionTopBottomPadding } from '../../globalStyles/sections.module.less';
-import { commonBackgroundImageProps } from './utils';
+import { StaticImage } from 'gatsby-plugin-image';
+import {
+    container,
+    backgroundImage,
+    swoopingLines,
+} from './styles.module.less';
 
 type DarkSwoopingLinesLeftDirectionBackgroundProps = IBackgroundImageProps & {
     children?: React.ReactNode;
@@ -16,31 +17,19 @@ type DarkSwoopingLinesLeftDirectionBackgroundProps = IBackgroundImageProps & {
 const DarkSwoopingLinesLeftDirectionBackground = ({
     children,
     className,
-    ...rest
 }: DarkSwoopingLinesLeftDirectionBackgroundProps) => {
-    const swoopingLines = useStaticQuery(graphql`
-        query {
-            imageData: file(relativePath: { eq: "overlay-vector-left.png" }) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 2170) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-        }
-    `);
-
     return (
-        <BackgroundImage
-            Tag="section"
-            fluid={swoopingLines.imageData.childImageSharp.fluid}
-            backgroundColor="#04192b"
-            className={clsx(sectionTopBottomPadding, className)}
-            {...commonBackgroundImageProps}
-            {...rest}
-        >
-            {children}
-        </BackgroundImage>
+        <div className={container}>
+            <StaticImage
+                alt=""
+                src="../../images/overlay-vector-left.png"
+                className={clsx(backgroundImage, swoopingLines)}
+                placeholder="blurred"
+                quality={100}
+                backgroundColor="#04192b"
+            />
+            <div className={className}>{children}</div>
+        </div>
     );
 };
 
diff --git a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
index 75e3d5b9..bd7fc6d2 100644
--- a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
+++ b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
@@ -24,6 +24,7 @@ const LightSwoopingLinesRightDirectionBackground = ({
                 className={clsx(backgroundImage, swoopingLines)}
                 placeholder="blurred"
                 quality={100}
+                backgroundColor="#f9fafc"
             />
             <div className={className}>{children}</div>
         </div>
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
index bad628be..9b7b2f96 100644
--- a/src/components/BackgroundImages/styles.module.less
+++ b/src/components/BackgroundImages/styles.module.less
@@ -13,7 +13,6 @@
 }
 
 .swoopingLines {
-  background-color: #f9fafc;
   bottom: 0;
 }
 
diff --git a/src/components/Connectors/styles.module.less b/src/components/Connectors/styles.module.less
index 808fabc0..9e4b542d 100644
--- a/src/components/Connectors/styles.module.less
+++ b/src/components/Connectors/styles.module.less
@@ -3,6 +3,7 @@
 .container {
   .globalMaxWidth;
   .sectionTopBottomPadding;
+  padding-top: 0;
 }
 
 .connectorIndexHeader {

From 82f2cebfe0507118dff08af4a04e8cef09959742 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Mon, 14 Oct 2024 16:31:47 -0300
Subject: [PATCH 09/20] Add new background image for straight lines

---
 .../StraightLinesBackground.tsx               | 51 ++++++++-----------
 .../BackgroundImages/styles.module.less       |  1 -
 src/components/BackgroundImages/utils.ts      |  4 --
 src/components/BlogBanner/index.tsx           |  8 +--
 src/components/Connectors/styles.module.less  |  1 -
 src/components/Homepage/SectionFive/styles.ts |  3 +-
 src/components/Homepage/SectionNine/styles.ts |  3 +-
 .../Homepage/SectionSeven/styles.ts           |  3 +-
 .../Homepage/SectionThree/styles.ts           |  7 ++-
 src/templates/blog-post/index.tsx             | 12 +++--
 src/templates/blog-post/styles.module.less    |  5 +-
 src/templates/blog/styles.module.less         |  5 +-
 12 files changed, 48 insertions(+), 55 deletions(-)
 delete mode 100644 src/components/BackgroundImages/utils.ts

diff --git a/src/components/BackgroundImages/StraightLinesBackground.tsx b/src/components/BackgroundImages/StraightLinesBackground.tsx
index 73293889..4560ee00 100644
--- a/src/components/BackgroundImages/StraightLinesBackground.tsx
+++ b/src/components/BackgroundImages/StraightLinesBackground.tsx
@@ -1,43 +1,32 @@
-import { graphql, useStaticQuery } from 'gatsby';
 import React from 'react';
+import clsx from 'clsx';
+import { StaticImage } from 'gatsby-plugin-image';
+import {
+    container,
+    backgroundImage,
+    swoopingLines,
+} from './styles.module.less';
 
-import BackgroundImage, {
-    IBackgroundImageProps,
-} from 'gatsby-background-image';
-
-import { commonBackgroundImageProps } from './utils';
-
-type StraightLinesBackgroundProps = IBackgroundImageProps & {
+type StraightLinesBackgroundProps = {
     children?: React.ReactNode;
 } & React.HTMLAttributes<HTMLDivElement>;
 
 const StraightLinesBackground = ({
     children,
-    ...rest
+    className,
 }: StraightLinesBackgroundProps) => {
-    const swoopingLines = useStaticQuery(graphql`
-        query {
-            imageData: file(
-                relativePath: { eq: "lp-connector/real-time/Vector.png" }
-            ) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 1356) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-        }
-    `);
-
     return (
-        <BackgroundImage
-            fluid={swoopingLines.imageData.childImageSharp.fluid}
-            backgroundColor="#04192b"
-            {...commonBackgroundImageProps}
-            {...rest}
-        >
-            {children}
-        </BackgroundImage>
+        <div className={container}>
+            <StaticImage
+                alt=""
+                src="../../images/lp-connector/real-time/Vector.png"
+                className={clsx(backgroundImage, swoopingLines)}
+                placeholder="blurred"
+                quality={100}
+                backgroundColor="#04192b"
+            />
+            <div className={className}>{children}</div>
+        </div>
     );
 };
 
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
index 9b7b2f96..696127f5 100644
--- a/src/components/BackgroundImages/styles.module.less
+++ b/src/components/BackgroundImages/styles.module.less
@@ -1,7 +1,6 @@
 @import '../../globalStyles/sections.module.less';
 
 .container {
-  .sectionTopBottomPadding;
   position: relative;
 }
 
diff --git a/src/components/BackgroundImages/utils.ts b/src/components/BackgroundImages/utils.ts
deleted file mode 100644
index 70539a18..00000000
--- a/src/components/BackgroundImages/utils.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export const commonBackgroundImageProps = {
-    fadeIn: false,
-    critical: true,
-};
diff --git a/src/components/BlogBanner/index.tsx b/src/components/BlogBanner/index.tsx
index 1ba3d3ce..daf7f71b 100644
--- a/src/components/BlogBanner/index.tsx
+++ b/src/components/BlogBanner/index.tsx
@@ -13,16 +13,16 @@ interface BlogBanner {
 
 const BlogBanner = ({ title, button }: BlogBanner) => {
     return (
-        <StraightLinesBackground className={background}>
-            <div className={container}>
+        <div className={background}>
+            <StraightLinesBackground className={container}>
                 <div className={banner}>
                     {title}
                     <OutboundLinkFilled href={button.href} target="_blank">
                         {button.title}
                     </OutboundLinkFilled>
                 </div>
-            </div>
-        </StraightLinesBackground>
+            </StraightLinesBackground>
+        </div>
     );
 };
 
diff --git a/src/components/Connectors/styles.module.less b/src/components/Connectors/styles.module.less
index 9e4b542d..808fabc0 100644
--- a/src/components/Connectors/styles.module.less
+++ b/src/components/Connectors/styles.module.less
@@ -3,7 +3,6 @@
 .container {
   .globalMaxWidth;
   .sectionTopBottomPadding;
-  padding-top: 0;
 }
 
 .connectorIndexHeader {
diff --git a/src/components/Homepage/SectionFive/styles.ts b/src/components/Homepage/SectionFive/styles.ts
index 1f8efa14..f2656737 100644
--- a/src/components/Homepage/SectionFive/styles.ts
+++ b/src/components/Homepage/SectionFive/styles.ts
@@ -1,8 +1,9 @@
 import styled from 'styled-components';
-import { globalMaxWidth } from '../../../globalStyles';
+import { globalMaxWidth, sectionTopBottomPadding } from '../../../globalStyles';
 
 export const Wrapper = styled.div`
     ${globalMaxWidth}
+    ${sectionTopBottomPadding}
 
     display: flex;
     justify-content: center;
diff --git a/src/components/Homepage/SectionNine/styles.ts b/src/components/Homepage/SectionNine/styles.ts
index f6cc7670..df5e308d 100644
--- a/src/components/Homepage/SectionNine/styles.ts
+++ b/src/components/Homepage/SectionNine/styles.ts
@@ -1,8 +1,9 @@
 import styled from 'styled-components';
-import { globalMaxWidth } from '../../../globalStyles';
+import { globalMaxWidth, sectionTopBottomPadding } from '../../../globalStyles';
 
 export const Wrapper = styled.div`
     ${globalMaxWidth}
+    ${sectionTopBottomPadding}
 
     h2 {
         font-size: 2.5rem;
diff --git a/src/components/Homepage/SectionSeven/styles.ts b/src/components/Homepage/SectionSeven/styles.ts
index 5074a613..992354b5 100644
--- a/src/components/Homepage/SectionSeven/styles.ts
+++ b/src/components/Homepage/SectionSeven/styles.ts
@@ -1,8 +1,9 @@
 import styled from 'styled-components';
-import { globalMaxWidth } from '../../../globalStyles';
+import { globalMaxWidth, sectionTopBottomPadding } from '../../../globalStyles';
 
 export const Wrapper = styled.div`
     ${globalMaxWidth}
+    ${sectionTopBottomPadding}
 
     padding-right: 0;
     display: flex;
diff --git a/src/components/Homepage/SectionThree/styles.ts b/src/components/Homepage/SectionThree/styles.ts
index 52714621..aef9c77d 100644
--- a/src/components/Homepage/SectionThree/styles.ts
+++ b/src/components/Homepage/SectionThree/styles.ts
@@ -1,8 +1,13 @@
 import styled from 'styled-components';
-import { LinkOutlined, globalMaxWidth } from '../../../globalStyles';
+import {
+    LinkOutlined,
+    globalMaxWidth,
+    sectionTopBottomPadding,
+} from '../../../globalStyles';
 
 export const Wrapper = styled.div`
     ${globalMaxWidth}
+    ${sectionTopBottomPadding}
 
     display: flex;
     flex-direction: column;
diff --git a/src/templates/blog-post/index.tsx b/src/templates/blog-post/index.tsx
index 07b2df00..ae9c6ad8 100644
--- a/src/templates/blog-post/index.tsx
+++ b/src/templates/blog-post/index.tsx
@@ -45,10 +45,10 @@ import {
     blogPostContent,
     blogPostContentWrapper,
     mainContent,
-    background,
     bigBuildPipelineBannerContainer,
     popularArticlesWrapper,
     bigBuildPipelineBannerSection,
+    bigBuildPipelineBannerWrapper,
     bigBuildPipelineBannerContainerLayout,
     leftColumnContainer,
     rightColumnContainer,
@@ -315,8 +315,10 @@ const BlogPostTemplate = ({ data: { post } }) => {
                     <PopularArticles />
                 </section>
                 <section className={bigBuildPipelineBannerSection}>
-                    <StraightLinesBackground className={background}>
-                        <div className={bigBuildPipelineBannerContainer}>
+                    <div className={bigBuildPipelineBannerWrapper}>
+                        <StraightLinesBackground
+                            className={bigBuildPipelineBannerContainer}
+                        >
                             <div
                                 className={
                                     bigBuildPipelineBannerContainerLayout
@@ -372,8 +374,8 @@ const BlogPostTemplate = ({ data: { post } }) => {
                                     See Pricing
                                 </OutboundLinkOutlined>
                             </div>
-                        </div>
-                    </StraightLinesBackground>
+                        </StraightLinesBackground>
+                    </div>
                 </section>
             </article>
             <BlogPostPopupModal />
diff --git a/src/templates/blog-post/styles.module.less b/src/templates/blog-post/styles.module.less
index 709c57d9..d9e07227 100644
--- a/src/templates/blog-post/styles.module.less
+++ b/src/templates/blog-post/styles.module.less
@@ -135,6 +135,7 @@
 
 .blogPostHeaderWrapper {
   .globalMaxWidth;
+  .sectionTopBottomPadding;
 
   display: flex;
   flex-direction: row;
@@ -337,12 +338,14 @@
   }
 }
 
-.background {
+.bigBuildPipelineBannerWrapper {
   border-radius: 24px;
   overflow: hidden;
 }
 
 .bigBuildPipelineBannerContainer {
+  border-radius: 24px;
+  overflow: hidden;
   padding: 48px 90px;
   max-width: 1356px;
   margin-left: auto;
diff --git a/src/templates/blog/styles.module.less b/src/templates/blog/styles.module.less
index a5446652..95f62cfa 100644
--- a/src/templates/blog/styles.module.less
+++ b/src/templates/blog/styles.module.less
@@ -5,7 +5,6 @@
   .sectionTopBottomPadding;
   display: flex;
   align-items: center;
-  padding-top: 0;
 
   @media (max-width: 810px) {
     flex-direction: column-reverse;
@@ -88,9 +87,7 @@
 
 .blogsIndexBody {
   .globalMaxWidth;
-
-  padding-top: 2rem;
-  display: grid;
+  .sectionTopBottomPadding;
 
   padding-top: 2rem;
   display: grid;

From f908ad4fd118084dda8384b1cadf488966e20756 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Mon, 14 Oct 2024 16:49:58 -0300
Subject: [PATCH 10/20] Remove non-essential background image to enhance
 performance

---
 src/components/Connectors/styles.module.less | 6 ------
 src/images/overlay-vector-left-no-fill.svg   | 3 ---
 2 files changed, 9 deletions(-)
 delete mode 100644 src/images/overlay-vector-left-no-fill.svg

diff --git a/src/components/Connectors/styles.module.less b/src/components/Connectors/styles.module.less
index 808fabc0..9ba56aa2 100644
--- a/src/components/Connectors/styles.module.less
+++ b/src/components/Connectors/styles.module.less
@@ -77,13 +77,7 @@
 
 .connectorOnlycardsBackgroundImage {
   .globalMaxWidth;
-
   display: flex;
-  background-image: url('../../images/overlay-vector-left-no-fill.svg');
-  background-repeat: no-repeat;
-  background-position-x: -50px;
-  background-size: 33%;
-  background-position-y: center;
 
   @media (max-width: 810px) {
       background-size: 60%;
diff --git a/src/images/overlay-vector-left-no-fill.svg b/src/images/overlay-vector-left-no-fill.svg
deleted file mode 100644
index 8fa4854a..00000000
--- a/src/images/overlay-vector-left-no-fill.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg opacity="0.3" width="742" height="549" viewBox="0 0 742 549" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M-280.619 99.3955V149.443C-269.197 139.425 -253.478 131.936 -239.775 125.658C-229.972 121.165 -219.8 117.851 -209.266 115.592C-190.19 111.501 -170.983 107.91 -151.769 104.319C-120.264 98.4298 -88.7388 92.5371 -57.7392 84.4281C-49.0469 82.1535 -40.4716 79.6612 -31.9249 77.1772C-9.78979 70.7441 12.155 64.3661 35.4669 61.9669C60.3807 59.4066 85.0958 61.0348 109.352 67.3359C131.471 73.0826 152.865 81.4516 174.174 89.7876L174.182 89.7907C179.632 91.9224 185.076 94.052 190.524 96.135C221.549 107.992 252.755 119.529 284.677 128.723C314.119 137.202 342.108 150.643 365.804 170.263C385.068 186.212 401.105 205.481 417.065 224.657C418.943 226.913 420.819 229.167 422.699 231.415C446.559 259.933 471.736 287.051 500.277 310.953C516.353 324.414 532.746 337.583 549.171 350.612C558.978 358.391 568.72 366.219 576.6 376.041C588.203 390.504 595.905 407.639 603.471 424.475C604.03 425.72 604.59 426.964 605.15 428.205C608.139 434.837 611.085 441.493 614.031 448.151C619.208 459.847 624.388 471.55 629.807 483.137C639.947 504.82 648.602 526.211 655.89 548.383H742C734.964 524.086 726.963 500.192 717.391 476.567C713.23 466.295 709.233 455.872 705.224 445.42C693.916 415.941 682.517 386.221 667.117 358.945C652.344 332.785 629.906 319.239 605.148 304.291L605.123 304.276C604.07 303.641 603.013 303.002 601.952 302.361C595.419 298.407 588.795 294.675 582.181 290.947V290.946C569.241 283.653 556.337 276.38 544.217 267.52C527.836 255.545 512.746 241.876 499.157 226.787C485.916 212.084 474.459 195.228 462.963 178.314C441.444 146.654 419.79 114.795 386.048 96.5013C368.312 86.8869 349.233 83.0528 330.049 79.1975C318.531 76.8828 306.975 74.5605 295.648 70.975C261.853 60.2817 229.103 46.792 196.63 32.6143C193.781 31.3706 190.929 30.1155 188.075 28.8589C166.395 19.3154 144.504 9.6796 121.436 4.19794C96.6274 -1.69618 71.4053 -1.20771 46.6137 4.56023C26.257 9.2974 7.71692 18.1893 -10.8869 27.1116C-22.3036 32.5873 -33.7448 38.0745 -45.6442 42.6196C-66.8896 50.7363 -88.776 54.872 -111.162 58.3604C-139.768 62.8176 -167.997 66.8882 -196.895 68.8583C-223.119 70.6452 -245.14 77.8135 -267.996 90.9857C-272.544 93.6072 -276.663 96.4403 -280.619 99.3955ZM-280.619 186.2V237.346C-276.864 234.274 -273.18 231.12 -269.675 227.801C-261.537 220.097 -250.207 214.227 -239.782 208.825C-237.6 207.695 -235.458 206.585 -233.393 205.483C-223.904 200.421 -214.107 196.105 -203.965 192.531C-177.391 183.165 -149.755 174.966 -122.272 168.745C-100.282 163.772 -77.9545 162.855 -55.5239 161.934C-54.3726 161.886 -53.2203 161.839 -52.0681 161.791C-47.7618 161.612 -43.4491 161.418 -39.1332 161.223L-39.1205 161.222C-13.4275 160.062 12.3931 158.897 38.0287 160.996C63.8057 163.108 88.6984 169.641 113.256 177.515C173.65 196.871 233.753 221.772 286.477 257.548C310.6 273.913 331.682 293.861 350.846 315.757C361.587 328.032 371.469 341.102 381.349 354.173H381.35C395.207 372.504 409.064 390.834 425.291 406.963C426.541 408.207 427.793 409.44 429.041 410.671L429.079 410.706L429.093 410.721C437.539 419.043 445.837 427.22 452.511 437.205C461.044 449.969 467.829 463.931 474.568 477.798V477.799L474.569 477.8V477.801C476.782 482.355 478.99 486.898 481.253 491.386C484.917 498.648 489.11 505.589 493.303 512.528C496.891 518.468 500.48 524.407 503.736 530.547C506.794 536.319 509.392 542.288 511.673 548.383H597.519C595.126 541.113 592.444 533.943 589.331 526.94C585.614 518.579 581.239 510.546 576.866 502.511C574.243 497.693 571.62 492.874 569.138 487.986C564.718 479.273 560.633 470.203 556.523 461.08V461.079C545.207 435.958 533.709 410.431 514.53 390.818C509.662 385.842 504.53 381.136 499.397 376.43L499.396 376.429C494.485 371.925 489.571 367.42 484.888 362.676C469.001 346.587 453.717 329.783 438.504 313.056L438.33 312.864C431.635 305.503 425.021 298.056 418.405 290.607C403.047 273.318 387.682 256.017 371.274 239.745C327.93 196.765 275.561 172.008 218.98 150.828C188.204 139.307 157.139 128.023 125.817 118.066C102.369 110.613 78.5296 104.98 53.8911 103.691C23.2646 102.086 -7.50433 105.515 -37.6854 110.362C-44.5046 111.457 -51.3367 112.489 -58.1697 113.521C-75.3959 116.123 -92.6284 118.727 -109.671 122.333C-130.241 126.689 -150.617 132.054 -170.974 137.413C-178.993 139.525 -187.01 141.636 -195.036 143.684C-219.868 150.017 -241.755 160.336 -263.65 173.62C-269.781 177.337 -275.218 181.722 -280.619 186.2ZM-280.619 322.397V270.641C-267.181 259.511 -253.224 249.189 -237.984 240.556C-221.036 230.957 -203.384 224.41 -184.796 218.786C-181.643 217.832 -178.485 216.864 -175.322 215.894L-175.321 215.893H-175.32C-156.081 209.995 -136.659 204.04 -116.839 200.786C-94.3504 197.093 -71.0917 196.578 -48.1582 196.071H-48.1561L-48.153 196.07C-42.6423 195.948 -37.1508 195.826 -31.6932 195.661C-5.71106 194.874 20.2594 195.052 45.826 200.279C107.251 212.83 167.109 239.081 221.393 269.991C246.15 284.085 268.914 300.787 288.971 321.102C304.724 337.055 318.276 354.726 331.83 372.399L331.831 372.4C342.051 385.726 352.27 399.051 363.434 411.642C367.803 416.57 372.575 421.111 377.345 425.648C382.782 430.822 388.215 435.992 393.048 441.731C404.879 455.789 413.53 473.46 421.342 489.914C426.28 500.316 432.075 510.037 437.899 519.807C440.441 524.068 442.987 528.339 445.47 532.681C448.372 537.756 450.854 543.011 453.04 548.383H366.729C364.766 544.233 362.559 540.168 360.042 536.205C350.016 520.418 341.228 504.179 332.643 487.563C325.644 474.008 317.35 462.696 306.122 452.467C291.595 439.226 280.01 424.383 268.056 408.803C247.571 382.101 225.967 355.723 199.103 335.18C173.764 315.803 144.721 301.534 116.075 287.842C64.0566 262.978 8.07202 247.179 -49.6613 248.571C-54.5246 248.689 -59.4272 248.767 -64.3522 248.847C-87.6503 249.224 -111.466 249.608 -134.151 254.033C-161.104 259.288 -189.511 267.169 -214.855 277.884C-228.143 283.501 -244.719 290.972 -255.417 300.673C-259.342 304.231 -263.447 307.673 -267.567 311.128L-267.57 311.13C-271.97 314.82 -276.388 318.524 -280.619 322.397ZM-280.619 356.291V446.719C-279.818 442.545 -279.165 438.309 -278.643 434.005C-278.446 432.391 -278.272 430.767 -278.098 429.138C-277.288 421.586 -276.469 413.951 -273.414 406.963C-269.129 397.154 -261.553 390.625 -253.851 383.989L-253.85 383.987C-251.705 382.139 -249.55 380.283 -247.454 378.344C-237.913 369.52 -227.974 362.625 -216.076 356.937C-205.209 351.743 -193.522 348.411 -181.952 345.112L-181.934 345.107C-179.979 344.55 -178.028 343.993 -176.083 343.428C-163.897 339.89 -151.695 336.469 -139.039 335.218C-110.762 332.423 -80.1772 330.628 -51.9171 334.287C-22.9563 338.037 7.1748 348.829 33.5513 361.243C62.4153 374.826 91.4771 389.952 114.825 412.272C128.764 425.604 140.862 440.833 152.533 456.206C163.083 470.097 174.083 481.133 186.504 493.044C195.484 501.652 201.222 512.777 206.945 523.874C210.071 529.936 213.193 535.99 216.837 541.62C218.32 543.909 219.725 546.156 221.057 548.383H308.559C306.798 545.028 304.862 541.719 302.712 538.448C297.019 529.778 292.246 520.607 287.476 511.441C283.028 502.896 278.582 494.354 273.394 486.224C268.081 477.891 261.262 471.554 254.303 465.088C251.741 462.707 249.16 460.309 246.628 457.786C236.59 447.79 228.069 436.295 219.565 424.821C214.819 418.418 210.078 412.022 205.08 405.897C185.309 381.661 163.362 360.493 136.767 344.17C109.041 327.154 79.4406 312.571 48.8726 301.73C21.7051 292.09 -5.68024 282.562 -34.6038 280.685C-64.096 278.771 -94.7534 280.299 -124.175 282.87C-151.221 285.233 -178.485 294.198 -204.024 303.154C-214.991 306.998 -225.22 312.201 -235.236 318.132C-247.77 325.551 -258.489 335.134 -269.382 344.871L-269.383 344.872L-270.462 345.837C-274.212 349.187 -277.614 352.64 -280.619 356.291ZM-280.619 548.383V502.166C-272.615 487.056 -268.165 472.072 -266.424 454.985C-266.292 453.681 -266.173 452.375 -266.055 451.069C-265.343 443.212 -264.629 435.354 -260.8 428.286C-255.622 418.734 -246.197 410.597 -237.854 403.396C-236.712 402.411 -235.591 401.442 -234.503 400.491C-225.422 392.54 -211.729 387.02 -200.425 383.254C-185.862 378.41 -170.767 373.577 -155.65 370.925C-145.666 369.174 -135.47 368.902 -125.325 368.632C-122.39 368.555 -119.459 368.476 -116.539 368.362C-86.566 367.197 -60.3787 369.627 -31.8261 379.304C-0.695801 389.858 30.4718 403.613 57.1418 423.366C70.5995 433.337 82.1672 445.481 92.8314 458.429C96.4318 462.801 99.861 467.304 103.285 471.802C111.491 482.581 119.665 493.318 130.092 502.087C140.86 511.139 147.076 522.292 153.655 534.097C155.229 536.921 156.824 539.782 158.506 542.661C159.657 544.63 160.911 546.517 162.203 548.383H74.9483C74.7314 548.022 74.5157 547.664 74.302 547.306C68.5638 537.739 63.4561 529.224 54.3279 521.647C46.5839 515.223 40.5013 507.154 34.4262 499.093C31.5253 495.245 28.6264 491.399 25.549 487.734C17.2372 477.835 8.18787 468.682 -2.28174 461.147C-23.1743 446.107 -47.1792 435.577 -71.383 427.519C-93.3597 420.203 -113.615 418.922 -136.608 419.779C-158.941 420.606 -178.776 424.013 -200.11 431.264C-208.847 434.235 -218.644 438.527 -225.836 444.459C-232.568 450.008 -241.245 457.877 -245.156 466.004C-247.669 471.23 -247.995 476.941 -248.319 482.635C-248.39 483.849 -248.459 485.061 -248.549 486.268C-249.553 499.747 -252.853 511.204 -259.416 522.986C-260.489 524.915 -261.658 526.833 -262.835 528.763C-266.108 534.131 -269.44 539.594 -270.914 545.672C-271.133 546.571 -271.307 547.472 -271.444 548.383H-280.619Z" fill="#FFFFFF" stroke="#00A99D"/>
-</svg>

From fcd4d6cb83011de21acf0b1e7410fb155a711908 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Mon, 14 Oct 2024 19:06:33 -0300
Subject: [PATCH 11/20] Add back some vertical paddings

---
 src/templates/author/SectionOne/styles.module.less | 1 +
 src/templates/connector/Hero/styles.ts             | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/templates/author/SectionOne/styles.module.less b/src/templates/author/SectionOne/styles.module.less
index 27990ad2..a10fc6e7 100644
--- a/src/templates/author/SectionOne/styles.module.less
+++ b/src/templates/author/SectionOne/styles.module.less
@@ -2,6 +2,7 @@
 
 .container {
   .globalMaxWidth;
+  .sectionTopBottomPadding;
 
   display: flex;
   gap: 60px;
diff --git a/src/templates/connector/Hero/styles.ts b/src/templates/connector/Hero/styles.ts
index 1b89b4d1..1f0cb001 100644
--- a/src/templates/connector/Hero/styles.ts
+++ b/src/templates/connector/Hero/styles.ts
@@ -1,10 +1,11 @@
 import styled, { CSSProperties } from 'styled-components';
 
 import { ConnectorType } from '../../../../shared';
-import { globalMaxWidth } from '../../../globalStyles';
+import { globalMaxWidth, sectionTopBottomPadding } from '../../../globalStyles';
 
 export const Container = styled.div`
     ${globalMaxWidth}
+    ${sectionTopBottomPadding};
 
     display: flex;
     flex-direction: column;

From f9b81c65107887548086be7157c968e414dfa966 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Mon, 14 Oct 2024 20:55:13 -0300
Subject: [PATCH 12/20] Create a separate shared constant for the background
 colors

---
 .../DarkSwoopingLinesLeftDirectionBackground.tsx              | 3 ++-
 .../LightSwoopingLinesRightDirectionBackground.tsx            | 3 ++-
 src/components/BackgroundImages/StraightLinesBackground.tsx   | 3 ++-
 src/components/BackgroundImages/shared.ts                     | 4 ++++
 4 files changed, 10 insertions(+), 3 deletions(-)
 create mode 100644 src/components/BackgroundImages/shared.ts

diff --git a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
index 5fba0093..6bf2f8c8 100644
--- a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
+++ b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
@@ -9,6 +9,7 @@ import {
     backgroundImage,
     swoopingLines,
 } from './styles.module.less';
+import { backgroundColors } from './shared';
 
 type DarkSwoopingLinesLeftDirectionBackgroundProps = IBackgroundImageProps & {
     children?: React.ReactNode;
@@ -26,7 +27,7 @@ const DarkSwoopingLinesLeftDirectionBackground = ({
                 className={clsx(backgroundImage, swoopingLines)}
                 placeholder="blurred"
                 quality={100}
-                backgroundColor="#04192b"
+                backgroundColor={backgroundColors.dark}
             />
             <div className={className}>{children}</div>
         </div>
diff --git a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
index bd7fc6d2..b781dc3b 100644
--- a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
+++ b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
@@ -7,6 +7,7 @@ import {
     backgroundImage,
     swoopingLines,
 } from './styles.module.less';
+import { backgroundColors } from './shared';
 
 type LightSwoopingLinesRightDirectionBackgroundProps = IBackgroundImageProps & {
     children?: React.ReactNode;
@@ -24,7 +25,7 @@ const LightSwoopingLinesRightDirectionBackground = ({
                 className={clsx(backgroundImage, swoopingLines)}
                 placeholder="blurred"
                 quality={100}
-                backgroundColor="#f9fafc"
+                backgroundColor={backgroundColors.light}
             />
             <div className={className}>{children}</div>
         </div>
diff --git a/src/components/BackgroundImages/StraightLinesBackground.tsx b/src/components/BackgroundImages/StraightLinesBackground.tsx
index 4560ee00..f1293f1c 100644
--- a/src/components/BackgroundImages/StraightLinesBackground.tsx
+++ b/src/components/BackgroundImages/StraightLinesBackground.tsx
@@ -6,6 +6,7 @@ import {
     backgroundImage,
     swoopingLines,
 } from './styles.module.less';
+import { backgroundColors } from './shared';
 
 type StraightLinesBackgroundProps = {
     children?: React.ReactNode;
@@ -23,7 +24,7 @@ const StraightLinesBackground = ({
                 className={clsx(backgroundImage, swoopingLines)}
                 placeholder="blurred"
                 quality={100}
-                backgroundColor="#04192b"
+                backgroundColor={backgroundColors.dark}
             />
             <div className={className}>{children}</div>
         </div>
diff --git a/src/components/BackgroundImages/shared.ts b/src/components/BackgroundImages/shared.ts
new file mode 100644
index 00000000..c3a714ef
--- /dev/null
+++ b/src/components/BackgroundImages/shared.ts
@@ -0,0 +1,4 @@
+export const backgroundColors = {
+    dark: '#04192b',
+    light: '#f9fafc',
+};

From 6f893b60c7b161314857006b9bb083ec3804e301 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Tue, 15 Oct 2024 02:45:05 -0300
Subject: [PATCH 13/20] Add new background image for /why page background
 images

---
 .../BackgroundImages/CirclesBackground.tsx    |  24 +++++
 ...rkSwoopingLinesLeftDirectionBackground.tsx |  12 +--
 ...tSwoopingLinesRightDirectionBackground.tsx |  13 +--
 .../StraightLinesBackground.tsx               |   8 +-
 .../WhyPageStepsBackground.tsx                |  93 +++++++++++++++++
 .../BackgroundImages/styles.module.less       |   6 +-
 src/components/BlogPostPopupModal/index.tsx   |  21 +---
 src/components/BlogPostPopupModal/styles.ts   |   3 +-
 src/components/Why/styles.module.less         |  19 ++--
 .../blog-post-popup-background-image.png      | Bin 29586 -> 0 bytes
 ...-background.png => circles-background.png} | Bin
 ...or.png => swooping-lines-to-the-right.png} | Bin
 src/pages/why/index.tsx                       |  95 +++---------------
 src/pages/why/styles.module.less              |   7 +-
 src/templates/blog/index.tsx                  |   2 +-
 yarn.lock                                     |   4 +-
 16 files changed, 168 insertions(+), 139 deletions(-)
 create mode 100644 src/components/BackgroundImages/CirclesBackground.tsx
 create mode 100644 src/components/BackgroundImages/WhyPageStepsBackground.tsx
 delete mode 100644 src/images/blog-post-popup-background-image.png
 rename src/images/{product-demo-background.png => circles-background.png} (100%)
 rename src/images/{lp-connector/hero/Vector.png => swooping-lines-to-the-right.png} (100%)

diff --git a/src/components/BackgroundImages/CirclesBackground.tsx b/src/components/BackgroundImages/CirclesBackground.tsx
new file mode 100644
index 00000000..6c50ef3d
--- /dev/null
+++ b/src/components/BackgroundImages/CirclesBackground.tsx
@@ -0,0 +1,24 @@
+import React from 'react';
+import { StaticImage } from 'gatsby-plugin-image';
+import clsx from 'clsx';
+import { fullWidth, backgroundImage, fullHeight } from './styles.module.less';
+
+const CirclesBackground = ({
+    children,
+    className,
+}: React.BaseHTMLAttributes<HTMLDivElement>) => {
+    return (
+        <div className={fullWidth}>
+            <StaticImage
+                alt=""
+                src="../../images/circles-background.png"
+                className={clsx(backgroundImage, fullHeight)}
+                placeholder="blurred"
+                quality={100}
+            />
+            <div className={className}>{children}</div>
+        </div>
+    );
+};
+
+export default CirclesBackground;
diff --git a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
index 6bf2f8c8..7d1af025 100644
--- a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
+++ b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
@@ -1,17 +1,11 @@
 import React from 'react';
 
-import { IBackgroundImageProps } from 'gatsby-background-image';
-
 import clsx from 'clsx';
 import { StaticImage } from 'gatsby-plugin-image';
-import {
-    container,
-    backgroundImage,
-    swoopingLines,
-} from './styles.module.less';
+import { container, backgroundImage, fullHeight } from './styles.module.less';
 import { backgroundColors } from './shared';
 
-type DarkSwoopingLinesLeftDirectionBackgroundProps = IBackgroundImageProps & {
+type DarkSwoopingLinesLeftDirectionBackgroundProps = {
     children?: React.ReactNode;
 } & React.HTMLAttributes<HTMLDivElement>;
 
@@ -24,7 +18,7 @@ const DarkSwoopingLinesLeftDirectionBackground = ({
             <StaticImage
                 alt=""
                 src="../../images/overlay-vector-left.png"
-                className={clsx(backgroundImage, swoopingLines)}
+                className={clsx(backgroundImage, fullHeight)}
                 placeholder="blurred"
                 quality={100}
                 backgroundColor={backgroundColors.dark}
diff --git a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
index b781dc3b..5dc30e2e 100644
--- a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
+++ b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
@@ -1,15 +1,10 @@
 import React from 'react';
-import { IBackgroundImageProps } from 'gatsby-background-image';
 import { StaticImage } from 'gatsby-plugin-image';
 import clsx from 'clsx';
-import {
-    container,
-    backgroundImage,
-    swoopingLines,
-} from './styles.module.less';
+import { container, backgroundImage, fullHeight } from './styles.module.less';
 import { backgroundColors } from './shared';
 
-type LightSwoopingLinesRightDirectionBackgroundProps = IBackgroundImageProps & {
+type LightSwoopingLinesRightDirectionBackgroundProps = {
     children?: React.ReactNode;
 } & React.HTMLAttributes<HTMLDivElement>;
 
@@ -21,8 +16,8 @@ const LightSwoopingLinesRightDirectionBackground = ({
         <div className={container}>
             <StaticImage
                 alt=""
-                src="../../images/lp-connector/hero/Vector.png"
-                className={clsx(backgroundImage, swoopingLines)}
+                src="../../images/swooping-lines-to-the-right.png"
+                className={clsx(backgroundImage, fullHeight)}
                 placeholder="blurred"
                 quality={100}
                 backgroundColor={backgroundColors.light}
diff --git a/src/components/BackgroundImages/StraightLinesBackground.tsx b/src/components/BackgroundImages/StraightLinesBackground.tsx
index f1293f1c..5b1b431f 100644
--- a/src/components/BackgroundImages/StraightLinesBackground.tsx
+++ b/src/components/BackgroundImages/StraightLinesBackground.tsx
@@ -1,11 +1,7 @@
 import React from 'react';
 import clsx from 'clsx';
 import { StaticImage } from 'gatsby-plugin-image';
-import {
-    container,
-    backgroundImage,
-    swoopingLines,
-} from './styles.module.less';
+import { container, backgroundImage, fullHeight } from './styles.module.less';
 import { backgroundColors } from './shared';
 
 type StraightLinesBackgroundProps = {
@@ -21,7 +17,7 @@ const StraightLinesBackground = ({
             <StaticImage
                 alt=""
                 src="../../images/lp-connector/real-time/Vector.png"
-                className={clsx(backgroundImage, swoopingLines)}
+                className={clsx(backgroundImage, fullHeight)}
                 placeholder="blurred"
                 quality={100}
                 backgroundColor={backgroundColors.dark}
diff --git a/src/components/BackgroundImages/WhyPageStepsBackground.tsx b/src/components/BackgroundImages/WhyPageStepsBackground.tsx
new file mode 100644
index 00000000..96396cce
--- /dev/null
+++ b/src/components/BackgroundImages/WhyPageStepsBackground.tsx
@@ -0,0 +1,93 @@
+import React from 'react';
+import { GatsbyImage, getImage } from 'gatsby-plugin-image';
+import clsx from 'clsx';
+import { graphql, useStaticQuery } from 'gatsby';
+import { container, backgroundImage } from './styles.module.less';
+
+interface WhyPageStepsBackgroundProps
+    extends React.BaseHTMLAttributes<HTMLDivElement> {
+    activePage: number;
+}
+
+const WhyPageStepsBackground = ({
+    children,
+    className,
+    activePage,
+}: WhyPageStepsBackgroundProps) => {
+    const images = useStaticQuery(graphql`
+        query {
+            steps07: file(relativePath: { eq: "welcome-bg.png" }) {
+                childImageSharp {
+                    gatsbyImageData(
+                        quality: 90
+                        placeholder: BLURRED
+                        formats: [AUTO, WEBP, AVIF]
+                        layout: FULL_WIDTH
+                        width: 1180
+                    )
+                }
+            }
+            steps123: file(relativePath: { eq: "flow-images/step1-bg.png" }) {
+                childImageSharp {
+                    gatsbyImageData(
+                        quality: 90
+                        placeholder: BLURRED
+                        formats: [AUTO, WEBP, AVIF]
+                        layout: FULL_WIDTH
+                        width: 1180
+                    )
+                }
+            }
+            steps45: file(relativePath: { eq: "flow-images/step4-bg.png" }) {
+                childImageSharp {
+                    gatsbyImageData(
+                        quality: 90
+                        placeholder: BLURRED
+                        formats: [AUTO, WEBP, AVIF]
+                        layout: FULL_WIDTH
+                        width: 1180
+                    )
+                }
+            }
+            step6: file(relativePath: { eq: "flow-images/step6-bg.png" }) {
+                childImageSharp {
+                    gatsbyImageData(
+                        quality: 90
+                        placeholder: BLURRED
+                        formats: [AUTO, WEBP, AVIF]
+                        layout: FULL_WIDTH
+                        width: 1180
+                    )
+                }
+            }
+        }
+    `);
+
+    const steps07Image = getImage(images.steps07.childImageSharp);
+    const steps123Image = getImage(images.steps123.childImageSharp);
+    const steps45Image = getImage(images.steps45.childImageSharp);
+    const step6Image = getImage(images.step6.childImageSharp);
+
+    const stepsImage = [0, 7].includes(activePage)
+        ? steps07Image
+        : [1, 2, 3].includes(activePage)
+          ? steps123Image
+          : [4, 5].includes(activePage)
+            ? steps45Image
+            : step6Image;
+
+    return (
+        <div className={container}>
+            {stepsImage ? (
+                <GatsbyImage
+                    alt=""
+                    image={stepsImage}
+                    className={clsx(backgroundImage)}
+                />
+            ) : null}
+            <div className={className}>{children}</div>
+        </div>
+    );
+};
+
+export default WhyPageStepsBackground;
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
index 696127f5..fde5c800 100644
--- a/src/components/BackgroundImages/styles.module.less
+++ b/src/components/BackgroundImages/styles.module.less
@@ -4,6 +4,10 @@
   position: relative;
 }
 
+.fullWidth {
+  width: 100%;
+}
+
 .backgroundImage {
   position: absolute !important;
   width: 100%;
@@ -11,7 +15,7 @@
   z-index: -1;
 }
 
-.swoopingLines {
+.fullHeight {
   bottom: 0;
 }
 
diff --git a/src/components/BlogPostPopupModal/index.tsx b/src/components/BlogPostPopupModal/index.tsx
index 4880efdd..fed09196 100644
--- a/src/components/BlogPostPopupModal/index.tsx
+++ b/src/components/BlogPostPopupModal/index.tsx
@@ -1,5 +1,4 @@
 import { IconButton } from '@mui/material';
-import { graphql, useStaticQuery } from 'gatsby';
 import { StaticImage } from 'gatsby-plugin-image';
 import * as React from 'react';
 import { webinarsUrl } from '../../../shared';
@@ -59,20 +58,6 @@ const SETTINGS = {
 const STORAGE_KEY = `@estuary/closeBlogPostPopup${SETTINGS.version}`;
 
 function BlogPostPopupModal() {
-    const imageData = useStaticQuery(graphql`
-        query {
-            imageData: file(
-                relativePath: { eq: "blog-post-popup-background-image.png" }
-            ) {
-                childImageSharp {
-                    fluid(quality: 100, maxWidth: 1385) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-        }
-    `);
-
     const [openDialog, setOpenDialog] = React.useState(false);
 
     const hasOpened = React.useRef(false);
@@ -106,11 +91,7 @@ function BlogPostPopupModal() {
                     <XIcon fontSize="large" />
                 </IconButton>
             </CloseButtonWrapper>
-            <LeftColumn
-                fluid={imageData.imageData.childImageSharp.fluid}
-                fadeIn={false}
-                critical={true}
-            >
+            <LeftColumn>
                 <TitleWrapper>
                     <span>Webinar:</span>
                     <WebinarTitle>{SETTINGS.title}</WebinarTitle>
diff --git a/src/components/BlogPostPopupModal/styles.ts b/src/components/BlogPostPopupModal/styles.ts
index b3856ecc..ec64e92d 100644
--- a/src/components/BlogPostPopupModal/styles.ts
+++ b/src/components/BlogPostPopupModal/styles.ts
@@ -1,6 +1,5 @@
 import CloseIcon from '@mui/icons-material/Close';
 import { Dialog } from '@mui/material';
-import BackgroundImage from 'gatsby-background-image';
 import styled from 'styled-components';
 
 export const Container = styled(Dialog)`
@@ -28,7 +27,7 @@ export const Container = styled(Dialog)`
     }
 `;
 
-export const LeftColumn = styled(BackgroundImage)`
+export const LeftColumn = styled.div`
     display: grid;
     grid-template-rows: auto 1fr;
     align-items: center;
diff --git a/src/components/Why/styles.module.less b/src/components/Why/styles.module.less
index 1bcf6875..0f33977d 100644
--- a/src/components/Why/styles.module.less
+++ b/src/components/Why/styles.module.less
@@ -120,16 +120,18 @@
 }
 
 .step {
-  max-width: 881px;
+  max-width: 68%;
   width: 100%;
-  padding: 6% 4% 4% 6%;
-  margin: auto;
+  padding: 5% 4% 4% 5% !important;
+  margin-top: 5%;
+  margin-left: 23%;
+  margin-bottom: 5%;
 }
 
 .step0 {
-  max-width: 780px !important;
   background: #fff;
-  padding: 10% 8% 8% 10% !important;
+  margin-top: 8%;
+  margin-bottom: 10.5%;
 
   .stepHeading {
     color: #fff;
@@ -336,6 +338,8 @@
 
 .step1 {
   position: relative;
+  margin-top: 5%;
+  margin-bottom: 5%;
 
   .zoomInOutCircle {
     left: calc(50% - 23px);
@@ -449,6 +453,7 @@
 
 .step5 {
   position: relative;
+  margin-bottom: 10%;
 
   .zoomInOutCircle {
     right: 280px;
@@ -497,9 +502,9 @@
 }
 
 .step7 {
-  max-width: 780px !important;
   background: #fff;
-  padding: 10% 8% 8% 10% !important;
+  margin-top: 8%;
+  margin-bottom: 8%;
 
   @media (max-width: 1560px) and (min-width: 1200px) {
     padding: 30px 35px 35px;
diff --git a/src/images/blog-post-popup-background-image.png b/src/images/blog-post-popup-background-image.png
deleted file mode 100644
index 2b82e4903deee5d4e2a709c74f120ff734f37a0d..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 29586
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
F`hRQ2okRct

diff --git a/src/images/product-demo-background.png b/src/images/circles-background.png
similarity index 100%
rename from src/images/product-demo-background.png
rename to src/images/circles-background.png
diff --git a/src/images/lp-connector/hero/Vector.png b/src/images/swooping-lines-to-the-right.png
similarity index 100%
rename from src/images/lp-connector/hero/Vector.png
rename to src/images/swooping-lines-to-the-right.png
diff --git a/src/pages/why/index.tsx b/src/pages/why/index.tsx
index 4e01f958..9db50302 100644
--- a/src/pages/why/index.tsx
+++ b/src/pages/why/index.tsx
@@ -1,12 +1,13 @@
-import { graphql, useStaticQuery } from 'gatsby';
-import BackgroundImage from 'gatsby-background-image';
 import * as React from 'react';
 import { Navigation, Step } from '../../components/Why';
 import Seo from '../../components/seo';
+import CirclesBackground from '../../components/BackgroundImages/CirclesBackground';
+import WhyPageStepsBackground from '../../components/BackgroundImages/WhyPageStepsBackground';
 import {
     container,
     mainContentWrap,
     macBg,
+    bgImage,
     stepsControls,
     prevStep,
     nextStep,
@@ -17,87 +18,21 @@ export const Head = () => <Seo title="Automate Data Streaming" />;
 const WhyEstuary = () => {
     const [activePage, setActivePage] = React.useState(0);
 
-    const images = useStaticQuery(graphql`
-        query {
-            productDemoBackground: file(
-                relativePath: { eq: "product-demo-background.png" }
-            ) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 1180) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-            steps07: file(relativePath: { eq: "welcome-bg.png" }) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 1180) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-            steps123: file(relativePath: { eq: "flow-images/step1-bg.png" }) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 1180) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-            steps45: file(relativePath: { eq: "flow-images/step4-bg.png" }) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 1180) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-            step6: file(relativePath: { eq: "flow-images/step6-bg.png" }) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 1180) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-        }
-    `);
-
-    const mainContentWrapperImageFluid =
-        images.productDemoBackground.childImageSharp.fluid;
-    const steps07ImageFluid = images.steps07.childImageSharp.fluid;
-    const steps123ImageFluid = images.steps123.childImageSharp.fluid;
-    const steps45ImageFluid = images.steps45.childImageSharp.fluid;
-    const step6ImageFluid = images.step6.childImageSharp.fluid;
-
-    const stepsImageFluid = [0, 7].includes(activePage)
-        ? steps07ImageFluid
-        : [1, 2, 3].includes(activePage)
-          ? steps123ImageFluid
-          : [4, 5].includes(activePage)
-            ? steps45ImageFluid
-            : step6ImageFluid;
-
-    const commonBackgroundImageProps = {
-        fadeIn: false,
-        critical: true,
-    };
-
     return (
         <main className={container}>
             <Navigation activePage={activePage} setActivePage={setActivePage} />
-            <BackgroundImage
-                fluid={mainContentWrapperImageFluid}
-                className={mainContentWrap}
-                {...commonBackgroundImageProps}
-            >
-                <BackgroundImage
-                    fluid={stepsImageFluid}
-                    className={macBg}
-                    style={{ backgroundSize: '100%' }}
-                    {...commonBackgroundImageProps}
-                >
-                    <Step
+            <CirclesBackground className={mainContentWrap}>
+                <div className={macBg}>
+                    <WhyPageStepsBackground
                         activePage={activePage}
-                        setActivePage={setActivePage}
-                    />
-                </BackgroundImage>
+                        className={bgImage}
+                    >
+                        <Step
+                            activePage={activePage}
+                            setActivePage={setActivePage}
+                        />
+                    </WhyPageStepsBackground>
+                </div>
                 <div className={stepsControls}>
                     <button
                         className={prevStep}
@@ -118,7 +53,7 @@ const WhyEstuary = () => {
                         <span>Next</span>
                     </button>
                 </div>
-            </BackgroundImage>
+            </CirclesBackground>
         </main>
     );
 };
diff --git a/src/pages/why/styles.module.less b/src/pages/why/styles.module.less
index 6e3d9781..2395b65a 100644
--- a/src/pages/why/styles.module.less
+++ b/src/pages/why/styles.module.less
@@ -100,10 +100,9 @@
 }
 
 .macBg {
-  max-width: 1180px;
+  max-width: 1280px;
   height: auto;
   width: 100%;
-  padding: 7% 4% 4% 13%;
 
   @media (max-height: 747px) {
     width: 85%;
@@ -115,3 +114,7 @@
     padding: 10% 12% 26% 19%;
   }
 }
+
+.bgImage {
+  padding-top: 5%;
+}
diff --git a/src/templates/blog/index.tsx b/src/templates/blog/index.tsx
index 903dbc30..e8f94568 100644
--- a/src/templates/blog/index.tsx
+++ b/src/templates/blog/index.tsx
@@ -138,7 +138,7 @@ const BlogIndex = ({
                 </div>
                 <div className={blogsIndexBody}>
                     {(query.length > 0 ? results : posts).map((post) => (
-                        <BlogPostCard key={post.Slug} {...post} />
+                        <BlogPostCard key={post.slug} {...post} />
                     ))}
                 </div>
             </BigImageBackground>
diff --git a/yarn.lock b/yarn.lock
index 9ccb5a2c..02bc3b0b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1191,7 +1191,7 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.12.5", "@babel/runtime@^7.14.6", "@babel/runtime@^7.15.4", "@babel/runtime@^7.16.5", "@babel/runtime@^7.17.9", "@babel/runtime@^7.18.3", "@babel/runtime@^7.19.4", "@babel/runtime@^7.2.0", "@babel/runtime@^7.20.13", "@babel/runtime@^7.20.6", "@babel/runtime@^7.20.7", "@babel/runtime@^7.21.0", "@babel/runtime@^7.23.2", "@babel/runtime@^7.4.3", "@babel/runtime@^7.4.4", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.7", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2", "@babel/runtime@^7.9.6":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.12.5", "@babel/runtime@^7.14.6", "@babel/runtime@^7.15.4", "@babel/runtime@^7.17.9", "@babel/runtime@^7.18.3", "@babel/runtime@^7.19.4", "@babel/runtime@^7.2.0", "@babel/runtime@^7.20.13", "@babel/runtime@^7.20.6", "@babel/runtime@^7.20.7", "@babel/runtime@^7.21.0", "@babel/runtime@^7.23.2", "@babel/runtime@^7.4.3", "@babel/runtime@^7.4.4", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.7", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2", "@babel/runtime@^7.9.6":
   version "7.23.2"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.2.tgz#062b0ac103261d68a966c4c7baf2ae3e62ec3885"
   integrity sha512-mM8eg4yl5D6i3lu2QKPuPH4FArvJ8KhTofbE7jwMUv9KX5mBvwPAqnV3MlyBNqdp9RyRKP6Yck8TrfYrPvX3bg==
@@ -1205,7 +1205,7 @@
   dependencies:
     regenerator-runtime "^0.14.0"
 
-"@babel/runtime@^7.25.0", "@babel/runtime@^7.25.6":
+"@babel/runtime@^7.16.5", "@babel/runtime@^7.25.0", "@babel/runtime@^7.25.6":
   version "7.25.7"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.25.7.tgz#7ffb53c37a8f247c8c4d335e89cdf16a2e0d0fb6"
   integrity sha512-FjoyLe754PMiYsFaN5C94ttGiOmBNYTf6pLr4xXHAT5uctHb092PBszndLDR5XA/jghQvn4n7JMHl7dmTgbm9w==

From d10d3e554d814deaf62f4c71fa10dfc560acc8ea Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Tue, 15 Oct 2024 11:53:46 -0300
Subject: [PATCH 14/20] Add new background image for CDC background image

---
 .../BackgroundImages/CdcBackground.tsx        | 28 +++++++++++++++++++
 .../WhyPageStepsBackground.tsx                |  3 +-
 .../BackgroundImages/styles.module.less       | 11 ++++++++
 .../ChangeData/components/Cards/index.tsx     | 21 +-------------
 .../ChangeData/components/Cards/style.ts      | 21 ++++++++------
 5 files changed, 54 insertions(+), 30 deletions(-)
 create mode 100644 src/components/BackgroundImages/CdcBackground.tsx

diff --git a/src/components/BackgroundImages/CdcBackground.tsx b/src/components/BackgroundImages/CdcBackground.tsx
new file mode 100644
index 00000000..e4fab767
--- /dev/null
+++ b/src/components/BackgroundImages/CdcBackground.tsx
@@ -0,0 +1,28 @@
+import React from 'react';
+import { StaticImage } from 'gatsby-plugin-image';
+import clsx from 'clsx';
+import {
+    container,
+    backgroundImage,
+    cdcBackgroundImage,
+} from './styles.module.less';
+
+const CdcBackground = ({
+    children,
+    className,
+}: React.BaseHTMLAttributes<HTMLDivElement>) => {
+    return (
+        <div className={container}>
+            <StaticImage
+                alt=""
+                src="../../images/lp-connector/change-data/background.png"
+                className={clsx(backgroundImage, cdcBackgroundImage)}
+                placeholder="blurred"
+                quality={100}
+            />
+            <div className={className}>{children}</div>
+        </div>
+    );
+};
+
+export default CdcBackground;
diff --git a/src/components/BackgroundImages/WhyPageStepsBackground.tsx b/src/components/BackgroundImages/WhyPageStepsBackground.tsx
index 96396cce..873d5c74 100644
--- a/src/components/BackgroundImages/WhyPageStepsBackground.tsx
+++ b/src/components/BackgroundImages/WhyPageStepsBackground.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
 import { GatsbyImage, getImage } from 'gatsby-plugin-image';
-import clsx from 'clsx';
 import { graphql, useStaticQuery } from 'gatsby';
 import { container, backgroundImage } from './styles.module.less';
 
@@ -82,7 +81,7 @@ const WhyPageStepsBackground = ({
                 <GatsbyImage
                     alt=""
                     image={stepsImage}
-                    className={clsx(backgroundImage)}
+                    className={backgroundImage}
                 />
             ) : null}
             <div className={className}>{children}</div>
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
index fde5c800..9b25a1c2 100644
--- a/src/components/BackgroundImages/styles.module.less
+++ b/src/components/BackgroundImages/styles.module.less
@@ -27,3 +27,14 @@
     bottom: 0;
   }
 }
+
+.cdcBackgroundImage {
+  max-width: 378px;
+  max-height: 374px;
+  left: 50%;
+  transform: translateX(-50%);
+
+  @media (max-width: 1170px) {
+    top: 25%;
+  }
+}
diff --git a/src/templates/connector/ChangeData/components/Cards/index.tsx b/src/templates/connector/ChangeData/components/Cards/index.tsx
index 77a47c4a..e475c068 100644
--- a/src/templates/connector/ChangeData/components/Cards/index.tsx
+++ b/src/templates/connector/ChangeData/components/Cards/index.tsx
@@ -1,32 +1,13 @@
 import { StaticImage } from 'gatsby-plugin-image';
 import React from 'react';
 
-import { graphql, useStaticQuery } from 'gatsby';
 import Card from '../Card';
 
 import { Container, ContainerCards } from './style';
 
 const TheAutomationCards = ({ $reverseDesktop = false }) => {
-    const imageData = useStaticQuery(graphql`
-        query {
-            imageData: file(
-                relativePath: { eq: "lp-connector/change-data/background.png" }
-            ) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 378) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-        }
-    `);
-
     return (
-        <Container
-            fluid={imageData.imageData.childImageSharp.fluid}
-            fadeIn={false}
-            critical={true}
-        >
+        <Container>
             <ContainerCards>
                 <Card
                     title="HIGH THROUGHPUT"
diff --git a/src/templates/connector/ChangeData/components/Cards/style.ts b/src/templates/connector/ChangeData/components/Cards/style.ts
index 5e058a24..a3c1e583 100644
--- a/src/templates/connector/ChangeData/components/Cards/style.ts
+++ b/src/templates/connector/ChangeData/components/Cards/style.ts
@@ -1,19 +1,17 @@
 import styled from 'styled-components';
 
-import BackgroundImage from 'gatsby-background-image';
+import CdcBackground from '../../../../../components/BackgroundImages/CdcBackground';
 
 interface ContainerCardsProps {
     $reverseDesktop: boolean;
-    $isBottomCard?: boolean;
 }
 
-export const Container = styled(BackgroundImage)`
+export const Container = styled(CdcBackground)`
     display: flex;
     flex-direction: column;
-    gap: 219px;
-    background-size: 378px;
+    gap: 120px;
 
-    @media (min-width: 1024px) {
+    @media (min-width: 1170px) {
         flex-direction: column-reverse;
     }
 `;
@@ -23,7 +21,7 @@ export const ContainerCards: any = styled.div<ContainerCardsProps>`
     flex-direction: column-reverse;
     gap: 20px;
 
-    @media (min-width: 1024px) {
+    @media (min-width: 1170px) {
         display: flex;
         flex-direction: ${({ $reverseDesktop }) =>
             $reverseDesktop ? 'column' : 'row'};
@@ -35,7 +33,14 @@ export const ContainerCards: any = styled.div<ContainerCardsProps>`
         }
     }
 
+    @media (min-width: 1025px) {
+        align-items: center;
+    }
+
     @media (max-width: 425px) {
-        margin-top: ${({ $isBottomCard }) => ($isBottomCard ? '-200px' : '0')};
+        div {
+            border-radius: 24px;
+            padding: 12px;
+        }
     }
 `;

From 67c364962b95c17560a0bb87f4389c9022661f9b Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Tue, 15 Oct 2024 13:02:24 -0300
Subject: [PATCH 15/20] Add new background image for connector page > take a
 tour section > background image

---
 .../BubblesCircleBackground.tsx               | 28 +++++++++++++++++++
 .../BackgroundImages/styles.module.less       | 10 +++++++
 src/templates/connector/TakeATour/index.tsx   | 21 +-------------
 src/templates/connector/TakeATour/styles.ts   |  5 ++--
 4 files changed, 41 insertions(+), 23 deletions(-)
 create mode 100644 src/components/BackgroundImages/BubblesCircleBackground.tsx

diff --git a/src/components/BackgroundImages/BubblesCircleBackground.tsx b/src/components/BackgroundImages/BubblesCircleBackground.tsx
new file mode 100644
index 00000000..f151cc54
--- /dev/null
+++ b/src/components/BackgroundImages/BubblesCircleBackground.tsx
@@ -0,0 +1,28 @@
+import React from 'react';
+import { StaticImage } from 'gatsby-plugin-image';
+import clsx from 'clsx';
+import {
+    container,
+    backgroundImage,
+    bubbleCircleBackgroundImage,
+} from './styles.module.less';
+
+const BubblesCircleBackground = ({
+    children,
+    className,
+}: React.BaseHTMLAttributes<HTMLDivElement>) => {
+    return (
+        <div className={container}>
+            <StaticImage
+                alt=""
+                src="../../images/lp-connector/take-a-tour/background.png"
+                className={clsx(backgroundImage, bubbleCircleBackgroundImage)}
+                placeholder="blurred"
+                quality={100}
+            />
+            <div className={className}>{children}</div>
+        </div>
+    );
+};
+
+export default BubblesCircleBackground;
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
index 9b25a1c2..eeb5a0d3 100644
--- a/src/components/BackgroundImages/styles.module.less
+++ b/src/components/BackgroundImages/styles.module.less
@@ -38,3 +38,13 @@
     top: 25%;
   }
 }
+
+.bubbleCircleBackgroundImage {
+  z-index: 0;
+  max-height: 478px;
+  max-width: 547px;
+  height: 100%;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
diff --git a/src/templates/connector/TakeATour/index.tsx b/src/templates/connector/TakeATour/index.tsx
index 43c88a90..8cbb6efe 100644
--- a/src/templates/connector/TakeATour/index.tsx
+++ b/src/templates/connector/TakeATour/index.tsx
@@ -1,7 +1,6 @@
 import { StaticImage } from 'gatsby-plugin-image';
 import React from 'react';
 
-import { graphql, useStaticQuery } from 'gatsby';
 import { estuaryProductFlowVideoUrl } from '../../../../shared';
 import useWindowExistence from '../../../hooks/useWindowExistence';
 import { DefaultWrapperDark } from '../../../styles/wrappers';
@@ -20,30 +19,12 @@ import {
 import TakeATourButtons from './TakeATourButtons';
 
 const TakeATour = () => {
-    const imageData = useStaticQuery(graphql`
-        query {
-            imageData: file(
-                relativePath: { eq: "lp-connector/take-a-tour/background.png" }
-            ) {
-                childImageSharp {
-                    fluid(quality: 90, maxWidth: 547) {
-                        ...GatsbyImageSharpFluid_withWebp_noBase64
-                    }
-                }
-            }
-        }
-    `);
-
     const hasWindow = useWindowExistence();
 
     return (
         <DefaultWrapperDark>
             <Container>
-                <ContainerLeft
-                    fluid={imageData.imageData.childImageSharp.fluid}
-                    fadeIn={false}
-                    critical={true}
-                >
+                <ContainerLeft>
                     {hasWindow ? (
                         <EstuaryProductVideo
                             light={
diff --git a/src/templates/connector/TakeATour/styles.ts b/src/templates/connector/TakeATour/styles.ts
index 4e877bbb..69c3a48d 100644
--- a/src/templates/connector/TakeATour/styles.ts
+++ b/src/templates/connector/TakeATour/styles.ts
@@ -1,7 +1,7 @@
-import BackgroundImage from 'gatsby-background-image';
 import ReactPlayer from 'react-player';
 import styled from 'styled-components';
 import { globalMaxWidth } from '../../../globalStyles';
+import BubblesCircleBackground from '../../../components/BackgroundImages/BubblesCircleBackground';
 
 export const Container = styled.div`
     ${globalMaxWidth}
@@ -17,7 +17,7 @@ export const Container = styled.div`
     }
 `;
 
-export const ContainerLeft = styled(BackgroundImage)`
+export const ContainerLeft = styled(BubblesCircleBackground)`
     display: flex;
     justify-content: center;
     align-items: center;
@@ -25,7 +25,6 @@ export const ContainerLeft = styled(BackgroundImage)`
     height: auto;
     width: 100%;
     padding: 80px 0;
-    background-size: 520px;
 `;
 
 export const EstuaryProductVideo = styled(ReactPlayer)`

From 35bc8a132791a9dd02227599654e821586e3c193 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Tue, 15 Oct 2024 13:35:19 -0300
Subject: [PATCH 16/20] Create a component for the background wrapper

---
 .../BackgroundImages/BackgroundWrapper.tsx           | 12 ++++++++++++
 .../BackgroundImages/BigImageBackground.tsx          |  7 ++++---
 .../BackgroundImages/BubblesCircleBackground.tsx     |  6 +++---
 src/components/BackgroundImages/CdcBackground.tsx    | 11 ++++-------
 .../DarkSwoopingLinesLeftDirectionBackground.tsx     |  7 ++++---
 .../LightSwoopingLinesRightDirectionBackground.tsx   |  7 ++++---
 .../BackgroundImages/StraightLinesBackground.tsx     |  7 ++++---
 .../BackgroundImages/WhyPageStepsBackground.tsx      |  7 ++++---
 src/components/BackgroundImages/styles.module.less   |  2 +-
 9 files changed, 40 insertions(+), 26 deletions(-)
 create mode 100644 src/components/BackgroundImages/BackgroundWrapper.tsx

diff --git a/src/components/BackgroundImages/BackgroundWrapper.tsx b/src/components/BackgroundImages/BackgroundWrapper.tsx
new file mode 100644
index 00000000..a1ea2778
--- /dev/null
+++ b/src/components/BackgroundImages/BackgroundWrapper.tsx
@@ -0,0 +1,12 @@
+import React from 'react';
+import { wrapper } from './styles.module.less';
+
+interface BackgroundWrapperProps {
+    children: React.ReactNode;
+}
+
+const BackgroundWrapper = ({ children }: BackgroundWrapperProps) => {
+    return <div className={wrapper}>{children}</div>;
+};
+
+export default BackgroundWrapper;
diff --git a/src/components/BackgroundImages/BigImageBackground.tsx b/src/components/BackgroundImages/BigImageBackground.tsx
index 1d395c12..a64a6ab0 100644
--- a/src/components/BackgroundImages/BigImageBackground.tsx
+++ b/src/components/BackgroundImages/BigImageBackground.tsx
@@ -1,14 +1,15 @@
 import React from 'react';
 import { StaticImage } from 'gatsby-plugin-image';
 import clsx from 'clsx';
-import { container, backgroundImage, bigVector } from './styles.module.less';
+import { backgroundImage, bigVector } from './styles.module.less';
+import BackgroundWrapper from './BackgroundWrapper';
 
 const BigImageBackground = ({
     children,
     className,
 }: React.BaseHTMLAttributes<HTMLDivElement>) => {
     return (
-        <div className={container}>
+        <BackgroundWrapper>
             <StaticImage
                 alt=""
                 src="../../images/blogs-bg.png"
@@ -17,7 +18,7 @@ const BigImageBackground = ({
                 quality={100}
             />
             <div className={className}>{children}</div>
-        </div>
+        </BackgroundWrapper>
     );
 };
 
diff --git a/src/components/BackgroundImages/BubblesCircleBackground.tsx b/src/components/BackgroundImages/BubblesCircleBackground.tsx
index f151cc54..3ab6b68d 100644
--- a/src/components/BackgroundImages/BubblesCircleBackground.tsx
+++ b/src/components/BackgroundImages/BubblesCircleBackground.tsx
@@ -2,17 +2,17 @@ import React from 'react';
 import { StaticImage } from 'gatsby-plugin-image';
 import clsx from 'clsx';
 import {
-    container,
     backgroundImage,
     bubbleCircleBackgroundImage,
 } from './styles.module.less';
+import BackgroundWrapper from './BackgroundWrapper';
 
 const BubblesCircleBackground = ({
     children,
     className,
 }: React.BaseHTMLAttributes<HTMLDivElement>) => {
     return (
-        <div className={container}>
+        <BackgroundWrapper>
             <StaticImage
                 alt=""
                 src="../../images/lp-connector/take-a-tour/background.png"
@@ -21,7 +21,7 @@ const BubblesCircleBackground = ({
                 quality={100}
             />
             <div className={className}>{children}</div>
-        </div>
+        </BackgroundWrapper>
     );
 };
 
diff --git a/src/components/BackgroundImages/CdcBackground.tsx b/src/components/BackgroundImages/CdcBackground.tsx
index e4fab767..fae6fa1a 100644
--- a/src/components/BackgroundImages/CdcBackground.tsx
+++ b/src/components/BackgroundImages/CdcBackground.tsx
@@ -1,18 +1,15 @@
 import React from 'react';
 import { StaticImage } from 'gatsby-plugin-image';
 import clsx from 'clsx';
-import {
-    container,
-    backgroundImage,
-    cdcBackgroundImage,
-} from './styles.module.less';
+import { backgroundImage, cdcBackgroundImage } from './styles.module.less';
+import BackgroundWrapper from './BackgroundWrapper';
 
 const CdcBackground = ({
     children,
     className,
 }: React.BaseHTMLAttributes<HTMLDivElement>) => {
     return (
-        <div className={container}>
+        <BackgroundWrapper>
             <StaticImage
                 alt=""
                 src="../../images/lp-connector/change-data/background.png"
@@ -21,7 +18,7 @@ const CdcBackground = ({
                 quality={100}
             />
             <div className={className}>{children}</div>
-        </div>
+        </BackgroundWrapper>
     );
 };
 
diff --git a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
index 7d1af025..5a49c99d 100644
--- a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
+++ b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
@@ -2,8 +2,9 @@ import React from 'react';
 
 import clsx from 'clsx';
 import { StaticImage } from 'gatsby-plugin-image';
-import { container, backgroundImage, fullHeight } from './styles.module.less';
+import { backgroundImage, fullHeight } from './styles.module.less';
 import { backgroundColors } from './shared';
+import BackgroundWrapper from './BackgroundWrapper';
 
 type DarkSwoopingLinesLeftDirectionBackgroundProps = {
     children?: React.ReactNode;
@@ -14,7 +15,7 @@ const DarkSwoopingLinesLeftDirectionBackground = ({
     className,
 }: DarkSwoopingLinesLeftDirectionBackgroundProps) => {
     return (
-        <div className={container}>
+        <BackgroundWrapper>
             <StaticImage
                 alt=""
                 src="../../images/overlay-vector-left.png"
@@ -24,7 +25,7 @@ const DarkSwoopingLinesLeftDirectionBackground = ({
                 backgroundColor={backgroundColors.dark}
             />
             <div className={className}>{children}</div>
-        </div>
+        </BackgroundWrapper>
     );
 };
 
diff --git a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
index 5dc30e2e..aed8fc26 100644
--- a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
+++ b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
@@ -1,8 +1,9 @@
 import React from 'react';
 import { StaticImage } from 'gatsby-plugin-image';
 import clsx from 'clsx';
-import { container, backgroundImage, fullHeight } from './styles.module.less';
+import { backgroundImage, fullHeight } from './styles.module.less';
 import { backgroundColors } from './shared';
+import BackgroundWrapper from './BackgroundWrapper';
 
 type LightSwoopingLinesRightDirectionBackgroundProps = {
     children?: React.ReactNode;
@@ -13,7 +14,7 @@ const LightSwoopingLinesRightDirectionBackground = ({
     className,
 }: LightSwoopingLinesRightDirectionBackgroundProps) => {
     return (
-        <div className={container}>
+        <BackgroundWrapper>
             <StaticImage
                 alt=""
                 src="../../images/swooping-lines-to-the-right.png"
@@ -23,7 +24,7 @@ const LightSwoopingLinesRightDirectionBackground = ({
                 backgroundColor={backgroundColors.light}
             />
             <div className={className}>{children}</div>
-        </div>
+        </BackgroundWrapper>
     );
 };
 
diff --git a/src/components/BackgroundImages/StraightLinesBackground.tsx b/src/components/BackgroundImages/StraightLinesBackground.tsx
index 5b1b431f..fc545a3e 100644
--- a/src/components/BackgroundImages/StraightLinesBackground.tsx
+++ b/src/components/BackgroundImages/StraightLinesBackground.tsx
@@ -1,8 +1,9 @@
 import React from 'react';
 import clsx from 'clsx';
 import { StaticImage } from 'gatsby-plugin-image';
-import { container, backgroundImage, fullHeight } from './styles.module.less';
+import { backgroundImage, fullHeight } from './styles.module.less';
 import { backgroundColors } from './shared';
+import BackgroundWrapper from './BackgroundWrapper';
 
 type StraightLinesBackgroundProps = {
     children?: React.ReactNode;
@@ -13,7 +14,7 @@ const StraightLinesBackground = ({
     className,
 }: StraightLinesBackgroundProps) => {
     return (
-        <div className={container}>
+        <BackgroundWrapper>
             <StaticImage
                 alt=""
                 src="../../images/lp-connector/real-time/Vector.png"
@@ -23,7 +24,7 @@ const StraightLinesBackground = ({
                 backgroundColor={backgroundColors.dark}
             />
             <div className={className}>{children}</div>
-        </div>
+        </BackgroundWrapper>
     );
 };
 
diff --git a/src/components/BackgroundImages/WhyPageStepsBackground.tsx b/src/components/BackgroundImages/WhyPageStepsBackground.tsx
index 873d5c74..5037ab7d 100644
--- a/src/components/BackgroundImages/WhyPageStepsBackground.tsx
+++ b/src/components/BackgroundImages/WhyPageStepsBackground.tsx
@@ -1,7 +1,8 @@
 import React from 'react';
 import { GatsbyImage, getImage } from 'gatsby-plugin-image';
 import { graphql, useStaticQuery } from 'gatsby';
-import { container, backgroundImage } from './styles.module.less';
+import { backgroundImage } from './styles.module.less';
+import BackgroundWrapper from './BackgroundWrapper';
 
 interface WhyPageStepsBackgroundProps
     extends React.BaseHTMLAttributes<HTMLDivElement> {
@@ -76,7 +77,7 @@ const WhyPageStepsBackground = ({
             : step6Image;
 
     return (
-        <div className={container}>
+        <BackgroundWrapper>
             {stepsImage ? (
                 <GatsbyImage
                     alt=""
@@ -85,7 +86,7 @@ const WhyPageStepsBackground = ({
                 />
             ) : null}
             <div className={className}>{children}</div>
-        </div>
+        </BackgroundWrapper>
     );
 };
 
diff --git a/src/components/BackgroundImages/styles.module.less b/src/components/BackgroundImages/styles.module.less
index eeb5a0d3..a4dea50e 100644
--- a/src/components/BackgroundImages/styles.module.less
+++ b/src/components/BackgroundImages/styles.module.less
@@ -1,6 +1,6 @@
 @import '../../globalStyles/sections.module.less';
 
-.container {
+.wrapper {
   position: relative;
 }
 

From de806d762ae07b85b8d1de54177c80669dfbae80 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Tue, 15 Oct 2024 13:37:14 -0300
Subject: [PATCH 17/20] Remove unused types

---
 .../DarkSwoopingLinesLeftDirectionBackground.tsx            | 6 +-----
 .../LightSwoopingLinesRightDirectionBackground.tsx          | 6 +-----
 src/components/BackgroundImages/StraightLinesBackground.tsx | 6 +-----
 3 files changed, 3 insertions(+), 15 deletions(-)

diff --git a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
index 5a49c99d..ca75f1e6 100644
--- a/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
+++ b/src/components/BackgroundImages/DarkSwoopingLinesLeftDirectionBackground.tsx
@@ -6,14 +6,10 @@ import { backgroundImage, fullHeight } from './styles.module.less';
 import { backgroundColors } from './shared';
 import BackgroundWrapper from './BackgroundWrapper';
 
-type DarkSwoopingLinesLeftDirectionBackgroundProps = {
-    children?: React.ReactNode;
-} & React.HTMLAttributes<HTMLDivElement>;
-
 const DarkSwoopingLinesLeftDirectionBackground = ({
     children,
     className,
-}: DarkSwoopingLinesLeftDirectionBackgroundProps) => {
+}: React.HTMLAttributes<HTMLDivElement>) => {
     return (
         <BackgroundWrapper>
             <StaticImage
diff --git a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
index aed8fc26..5d322dea 100644
--- a/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
+++ b/src/components/BackgroundImages/LightSwoopingLinesRightDirectionBackground.tsx
@@ -5,14 +5,10 @@ import { backgroundImage, fullHeight } from './styles.module.less';
 import { backgroundColors } from './shared';
 import BackgroundWrapper from './BackgroundWrapper';
 
-type LightSwoopingLinesRightDirectionBackgroundProps = {
-    children?: React.ReactNode;
-} & React.HTMLAttributes<HTMLDivElement>;
-
 const LightSwoopingLinesRightDirectionBackground = ({
     children,
     className,
-}: LightSwoopingLinesRightDirectionBackgroundProps) => {
+}: React.HTMLAttributes<HTMLDivElement>) => {
     return (
         <BackgroundWrapper>
             <StaticImage
diff --git a/src/components/BackgroundImages/StraightLinesBackground.tsx b/src/components/BackgroundImages/StraightLinesBackground.tsx
index fc545a3e..157d3099 100644
--- a/src/components/BackgroundImages/StraightLinesBackground.tsx
+++ b/src/components/BackgroundImages/StraightLinesBackground.tsx
@@ -5,14 +5,10 @@ import { backgroundImage, fullHeight } from './styles.module.less';
 import { backgroundColors } from './shared';
 import BackgroundWrapper from './BackgroundWrapper';
 
-type StraightLinesBackgroundProps = {
-    children?: React.ReactNode;
-} & React.HTMLAttributes<HTMLDivElement>;
-
 const StraightLinesBackground = ({
     children,
     className,
-}: StraightLinesBackgroundProps) => {
+}: React.HTMLAttributes<HTMLDivElement>) => {
     return (
         <BackgroundWrapper>
             <StaticImage

From 72f536c1ce109e50bb8d754747a41094e0483300 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Tue, 15 Oct 2024 13:38:40 -0300
Subject: [PATCH 18/20] Remove unused IntersectionObserver

---
 gatsby-browser.tsx | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/gatsby-browser.tsx b/gatsby-browser.tsx
index c4681f85..5437a9a3 100644
--- a/gatsby-browser.tsx
+++ b/gatsby-browser.tsx
@@ -15,14 +15,6 @@ export const wrapPageElement = ({ element }) => (
     <WrapPageElementComponent>{element}</WrapPageElementComponent>
 );
 
-export const onClientEntry = () => {
-    // IntersectionObserver polyfill for gatsby-background-image (Safari, IE)
-    if (!('IntersectionObserver' in window)) {
-        import('intersection-observer');
-        console.log('# IntersectionObserver is polyfilled!!');
-    }
-};
-
 // Copied from https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-plugin-google-gtag/src/gatsby-browser.js
 export const onRouteUpdate = ({ location, prevLocation }) => {
     if (

From 216c7084d77d655bd02cb932793c729b263fb289 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Tue, 15 Oct 2024 14:59:40 -0300
Subject: [PATCH 19/20] Fix banner border radius

---
 src/templates/connector/RealTime/index.tsx | 44 ++++++++++++----------
 src/templates/connector/RealTime/style.ts  |  7 +++-
 2 files changed, 30 insertions(+), 21 deletions(-)

diff --git a/src/templates/connector/RealTime/index.tsx b/src/templates/connector/RealTime/index.tsx
index f1dac819..4dbcaeb4 100644
--- a/src/templates/connector/RealTime/index.tsx
+++ b/src/templates/connector/RealTime/index.tsx
@@ -4,6 +4,7 @@ import React from 'react';
 import { dashboardRegisterUrl } from '../../../../shared';
 import {
     Button,
+    ContainerWrapper,
     Container,
     ContainerImage,
     Content,
@@ -14,26 +15,29 @@ import {
 const RealTime = () => {
     return (
         <Wrapper>
-            <Container className="background">
-                <Content>
-                    <Title>
-                        Deliver <span>real-time</span> and <span>batch</span>{' '}
-                        data from DBs, SaaS, APIs, and more
-                    </Title>
-                    <Button target="_blank" href={dashboardRegisterUrl}>
-                        Build Free Pipeline
-                    </Button>
-                </Content>
-                <ContainerImage>
-                    <StaticImage
-                        alt="Connection-1"
-                        src="../../../images/lp-connector/real-time/icons.png"
-                        width={520}
-                        height={240}
-                        quality={100}
-                    />
-                </ContainerImage>
-            </Container>
+            <ContainerWrapper>
+                <Container>
+                    <Content>
+                        <Title>
+                            Deliver <span>real-time</span> and{' '}
+                            <span>batch</span> data from DBs, SaaS, APIs, and
+                            more
+                        </Title>
+                        <Button target="_blank" href={dashboardRegisterUrl}>
+                            Build Free Pipeline
+                        </Button>
+                    </Content>
+                    <ContainerImage>
+                        <StaticImage
+                            alt="Connection-1"
+                            src="../../../images/lp-connector/real-time/icons.png"
+                            width={520}
+                            height={240}
+                            quality={100}
+                        />
+                    </ContainerImage>
+                </Container>
+            </ContainerWrapper>
         </Wrapper>
     );
 };
diff --git a/src/templates/connector/RealTime/style.ts b/src/templates/connector/RealTime/style.ts
index f36e1ce7..88afe06e 100644
--- a/src/templates/connector/RealTime/style.ts
+++ b/src/templates/connector/RealTime/style.ts
@@ -14,8 +14,13 @@ export const Wrapper = styled.section`
     }
 `;
 
+export const ContainerWrapper = styled.div`
+    border-radius: 24px;
+    overflow: hidden;
+`;
+
 export const Container = styled(StraightLinesBackground)`
-    padding: 40px 20px;
+    padding: 40px;
     display: flex;
     flex-direction: column-reverse;
     border-radius: 24px;

From 66e4dcbca04d265141b2ddf6e54ea7c7835e0e70 Mon Sep 17 00:00:00 2001
From: Breno <breno@estuary.dev>
Date: Tue, 15 Oct 2024 15:02:22 -0300
Subject: [PATCH 20/20] Remove the gatsby-background-image library

---
 package.json                                  |  1 -
 .../TheAutomation/components/Cards/style.ts   |  4 +-
 yarn.lock                                     | 67 +------------------
 3 files changed, 4 insertions(+), 68 deletions(-)

diff --git a/package.json b/package.json
index 1476681c..02888e38 100644
--- a/package.json
+++ b/package.json
@@ -24,7 +24,6 @@
     "embla-carousel": "^8.2.0",
     "embla-carousel-react": "^8.2.0",
     "gatsby": "^5.13.3",
-    "gatsby-background-image": "^1.6.0",
     "gatsby-image": "^3.11.0",
     "gatsby-omni-font-loader": "^2.0.2",
     "gatsby-plugin-canonical-urls": "^5.13.1",
diff --git a/src/templates/connector/TheAutomation/components/Cards/style.ts b/src/templates/connector/TheAutomation/components/Cards/style.ts
index fc2c024b..908055db 100644
--- a/src/templates/connector/TheAutomation/components/Cards/style.ts
+++ b/src/templates/connector/TheAutomation/components/Cards/style.ts
@@ -1,7 +1,7 @@
-import BackgroundImage from 'gatsby-background-image';
 import styled from 'styled-components';
 
-export const Container = styled(BackgroundImage)`
+// TODO: Add the background image here once we use the "The automation" section again
+export const Container = styled.div`
     display: flex;
     flex-direction: column;
     gap: 250px;
diff --git a/yarn.lock b/yarn.lock
index 02bc3b0b..b9e751fd 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1205,7 +1205,7 @@
   dependencies:
     regenerator-runtime "^0.14.0"
 
-"@babel/runtime@^7.16.5", "@babel/runtime@^7.25.0", "@babel/runtime@^7.25.6":
+"@babel/runtime@^7.25.0", "@babel/runtime@^7.25.6":
   version "7.25.7"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.25.7.tgz#7ffb53c37a8f247c8c4d335e89cdf16a2e0d0fb6"
   integrity sha512-FjoyLe754PMiYsFaN5C94ttGiOmBNYTf6pLr4xXHAT5uctHb092PBszndLDR5XA/jghQvn4n7JMHl7dmTgbm9w==
@@ -4068,11 +4068,6 @@ ansi-styles@^4.0.0, ansi-styles@^4.1.0:
   dependencies:
     color-convert "^2.0.1"
 
-any-base@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/any-base/-/any-base-1.1.0.tgz#ae101a62bc08a597b4c9ab5b7089d456630549fe"
-  integrity sha512-uMgjozySS8adZZYePpaWs8cxB9/kdzmpX6SgJZ+wbz1K5eYk5QMYDVJaZKhxyIHUdnnJkfR7SVgStgH7LkGUyg==
-
 anymatch@~3.1.2:
   version "3.1.3"
   resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.3.tgz#790c58b19ba1720a84205b57c618d5ad8524973e"
@@ -6074,11 +6069,6 @@ dom-serializer@^2.0.0:
     domhandler "^5.0.2"
     entities "^4.2.0"
 
-dom-walk@^0.1.0:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/dom-walk/-/dom-walk-0.1.2.tgz#0c548bef048f4d1f2a97249002236060daa3fd84"
-  integrity sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w==
-
 domelementtype@^2.0.1, domelementtype@^2.2.0, domelementtype@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.3.0.tgz#5c45e8e869952626331d7aab326d01daf65d589d"
@@ -7382,13 +7372,6 @@ fill-range@^7.1.1:
   dependencies:
     to-regex-range "^5.0.1"
 
-filter-invalid-dom-props@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/filter-invalid-dom-props/-/filter-invalid-dom-props-2.1.0.tgz#7690bb72e9213a09e8429c07f3aea21468f43ee5"
-  integrity sha512-M+1dTOodTQwB9Ncin+EwfgksarMCeAW1V2BjPeC5THFSs56rtEX/VF/Mrur9C9A8eyaY+2h25VFAiVr+bkVkwA==
-  dependencies:
-    html-attributes "1.1.0"
-
 filter-obj@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/filter-obj/-/filter-obj-1.1.0.tgz#9b311112bc6c6127a16e016c6c5d7f19e0805c5b"
@@ -7663,17 +7646,6 @@ functions-have-names@^1.2.2, functions-have-names@^1.2.3:
   resolved "https://registry.yarnpkg.com/functions-have-names/-/functions-have-names-1.2.3.tgz#0404fe4ee2ba2f607f0e0ec3c80bae994133b834"
   integrity sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==
 
-gatsby-background-image@^1.6.0:
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/gatsby-background-image/-/gatsby-background-image-1.6.0.tgz#68e735cfb3f1805f9a6dd931dac5e359ece15ca5"
-  integrity sha512-d3HkZnpfU5KHrjt0Z5Mw6ezOY5OFuPfrHIarN7CMhq+CyUnPTxUuFtic0OV7bgi5J6Z/RGVg36FvcnX69xuDgw==
-  dependencies:
-    "@babel/runtime" "^7.16.5"
-    filter-invalid-dom-props "^2.1.0"
-    global "^4.4.0"
-    short-uuid "^4.2.0"
-    sort-media-queries "^0.2.2"
-
 gatsby-cli@^5.13.2:
   version "5.13.2"
   resolved "https://registry.yarnpkg.com/gatsby-cli/-/gatsby-cli-5.13.2.tgz#430361cb68a87e6726305acee8b3abfd80e29733"
@@ -8706,14 +8678,6 @@ global-prefix@^3.0.0:
     kind-of "^6.0.2"
     which "^1.3.1"
 
-global@^4.4.0:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/global/-/global-4.4.0.tgz#3e7b105179006a323ed71aafca3e9c57a5cc6406"
-  integrity sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==
-  dependencies:
-    min-document "^2.19.0"
-    process "^0.11.10"
-
 globals@^11.1.0:
   version "11.12.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
@@ -9257,11 +9221,6 @@ hosted-git-info@^3.0.8:
   dependencies:
     lru-cache "^6.0.0"
 
-html-attributes@1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/html-attributes/-/html-attributes-1.1.0.tgz#82027a4fac7a6070ea6c18cc3886aea18d6dea09"
-  integrity sha512-reT/KK6Ju+DZqAbAn3sIkpMH+658kEsaEjpNrej2O5XSUsH5SzVHX7NGZk5RiZcVi7l+RsV+5q3C6TqM5vxsVA==
-
 html-entities@^2.1.0, html-entities@^2.3.3:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-2.3.3.tgz#117d7626bece327fc8baace8868fa6f5ef856e46"
@@ -11030,13 +10989,6 @@ mimic-response@^4.0.0:
   resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-4.0.0.tgz#35468b19e7c75d10f5165ea25e75a5ceea7cf70f"
   integrity sha512-e5ISH9xMYU0DzrT+jl8q2ze9D6eWBto+I8CNpe+VI+K2J/F/k3PdkdTdz4wvGVH4NTpo+NRYTVIuMQEMMcsLqg==
 
-min-document@^2.19.0:
-  version "2.19.0"
-  resolved "https://registry.yarnpkg.com/min-document/-/min-document-2.19.0.tgz#7bd282e3f5842ed295bb748cdd9f1ffa2c824685"
-  integrity sha512-9Wy1B3m3f66bPPmU5hdA4DR4PB2OfDU/+GS3yAB7IQozE3tqXaVv2zOjgla7MEGSRv95+ILmOuvhLkOK6wJtCQ==
-  dependencies:
-    dom-walk "^0.1.0"
-
 min-indent@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869"
@@ -12541,7 +12493,7 @@ process-nextick-args@~2.0.0:
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
   integrity sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==
 
-process@^0.11.1, process@^0.11.10:
+process@^0.11.1:
   version "0.11.10"
   resolved "https://registry.yarnpkg.com/process/-/process-0.11.10.tgz#7332300e840161bda3e69a1d1d91a7d4bc16f182"
   integrity sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==
@@ -13821,14 +13773,6 @@ shell-quote@^1.7.3:
   resolved "https://registry.yarnpkg.com/shell-quote/-/shell-quote-1.8.0.tgz#20d078d0eaf71d54f43bd2ba14a1b5b9bfa5c8ba"
   integrity sha512-QHsz8GgQIGKlRi24yFc6a6lN69Idnx634w49ay6+jA5yFh7a1UY+4Rp6HPx/L/1zcEDPEij8cIsiqR6bQsE5VQ==
 
-short-uuid@^4.2.0:
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/short-uuid/-/short-uuid-4.2.2.tgz#4bb3d926da04a4a5f34420d17b5551fd6d9d535c"
-  integrity sha512-IE7hDSGV2U/VZoCsjctKX6l5t5ak2jE0+aeGJi3KtvjIUNuZVmHVYUjNBhmo369FIWGDtaieRaO8A83Lvwfpqw==
-  dependencies:
-    any-base "^1.1.0"
-    uuid "^8.3.2"
-
 side-channel@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.4.tgz#efce5c8fdc104ee751b25c58d4290011fa5ea2cf"
@@ -13978,13 +13922,6 @@ socket.io@4.7.1:
     socket.io-adapter "~2.5.2"
     socket.io-parser "~4.2.4"
 
-sort-media-queries@^0.2.2:
-  version "0.2.2"
-  resolved "https://registry.yarnpkg.com/sort-media-queries/-/sort-media-queries-0.2.2.tgz#fddfc1e70d662759091b6a23776f4488683dca1e"
-  integrity sha512-XwBDwDsHhjcfMPfGakCDWuNBSiTeMmIRNNEb1bYlyzvG81hBRTAQTu40Nm8cyP/a+aFUaDxPqfzncmYKtibi+Q==
-  dependencies:
-    xtend "^4.0.0"
-
 source-list-map@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/source-list-map/-/source-list-map-2.0.1.tgz#3993bd873bfc48479cca9ea3a547835c7c154b34"