Skip to content

Commit

Permalink
Remove unused code
Browse files Browse the repository at this point in the history
  • Loading branch information
Breno committed Nov 1, 2024
1 parent 2506ae7 commit 3a5cfff
Show file tree
Hide file tree
Showing 2 changed files with 90 additions and 159 deletions.
87 changes: 36 additions & 51 deletions src/components/Integration/SectionOne/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,27 +13,21 @@ import VanityLogosMarquee from '../../VanityLogosMarquee';
import { Connector } from '../shared';
import { LinkOutlined } from '../../../globalStyles';
import { activeUsersAmount, dashboardRegisterUrl } from '../../../../shared';
import Container from '../../Container';
import {
container,
backgroundImageWraper,
bgImage,
bgMiddleImageWrapper,
bgSideImageWrapper,
buttonWrapper,
columnLeft,
columnRight,
contactUsCta,
iconWrapper,
imageWrapper,
mainContent,
metricCardsList,
middleLine,
preTitle,
preTitleWrapper,
secondaryButton,
semiCircleLeftSide,
semiCircleMiddle,
semiCircleRightSide,
title,
} from './styles.module.less';

const metricIconColor = '#FFFFFF';
Expand All @@ -53,8 +47,8 @@ const SectionOne = ({ sourceConnector, destConnector }: SectionOneProps) => {

return (
<section className={defaultWrapperDarkBlue}>
<div className={mainContent}>
<div className={columnLeft}>
<Container className={container}>
<div>
<div className={preTitleWrapper}>
<div className={iconWrapper}>
<StaticImage
Expand All @@ -64,15 +58,13 @@ const SectionOne = ({ sourceConnector, destConnector }: SectionOneProps) => {
loading="eager"
/>
</div>
<span className={preTitle}>
Fastest, Most Reliable CDC and ETL
</span>
<span>FASTEST, MOST RELIABLE CDC AND ETL</span>
</div>
<h2 className={title}>
<h1>
STREAM DATA FROM {sourceConnector.title} TO{' '}
{destConnector.title}
</h2>
<label htmlFor="newsletter-signup" className="label">
</h1>
<label htmlFor="newsletter-signup">
Enter your company e-mail to register
</label>
<NewsletterSignupForm
Expand All @@ -81,52 +73,45 @@ const SectionOne = ({ sourceConnector, destConnector }: SectionOneProps) => {
redirectUrl={dashboardRegisterUrl}
/>
</div>
<div className={columnRight}>
<div>
{sourceConnectorLogo && destinationConnectorLogo ? (
<div className={imageWrapper}>
<div className={backgroundImageWraper}>
<div className={semiCircleLeftSide}>
<div className={bgSideImageWrapper}>
<GatsbyImage
image={sourceConnectorLogo}
alt={`${sourceConnector.title} logo`}
loading="eager"
className={bgImage}
/>
</div>
<div className={backgroundImageWraper}>
<div className={semiCircleLeftSide}>
<div className={bgSideImageWrapper}>
<GatsbyImage
image={sourceConnectorLogo}
alt={`${sourceConnector.title} logo`}
loading="eager"
className={bgImage}
/>
</div>
<div className={semiCircleMiddle}>
<div className={bgMiddleImageWrapper}>
<EstuaryLogo width={46} />
<div className={middleLine} />
</div>
</div>
<div className={semiCircleMiddle}>
<div className={bgMiddleImageWrapper}>
<EstuaryLogo width={46} />
<div className={middleLine} />
</div>
<div className={semiCircleRightSide}>
<div className={bgSideImageWrapper}>
<GatsbyImage
image={destinationConnectorLogo}
alt={`${destConnector.title} logo`}
loading="eager"
className={bgImage}
/>
</div>
</div>
<div className={semiCircleRightSide}>
<div className={bgSideImageWrapper}>
<GatsbyImage
image={destinationConnectorLogo}
alt={`${destConnector.title} logo`}
loading="eager"
className={bgImage}
/>
</div>
</div>
</div>
) : null}
<div className={contactUsCta}>
<span>Schedule an appointment</span>
<div className={buttonWrapper}>
<LinkOutlined
href="/contact-us"
className={secondaryButton}
>
Contact Us
</LinkOutlined>
</div>
<LinkOutlined href="/contact-us" theme="dark">
Contact Us
</LinkOutlined>
</div>
</div>
</div>
</Container>
<ul className={metricCardsList}>
<MetricCard
icon={<OfConnectorsIcon color={metricIconColor} />}
Expand Down
162 changes: 54 additions & 108 deletions src/components/Integration/SectionOne/styles.module.less
View file
Original file line number Diff line number Diff line change
@@ -1,57 +1,69 @@
@import '../../../globalStyles/sections.module.less';

.mainContent {
.globalMaxWidth;

display: flex;
width: 100%;
justify-content: space-between;
gap: 60px;

@media (max-width: 1024px) {
flex-direction: column-reverse;
}
.ctaTitle {
color: #FFFFFFB2;
font-size: 1.25rem;
font-weight: 700;
line-height: 24px;
text-align: center;

@media (max-width: 768px) {
gap: 0;
@media (max-width: 680px) {
font-size: 1rem;
}
}

.columnLeft {
display: flex;
flex-direction: column;
margin: auto 0;
max-width: 620px;
.container {
> :nth-child(1) {
display: flex;
flex-direction: column;
margin: auto 0;
max-width: 620px;

@media (max-width: 1024px) {
max-width: 100%;
}
@media (max-width: 1024px) {
max-width: 100%;
}

&>label {
.ctaTitle;
text-align: left;
margin-bottom: 26px;
label {
.ctaTitle;
text-align: left;
margin-bottom: 26px;
}

span {
font-size: 1.5rem;
line-height: 28.8px;
font-weight: 700;
color: #5072EB;

@media (max-width: 768px) {
font-size: 1.25rem;
line-height: 24px;
}

@media (max-width: 425px) {
font-size: 1rem;
}
}

h1 {
color: #fff;
margin: 28px 0 36px 0;
}
}
}

.columnRight {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 42px;
margin: auto 0;
}
> :nth-child(2) {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 42px;
margin: auto 0;

.ctaTitle {
color: #FFFFFFB2;
font-size: 1.25rem;
font-weight: 700;
line-height: 24px;
text-align: center;
@media (max-width: 768px) {
display: none;
}

@media (max-width: 680px) {
font-size: 1rem;
flex: none;
}
}

Expand All @@ -68,10 +80,6 @@

.contactUsCta {
.cta;

@media (max-width: 768px) {
display: none;
}
}

.preTitleWrapper {
Expand All @@ -98,68 +106,6 @@
}
}

.preTitle {
font-size: 1.5rem;
line-height: 28.8px;
font-weight: 700;
color: #5072EB;
text-transform: uppercase;

@media (max-width: 768px) {
font-size: 1.25rem;
line-height: 24px;
}

@media (max-width: 425px) {
font-size: 1rem;
}
}

.title {
color: #ffffff;
text-transform: uppercase;
margin: 28px 0 36px 0;

@media (max-width: 1024px) {
line-height: 48px;
font-size: 2.5rem;
font-weight: 700;
}
}

.buttonWrapper {
display: flex;
flex-direction: column;
gap: 12px;
width: 100%;

@media (min-width: 426px) {
max-width: 280px;
}
}

.secondaryButton {
background-color: transparent !important;
color: #ffffff !important;
border: 2px solid #5072eb !important;

&:hover {
background-color: #625EFF !important;
}

&:active {
background-color: #5072EB !important;
}
}

.imageWrapper {
margin: auto;

@media (max-width: 768px) {
display: none;
}
}

.connectorLogo {
position: absolute;
max-width: 11%;
Expand Down

0 comments on commit 3a5cfff

Please sign in to comment.