diff --git a/src/components/about/FeatureSection.tsx b/src/components/about/FeatureSection.tsx index 7f9c905021..99a449fff0 100644 --- a/src/components/about/FeatureSection.tsx +++ b/src/components/about/FeatureSection.tsx @@ -5,10 +5,10 @@ import HorizontalScrollableSection from './HorizontalScrollableSection'; const FeatureSection = ({ textContent }) => { return ( -
+
-
-
+
+
-

- {textContent.BetterFutureSection.title} -

-

- {textContent.BetterFutureSection.description} -

+

{textContent.BetterFutureSection.title}

+

{textContent.BetterFutureSection.description}

diff --git a/src/components/about/WhatWeDoSection.tsx b/src/components/about/WhatWeDoSection.tsx index 9520261151..4cfe18026e 100644 --- a/src/components/about/WhatWeDoSection.tsx +++ b/src/components/about/WhatWeDoSection.tsx @@ -5,14 +5,9 @@ import { CaretRight } from '@phosphor-icons/react'; const WhatWeDoSection = ({ textContent }) => { return ( -
+
-

- {textContent.title} -

+

{textContent.title}

@@ -57,19 +52,15 @@ const WhatWeDoSection = ({ textContent }) => { />
-

- {textContent.section1.title} -

+

{textContent.section1.title}

{textContent.section1.description.map((text: string) => { return ( -

- {text} -

+

{text}

); })}
-
+
{ height: 'auto', }} /> -

{textContent.bitSection.title}

+

{textContent.bitSection.title}

@@ -99,13 +90,9 @@ const WhatWeDoSection = ({ textContent }) => { }} />
-

- {textContent.bitSection.title} -

+

{textContent.bitSection.title}

-

- {textContent.bitSection.description} -

+

{textContent.bitSection.description}

window.open( diff --git a/src/components/antivirus/DownloadComponent.tsx b/src/components/antivirus/DownloadComponent.tsx index aa43410a7b..fb2242068e 100644 --- a/src/components/antivirus/DownloadComponent.tsx +++ b/src/components/antivirus/DownloadComponent.tsx @@ -4,7 +4,7 @@ import { ArrowCircleRight } from '@phosphor-icons/react'; const DownloadComponent = ({ textContent, download }) => { return (
-

{textContent.downloadTitle}

+

{textContent.downloadTitle}

{/* Download for desktop */} diff --git a/src/components/antivirus/FeatureSection.tsx b/src/components/antivirus/FeatureSection.tsx index 5fc148548b..45988c278e 100644 --- a/src/components/antivirus/FeatureSection.tsx +++ b/src/components/antivirus/FeatureSection.tsx @@ -38,16 +38,16 @@ const FeatureSection = ({ textContent, isGetAntivirus, showPlan = false }: Featu .map((word, index) => (wordsToBold.includes(word) ? {word} : word)); return ( -
-
+
+
- + {textContent.title}

{textContent.titleLine2}

 -

{formattedDescription}

+

{formattedDescription}

-
+
{`${card.title} -

{card.title}

-

{card.description}

+

{card.title}

+

{card.description}

); diff --git a/src/components/antivirus/FeatureSectionV2.tsx b/src/components/antivirus/FeatureSectionV2.tsx index 9d4fbb61c4..8d5a6456c3 100644 --- a/src/components/antivirus/FeatureSectionV2.tsx +++ b/src/components/antivirus/FeatureSectionV2.tsx @@ -22,17 +22,17 @@ const FeatureSectionV2 = ({ textContent }: FeatureSectionV2Props) => { ]; return ( -
-
+
+
-

{textContent.title}

-

{textContent.description}

+

{textContent.title}

+

{textContent.description}

{cards.map((card, index) => (
{ className="ml-5 text-primary" /> -

- {card.description} -

+

{card.description}

))}
diff --git a/src/components/antivirus/HeroSection.tsx b/src/components/antivirus/HeroSection.tsx index 70e81ab1a1..6facd4f002 100644 --- a/src/components/antivirus/HeroSection.tsx +++ b/src/components/antivirus/HeroSection.tsx @@ -10,21 +10,19 @@ interface HeroSectionProps { } const HeroSection = ({ textContent, download, needsDownloadSection }: HeroSectionProps) => ( -
+
-
-

{textContent.eyeBrow}

+
+

{textContent.eyeBrow}

-

+

{textContent.title}
{textContent.blueText}

-

- {textContent.description} -

+

{textContent.description}

- {!isMobile && } + {!isMobile && ( + + )}
); diff --git a/src/components/antivirus/InfoSecction.tsx b/src/components/antivirus/InfoSecction.tsx index 0887c16af7..86fb4c4d45 100644 --- a/src/components/antivirus/InfoSecction.tsx +++ b/src/components/antivirus/InfoSecction.tsx @@ -6,7 +6,7 @@ export interface InfoSectionProps { export const InfoSection: React.FC = ({ FirstComponent }) => { return ( -
+
{FirstComponent}
); diff --git a/src/components/auth/SignUpInline.tsx b/src/components/auth/SignUpInline.tsx index 8b89751d03..7cec510491 100644 --- a/src/components/auth/SignUpInline.tsx +++ b/src/components/auth/SignUpInline.tsx @@ -15,6 +15,7 @@ interface SignUpInlineProps { } export default function SignUpInline(props: Readonly) { + const darkMode = props.darkMode ?? false; const [passwordState, setPasswordState] = useState< | { tag: 'error' | 'warning' | 'success'; @@ -94,9 +95,7 @@ export default function SignUpInline(props: Readonly) {
@@ -108,11 +107,9 @@ export default function SignUpInline(props: Readonly) { disabled={props.loading} />
- + {props.textContent.disclaimer.text}{' '} - - {props.textContent.disclaimer.link} - + {props.textContent.disclaimer.link} {'.'}
diff --git a/src/components/banners/SignUpBanner.tsx b/src/components/banners/SignUpBanner.tsx index 04a7c3b47b..8859a39746 100644 --- a/src/components/banners/SignUpBanner.tsx +++ b/src/components/banners/SignUpBanner.tsx @@ -3,10 +3,12 @@ import Image from 'next/image'; import { getImage } from '@/lib/getImage'; const SignUpBanner = ({ + darkMode = false, textContent, lang, changeTextOrder, }: { + darkMode?: boolean; textContent: any; lang: string; changeTextOrder?: boolean; @@ -14,11 +16,11 @@ const SignUpBanner = ({ const signUpLang = require(`../../assets/lang/${lang}/home.json`); return ( -
+
-

+

{changeTextOrder ? ( <> {textContent.blueText} @@ -32,7 +34,7 @@ const SignUpBanner = ({

- +
diff --git a/src/components/business/BusinessCtaSection.tsx b/src/components/business/BusinessCtaSection.tsx index 7e5e7ff8f9..2cc2c84a49 100644 --- a/src/components/business/BusinessCtaSection.tsx +++ b/src/components/business/BusinessCtaSection.tsx @@ -7,8 +7,8 @@ const BusinessCtaSection = ({ customText, bgGradientContainerColor, bgGradientColor, - containerDetails, - bgColor, + containerDetails = '', + bgColor = 'dark:bg-gray-95', }: { textContent: any; url?: string; diff --git a/src/components/business/HorizontalScrollableSectionWithImages.tsx b/src/components/business/HorizontalScrollableSectionWithImages.tsx index 72c7b6deef..b148f005ad 100644 --- a/src/components/business/HorizontalScrollableSectionWithImages.tsx +++ b/src/components/business/HorizontalScrollableSectionWithImages.tsx @@ -16,7 +16,7 @@ interface HorizontalScrollableSectionProps { export default function HorizontalScrollableSectionWithImages({ textContent, - bgColor = 'bg-white', + bgColor = 'bg-white dark:bg-gray-95', redirection = false, containerDecoration, cardDecoration = false, @@ -128,16 +128,14 @@ export default function HorizontalScrollableSectionWithImages({ className={`flex h-min w-full items-center justify-center ${bgColor} ${sectionHeight} py-10 lg:py-20`} style={{ background: bgGardient }} > -
-
+
+
-
+
-

{textContent.title}

+

{textContent.title}

-

{textContent.description}

+

{textContent.description}

{redirection && ( -

{title}

+

{title}

-

{cardDescriptions[index]}

+

{cardDescriptions[index]}

diff --git a/src/components/business/InternxtProtectsYourBusiness.tsx b/src/components/business/InternxtProtectsYourBusiness.tsx index 69538196e6..6d255432fe 100644 --- a/src/components/business/InternxtProtectsYourBusiness.tsx +++ b/src/components/business/InternxtProtectsYourBusiness.tsx @@ -2,17 +2,15 @@ interface InternxtProtectsYourBusinessProps { textContent: any; } -export const InternxtProtectsYourBusiness = ({ textContent }: InternxtProtectsYourBusinessProps): JSX.Element => { +export const InternxtProtectsYourBusiness = ({ + textContent, +}: InternxtProtectsYourBusinessProps): JSX.Element => { return ( -
-

- {textContent.title} -

+
+

{textContent.title}

{textContent.description.map((text) => ( -

- {text} -

+

{text}

))}
diff --git a/src/components/business/SecureYourCompany.tsx b/src/components/business/SecureYourCompany.tsx index 9eae4ad3ee..1f53be8c43 100644 --- a/src/components/business/SecureYourCompany.tsx +++ b/src/components/business/SecureYourCompany.tsx @@ -3,26 +3,24 @@ interface SecureYourCompanyProps { } export const SecureYourCompany = ({ textContent }: SecureYourCompanyProps): JSX.Element => ( -
-
+
+
-

{textContent.title}

-

{textContent.description}

+

{textContent.title}

+

{textContent.description}

{textContent.cards.map((card) => (

{card.title}

-

{card.description}

+

{card.description}

))}
-

- {textContent.footerText} -

+

{textContent.footerText}

); diff --git a/src/components/business/TestimonialsSectionForBusiness.tsx b/src/components/business/TestimonialsSectionForBusiness.tsx index 3cbe27a3a2..553543ec06 100644 --- a/src/components/business/TestimonialsSectionForBusiness.tsx +++ b/src/components/business/TestimonialsSectionForBusiness.tsx @@ -8,7 +8,9 @@ interface TestimonialsSectionForBusinessProps { textContent: any; } -export const TestimonialsSectionForBusiness = ({ textContent }: TestimonialsSectionForBusinessProps): JSX.Element => { +export const TestimonialsSectionForBusiness = ({ + textContent, +}: TestimonialsSectionForBusinessProps): JSX.Element => { const [currentIndex, setCurrentIndex] = useState(0); const itemsPerPage = 3; const totalItems = textContent.testimonials.length; @@ -40,18 +42,15 @@ export const TestimonialsSectionForBusiness = ({ textContent }: TestimonialsSect const visibleTestimonialMobile = textContent.testimonials[currentIndex]; return ( -
+
-

{textContent.title}

+

{textContent.title}

@@ -73,7 +72,7 @@ export const TestimonialsSectionForBusiness = ({ textContent }: TestimonialsSect />
-

{testimonial.review}

+

{testimonial.review}

@@ -83,7 +82,7 @@ export const TestimonialsSectionForBusiness = ({ textContent }: TestimonialsSect @@ -91,24 +90,24 @@ export const TestimonialsSectionForBusiness = ({ textContent }: TestimonialsSect
-

{textContent.title}

+

{textContent.title}

-

{visibleTestimonialMobile.review}

-

{visibleTestimonialMobile.imageBrandName}

+

{visibleTestimonialMobile.review}

+

{visibleTestimonialMobile.imageBrandName}

diff --git a/src/components/business/VerticalBusinessCtaSection.tsx b/src/components/business/VerticalBusinessCtaSection.tsx index 7ce480a00c..20cc69f9dd 100644 --- a/src/components/business/VerticalBusinessCtaSection.tsx +++ b/src/components/business/VerticalBusinessCtaSection.tsx @@ -2,8 +2,8 @@ const VerticalBusinessSection = ({ customText, bgGradientContainerColor, bgGradientColor, - containerDetails, - bgColor, + containerDetails = '', + bgColor = 'dark:bg-gray-95', }: { textContent: any; url?: string; diff --git a/src/components/business/WhatCanWeDo.tsx b/src/components/business/WhatCanWeDo.tsx index b8bffd0cb4..bf79bbfcc6 100644 --- a/src/components/business/WhatCanWeDo.tsx +++ b/src/components/business/WhatCanWeDo.tsx @@ -11,6 +11,7 @@ interface WhatCanWeDoProps { } export const WhatCanWeDo = ({ textContent }: WhatCanWeDoProps): JSX.Element => { + const borderClass = 'border-gray-10 dark:border-gray-71'; const [selectedTab, setSelectedTab] = useState(0); const onRightArrowClick = () => { @@ -49,14 +50,12 @@ export const WhatCanWeDo = ({ textContent }: WhatCanWeDoProps): JSX.Element => { {textContent.cards.map((info: any, index: number) => ( -
+
))}
@@ -66,9 +65,7 @@ export const WhatCanWeDo = ({ textContent }: WhatCanWeDoProps): JSX.Element => {

{textContent.cards[selectedTab].selectorTab}

- - {textContent.cards[selectedTab].description} - + {textContent.cards[selectedTab].description}
{
-

- {textContent.cards[selectedTab].selectorTab} -

+

{textContent.cards[selectedTab].selectorTab}

@@ -107,7 +102,7 @@ export const WhatCanWeDo = ({ textContent }: WhatCanWeDoProps): JSX.Element => { diff --git a/src/components/business/WhyChooseInternxt.tsx b/src/components/business/WhyChooseInternxt.tsx index 9e1138f966..e6c56a3a78 100644 --- a/src/components/business/WhyChooseInternxt.tsx +++ b/src/components/business/WhyChooseInternxt.tsx @@ -48,7 +48,7 @@ export const WhyChooseInternxtForBusiness = ({ ]; return ( -
+
{/* Banner */} {withoutBanner ? undefined : ( @@ -90,12 +90,12 @@ export const WhyChooseInternxtForBusiness = ({ )} {/* Title and description */}
-

{textContent.WhyChooseInternxt.title}

-

{textContent.WhyChooseInternxt.description}

+

{textContent.WhyChooseInternxt.title}

+

{textContent.WhyChooseInternxt.description}

{/* Cards */} - +
); diff --git a/src/components/cleaner/FeatureSection.tsx b/src/components/cleaner/FeatureSection.tsx index 3b96acffc8..9f9881b879 100644 --- a/src/components/cleaner/FeatureSection.tsx +++ b/src/components/cleaner/FeatureSection.tsx @@ -2,8 +2,8 @@ import { getImage } from '@/lib/getImage'; import Image from 'next/image'; const FeatureSection = ({ textContent }) => ( -
-

{textContent.title}

+
+

{textContent.title}

( className="absolute bottom-[32px] z-10 h-[155px] w-[205px] rounded-lg object-cover lg:left-[120px] lg:top-7 lg:h-[236px] lg:w-[300px]" /> -

- {textContent.description} -

+

{textContent.description}

); diff --git a/src/components/cleaner/HeroSection.tsx b/src/components/cleaner/HeroSection.tsx index 9342d05146..c892d0d1f1 100644 --- a/src/components/cleaner/HeroSection.tsx +++ b/src/components/cleaner/HeroSection.tsx @@ -8,32 +8,29 @@ import { Check } from '@phosphor-icons/react'; const HeroSection = ({ textContent }) => (
-
+

{textContent.topLabel}

-

{textContent.title}

+

{textContent.title}

{textContent.features.map((feat) => (
-

{feat}

+

{feat}

))}
-

{textContent.subTitle}

+

{textContent.subTitle}

diff --git a/src/components/cleaner/HowItWorksSection.tsx b/src/components/cleaner/HowItWorksSection.tsx index f62889687f..1d520961fb 100644 --- a/src/components/cleaner/HowItWorksSection.tsx +++ b/src/components/cleaner/HowItWorksSection.tsx @@ -3,15 +3,13 @@ import Image from 'next/image'; import AccordionCards from '../shared/AccordionCards'; const HowItWorksSection = ({ textContent }) => ( -
+
-

{textContent.title}

+

{textContent.title}

-

- {textContent.description} -

+

{textContent.description}

diff --git a/src/components/cleaner/WhenToUseSection.tsx b/src/components/cleaner/WhenToUseSection.tsx index 305049f992..4899e0c545 100644 --- a/src/components/cleaner/WhenToUseSection.tsx +++ b/src/components/cleaner/WhenToUseSection.tsx @@ -4,19 +4,12 @@ const WhenToUseSection = ({ textContent }) => { const firstColumn = features.slice(0, midIndex); const secondColumn = features.slice(midIndex); return ( -
+
-

- {textContent.title} -

-

- {textContent.description} -

+

{textContent.title}

+

{textContent.description}

-
+
{firstColumn.map((feature) => (

{feature}

diff --git a/src/components/cloud-storage-backup-solutions/FeaturesSection.tsx b/src/components/cloud-storage-backup-solutions/FeaturesSection.tsx index d2d30558ec..7bfa939ffc 100644 --- a/src/components/cloud-storage-backup-solutions/FeaturesSection.tsx +++ b/src/components/cloud-storage-backup-solutions/FeaturesSection.tsx @@ -4,6 +4,7 @@ import ReactMarkdown from 'react-markdown'; import RevealX from '@/components/components/RevealX'; const FeaturesSection = ({ textContent }) => { + const borderClass = 'border-gray-10 dark:border-gray-71'; const [cardIndex, setCardIndex] = useState(0); const cardInfo = [ @@ -42,12 +43,12 @@ const FeaturesSection = ({ textContent }) => { const DescriptionIcon = cardInfo[cardIndex].icon; return ( -
+
-

{textContent.title}

+

{textContent.title}

-

{textContent.description}

+

{textContent.description}

@@ -56,16 +57,14 @@ const FeaturesSection = ({ textContent }) => { {textContent.info.map((info, index) => ( -
+
))}
@@ -74,10 +73,8 @@ const FeaturesSection = ({ textContent }) => {
-

{cardInfo[cardIndex].title}

- - {cardInfo[cardIndex].description} - +

{cardInfo[cardIndex].title}

+ {cardInfo[cardIndex].description}
@@ -87,12 +84,12 @@ const FeaturesSection = ({ textContent }) => { {cardInfo.map((info) => (
-

{info.title}

- {info.description} +

{info.title}

+ {info.description}
))} diff --git a/src/components/cloud-storage-backup-solutions/HeroSection.tsx b/src/components/cloud-storage-backup-solutions/HeroSection.tsx index be00efe7ba..1efa03c20d 100644 --- a/src/components/cloud-storage-backup-solutions/HeroSection.tsx +++ b/src/components/cloud-storage-backup-solutions/HeroSection.tsx @@ -13,7 +13,7 @@ interface HeroSectionForHomeProps { isHomePageV2?: boolean; } -export default function HeroSection({ textContent, lang, isHomePageV2 }: HeroSectionForHomeProps): JSX.Element { +export default function HeroSection({ textContent, lang, isHomePageV2 }: Readonly): JSX.Element { const router = useRouter(); const { dialogIsOpen } = useGlobalDialog(); const shouldShowMobileBanner = dialogIsOpen(GlobalDialog.MobileBannerForHome); @@ -102,9 +102,7 @@ export default function HeroSection({ textContent, lang, isHomePageV2 }: HeroSec />
-
+
{!shouldShowMobileBanner ? (
(
{driveItems.map((item) => (
diff --git a/src/components/cloud-storage-backup-solutions/components/FileItem.tsx b/src/components/cloud-storage-backup-solutions/components/FileItem.tsx index 707283f88a..fd4d4f67b8 100644 --- a/src/components/cloud-storage-backup-solutions/components/FileItem.tsx +++ b/src/components/cloud-storage-backup-solutions/components/FileItem.tsx @@ -4,7 +4,7 @@ import React from 'react'; const FileItem = ({ encrypted, - className, + className = '', title, ItemImg, }: { @@ -16,7 +16,7 @@ const FileItem = ({ const fileYear = moment().year(); return ( -
+
diff --git a/src/components/cloud-storage-backup-solutions/components/heroSection/BannerForMobile.tsx b/src/components/cloud-storage-backup-solutions/components/heroSection/BannerForMobile.tsx index 8a29f35bd6..1f5f3fde8e 100644 --- a/src/components/cloud-storage-backup-solutions/components/heroSection/BannerForMobile.tsx +++ b/src/components/cloud-storage-backup-solutions/components/heroSection/BannerForMobile.tsx @@ -15,11 +15,9 @@ export const BannerForMobile = () => { return (
-

- {textContent.HeroSection.TitleAndOnePlanV2.title} -

-

- {textContent.HeroSection.TitleAndOnePlanV2.description} +

{textContent.HeroSection.TitleAndOnePlanV2.title}

+

+ {textContent.HeroSection.TitleAndOnePlanV2.description}

-
-

+

{textContent.title.textBeforeBlueText} {textContent.title.blueText} {textContent.title.textAfterBlueText} diff --git a/src/components/cloud-storage-backup-solutions/components/heroSection/TitleAndSurvey.tsx b/src/components/cloud-storage-backup-solutions/components/heroSection/TitleAndSurvey.tsx index 63808cb779..9bd71cbd06 100644 --- a/src/components/cloud-storage-backup-solutions/components/heroSection/TitleAndSurvey.tsx +++ b/src/components/cloud-storage-backup-solutions/components/heroSection/TitleAndSurvey.tsx @@ -18,26 +18,26 @@ const TitleAndSurvey = ({ textContent, redirectUrl }: TitleAndSurveyProps): JSX.
-

+

{textContent.title.line1} {textContent.title.blueText}

-

{textContent.trustedBy}

+

{textContent.trustedBy}

-

+

{textContent.description.normal1} {textContent.description.bold} {textContent.description.normal2}

-
-

{textContent.howMuchYouNeed}

+
+

{textContent.howMuchYouNeed}

-

{textContent.upTo}

-
+

{textContent.upTo}

+
diff --git a/src/components/cloud-storage-for-documents/CoreFeaturesSection.tsx b/src/components/cloud-storage-for-documents/CoreFeaturesSection.tsx index 883e46a319..9434343623 100644 --- a/src/components/cloud-storage-for-documents/CoreFeaturesSection.tsx +++ b/src/components/cloud-storage-for-documents/CoreFeaturesSection.tsx @@ -37,9 +37,9 @@ const CoreFeaturesSection = ({ textContent }: CoreFeaturesSectionProps): JSX.Ele }; return ( -
-

{textContent.title}

-

{textContent.description}

+
+

{textContent.title}

+

{textContent.description}

@@ -70,23 +70,17 @@ const CoreFeaturesSection = ({ textContent }: CoreFeaturesSectionProps): JSX.Ele @@ -166,11 +159,7 @@ const FeatureSection = ({ textContent }: Props): JSX.Element => { diff --git a/src/components/cloud-storage-for-documents/SecureAndManageSection.tsx b/src/components/cloud-storage-for-documents/SecureAndManageSection.tsx index 4d255d4c7e..078481ae44 100644 --- a/src/components/cloud-storage-for-documents/SecureAndManageSection.tsx +++ b/src/components/cloud-storage-for-documents/SecureAndManageSection.tsx @@ -7,35 +7,27 @@ const SecureAndManageSection = ({ textContent }): JSX.Element => { const router = useRouter(); return ( -
-
+
+
-

- {textContent.title} -

+

{textContent.title}

-

- {textContent.description} -

+

{textContent.description}

{textContent.cards.map((card, index) => (
-

- {card.title} -

+

{card.title}

{card.description.map((paragraph) => (

{paragraph}

@@ -75,18 +67,16 @@ const SecureAndManageSection = ({ textContent }): JSX.Element => { {textContent.cards.map((card, index) => (
-

- {card.title} -

+

{card.title}

{card.description.map((paragraph) => (

{paragraph}

diff --git a/src/components/cloud-storage-for-education/AchieveSecurityAndPrivacySection.tsx b/src/components/cloud-storage-for-education/AchieveSecurityAndPrivacySection.tsx index afc0f116e6..5a35ad3c7e 100644 --- a/src/components/cloud-storage-for-education/AchieveSecurityAndPrivacySection.tsx +++ b/src/components/cloud-storage-for-education/AchieveSecurityAndPrivacySection.tsx @@ -3,13 +3,13 @@ import { getImage } from '@/lib/getImage'; const AchieveSecurityAndPrivacySection = ({ textContent }) => { return ( -
+
{/* First section */}
-

{textContent.title}

-

{textContent.subtitle}

-

{textContent.description}

+

{textContent.title}

+

{textContent.subtitle}

+

{textContent.description}

{/* Image */}
@@ -30,7 +30,7 @@ const AchieveSecurityAndPrivacySection = ({ textContent }) => { {textContent.claimOffer.title.blueText} {textContent.claimOffer.title.normalText2}

-

{textContent.claimOffer.description}

+

{textContent.claimOffer.description}

{/* CTA */}
diff --git a/src/components/cloud-storage-for-education/BenefitsOfInternxtSection.tsx b/src/components/cloud-storage-for-education/BenefitsOfInternxtSection.tsx index 63e520da11..303b43429d 100644 --- a/src/components/cloud-storage-for-education/BenefitsOfInternxtSection.tsx +++ b/src/components/cloud-storage-for-education/BenefitsOfInternxtSection.tsx @@ -6,8 +6,8 @@ import { getImage } from '@/lib/getImage'; const CardText = ({ textContent }) => (
-

{textContent.title}

-

{textContent.description}

+

{textContent.title}

+

{textContent.description}

); @@ -35,8 +35,8 @@ const BenefitsOfInternxtSection = ({ textContent }) => { {/* First Section */}
-

{textContent.title}

-

{textContent.subtitle}

+

{textContent.title}

+

{textContent.subtitle}

diff --git a/src/components/cloud-storage-for-education/CtaSection.tsx b/src/components/cloud-storage-for-education/CtaSection.tsx index 1c1fe56171..de053aa5c3 100644 --- a/src/components/cloud-storage-for-education/CtaSection.tsx +++ b/src/components/cloud-storage-for-education/CtaSection.tsx @@ -1,4 +1,10 @@ -const CtaSection = ({ textContent, maxWidth }: { textContent: any; maxWidth?: string }) => { +const CtaSection = ({ + textContent, + maxWidth = '', +}: { + textContent: any; + maxWidth?: string; +}) => { return (
{textContent.description}

-

{textContent.available}

+

{textContent.available}

{/* Logos */} Windows image {
-
+
{textContent.feeds.map((item: { title: string; description: string }) => (
-

{item.title}

-

{item.description}

+

{item.title}

+

{item.description}

))}
-

{textContent.learnMore}

+

{textContent.learnMore}

diff --git a/src/components/drive/CoreFeaturesSection.tsx b/src/components/drive/CoreFeaturesSection.tsx index 84c8931b0b..7a82ebdf69 100644 --- a/src/components/drive/CoreFeaturesSection.tsx +++ b/src/components/drive/CoreFeaturesSection.tsx @@ -90,21 +90,13 @@ const CoreFeaturesSection = ({ return (
{needsDivider && ( -
+
)} -

- {textContent.title} -

-

{textContent.description}

+

{textContent.title}

+

{textContent.description}

@@ -135,24 +127,16 @@ const CoreFeaturesSection = ({ @@ -196,10 +180,8 @@ const CoreFeaturesSection = ({ }} >
-

{title}

-

- {textContent.cards.descriptions[index]} -

+

{title}

+

{textContent.cards.descriptions[index]}

))} @@ -211,9 +193,7 @@ const CoreFeaturesSection = ({
diff --git a/src/components/drive/Drivesection.tsx b/src/components/drive/Drivesection.tsx index eb93ff694f..f97c6f00ec 100644 --- a/src/components/drive/Drivesection.tsx +++ b/src/components/drive/Drivesection.tsx @@ -10,8 +10,8 @@ interface DriveSectionProps { const DriveSection = ({ textContent }: DriveSectionProps): JSX.Element => { return ( -
-

{textContent.title}

+
+

{textContent.title}

@@ -26,10 +26,8 @@ const DriveSection = ({ textContent }: DriveSectionProps): JSX.Element => {
- {textContent.description.map((desc, index) => ( -

- {desc} -

+ {textContent.description.map((desc) => ( +

{desc}

))}
diff --git a/src/components/drive/FeatureSection.tsx b/src/components/drive/FeatureSection.tsx index e5d32f6f68..9f83bb8e53 100644 --- a/src/components/drive/FeatureSection.tsx +++ b/src/components/drive/FeatureSection.tsx @@ -26,8 +26,8 @@ const FeatureSection = ({ textContent }) => { className="flex w-full max-w-[388px] flex-col items-center space-y-6 pt-8 text-center lg:items-start lg:pt-0 lg:text-start" > -

{textContent.title}

-

{textContent.description}

+

{textContent.title}

+

{textContent.description}

-
+
))}
@@ -64,7 +63,7 @@ const FeaturesSection = ({ textContent }) => {
-

{cardInfo[cardIndex].title}

+

{cardInfo[cardIndex].title}

{Array.isArray(cardInfo[cardIndex].description) ? cardInfo[cardIndex].description.map((line, index) => ( @@ -85,20 +84,18 @@ const FeaturesSection = ({ textContent }) => { {cardInfo.map((info) => (

-

{info.title}

+

{info.title}

{/* Render the description as an array of paragraphs */} {Array.isArray(info.description) ? ( - info.description.map((line, index) => ( -

- {line} -

+ info.description.map((line) => ( +

{line}

)) ) : ( -

{info.description}

+

{info.description}

)}
diff --git a/src/components/gdpr-cloud-storage/ImportanceSection.tsx b/src/components/gdpr-cloud-storage/ImportanceSection.tsx index 07ea059fa1..837b1344e0 100644 --- a/src/components/gdpr-cloud-storage/ImportanceSection.tsx +++ b/src/components/gdpr-cloud-storage/ImportanceSection.tsx @@ -5,12 +5,10 @@ import Link from 'next/link'; const ImportanceSection = ({ textContent, ctaLink }) => { return ( -
+
-
+
{ /> -
+

{textContent.title}

{Array.isArray(textContent.description) diff --git a/src/components/gdpr-cloud-storage/components/FileItem.tsx b/src/components/gdpr-cloud-storage/components/FileItem.tsx index 707283f88a..fd4d4f67b8 100644 --- a/src/components/gdpr-cloud-storage/components/FileItem.tsx +++ b/src/components/gdpr-cloud-storage/components/FileItem.tsx @@ -4,7 +4,7 @@ import React from 'react'; const FileItem = ({ encrypted, - className, + className = '', title, ItemImg, }: { @@ -16,7 +16,7 @@ const FileItem = ({ const fileYear = moment().year(); return ( -

+
diff --git a/src/components/gdpr-cloud-storage/components/heroSection/BannerForMobile.tsx b/src/components/gdpr-cloud-storage/components/heroSection/BannerForMobile.tsx index 38eab76f29..b6f77ca148 100644 --- a/src/components/gdpr-cloud-storage/components/heroSection/BannerForMobile.tsx +++ b/src/components/gdpr-cloud-storage/components/heroSection/BannerForMobile.tsx @@ -15,9 +15,7 @@ export const BannerForMobile = () => { return (
-

- {textContent.HeroSection.TitleAndOnePlanV2.title} -

+

{textContent.HeroSection.TitleAndOnePlanV2.title}

-

- {textContent.HeroSection.TitleAndOnePlanV2.guarantee} -

+

{textContent.HeroSection.TitleAndOnePlanV2.guarantee}

-

+

{textContent.title.line1} {textContent.title.blueText}

-

{textContent.trustedBy}

+

{textContent.trustedBy}

-

+

{textContent.description.normal1} {textContent.description.bold} {textContent.description.normal2}

-
-

{textContent.howMuchYouNeed}

+
+

{textContent.howMuchYouNeed}

-

{textContent.upTo}

-
+

{textContent.upTo}

+
diff --git a/src/components/mail/CoreFeaturesSection.tsx b/src/components/mail/CoreFeaturesSection.tsx index a3be2fff39..525a180779 100644 --- a/src/components/mail/CoreFeaturesSection.tsx +++ b/src/components/mail/CoreFeaturesSection.tsx @@ -37,12 +37,12 @@ const CoreFeaturesSection = ({ textContent }: CoreFeaturesSectionProps): JSX.Ele }; return ( -
-

{textContent.title}

+
+

{textContent.title}

{textContent.descriptions.map((description: string) => (

{description}

@@ -64,23 +64,15 @@ const CoreFeaturesSection = ({ textContent }: CoreFeaturesSectionProps): JSX.Ele key={title} type="button" onClick={() => handleAccordionClick(index)} - className={`flex flex-col rounded-16 bg-white text-left transition-all duration-300 ${ - activeIndex === index ? 'gap-6 p-8' : 'gap-0 px-8 py-4' - }`} + className={`flex flex-col rounded-16 bg-white dark:bg-gray-95 text-left transition-all duration-300 ${activeIndex === index ? 'gap-6 p-8' : 'gap-0 px-8 py-4'}`} aria-expanded={activeIndex === index} > {index + 1} -

{title}

+

{title}

 -
-
- {textContent.accordionCards.descriptions[index]} -
+
+
{textContent.accordionCards.descriptions[index]}
))} diff --git a/src/components/mail/HeroSection.tsx b/src/components/mail/HeroSection.tsx index 114be91d9e..0b11f9280c 100644 --- a/src/components/mail/HeroSection.tsx +++ b/src/components/mail/HeroSection.tsx @@ -10,7 +10,7 @@ export const HeroSection = ({ textContent }) => { useEffect(() => { const checkIsMobile = () => { setScale(window.innerWidth < 1024 ? 0.49 : 1); - } + }; checkIsMobile(); @@ -44,26 +44,16 @@ export const HeroSection = ({ textContent }) => { position: { top: `${280*scale}px`, left: `${480*scale}px` }, filter: 'drop-shadow(8px 16px 16px rgba(0,0,0,.1)) opacity(1)', }, - ] + ]; return ( -
-
+
+

{textContent.label}

-

- {textContent.title} -

-

{textContent.description}

+

{textContent.title}

+

{textContent.description}

{
-

- {textContent.garantee} -

+

{textContent.garantee}

diff --git a/src/components/mail/HorizontalScrollableSection.tsx b/src/components/mail/HorizontalScrollableSection.tsx index 4de59e7ce3..4519fb3417 100644 --- a/src/components/mail/HorizontalScrollableSection.tsx +++ b/src/components/mail/HorizontalScrollableSection.tsx @@ -20,6 +20,7 @@ export default function HorizontalScrollableSection({ needsH2 = false, needsH3 = false, }: Readonly): JSX.Element { + const bgClass = 'bg-neutral-17 dark:bg-gray-105'; const scrollContainerRef = useRef(null); const [canScrollLeft, setCanScrollLeft] = useState(false); const [canScrollRight, setCanScrollRight] = useState(true); @@ -107,19 +108,14 @@ export default function HorizontalScrollableSection({ const CardTag = needsH3 ? 'h3' : 'p'; return (
{needsDivider && ( -
+
)} - - {textContent.title} - -

{textContent.description}

+ {textContent.title} +

{textContent.description}

@@ -144,11 +140,9 @@ export default function HorizontalScrollableSection({ height: cardsHeight, }} > -
- {title} -

- {textContent.scrollableSection.descriptions[index]} -

+
+ {title} +

{textContent.scrollableSection.descriptions[index]}

))} @@ -160,9 +154,7 @@ export default function HorizontalScrollableSection({ type="button" onClick={scrollLeft} disabled={!canScrollLeft} - className={`flex h-[48px] w-[48px] cursor-pointer items-center justify-center rounded-full border border-primary bg-transparent transition-all hover:bg-primary/10 ${ - !canScrollLeft ? 'cursor-not-allowed opacity-30' : '' - }`} + className={`flex h-[48px] w-[48px] cursor-pointer items-center justify-center rounded-full border border-primary bg-transparent transition-all hover:bg-primary/10 ${!canScrollLeft ? 'cursor-not-allowed opacity-30' : ''}`} aria-label="Anterior" > @@ -171,9 +163,7 @@ export default function HorizontalScrollableSection({ type="button" onClick={scrollRight} disabled={!canScrollRight} - className={`flex h-[48px] w-[48px] cursor-pointer items-center justify-center rounded-full border border-primary bg-transparent transition-all hover:bg-primary/10 ${ - !canScrollRight ? 'cursor-not-allowed opacity-30' : '' - }`} + className={`flex h-[48px] w-[48px] cursor-pointer items-center justify-center rounded-full border border-primary bg-transparent transition-all hover:bg-primary/10 ${!canScrollRight ? 'cursor-not-allowed opacity-30' : ''}`} aria-label="Siguiente" > diff --git a/src/components/mail/HorizontalSrollableSection.tsx b/src/components/mail/HorizontalSrollableSection.tsx index 265387a566..11d5a3b5af 100644 --- a/src/components/mail/HorizontalSrollableSection.tsx +++ b/src/components/mail/HorizontalSrollableSection.tsx @@ -13,6 +13,7 @@ export default function HorizontalScrollableSectionWithPhotosSection({ textContent, needsDivider = true, }: Readonly): JSX.Element { + const hoverClass = 'hover:bg-white-summer dark:hover:bg-gray-105'; const cardTitles = textContent?.scrollableSection.titles ?? []; const cardDescriptions = textContent?.scrollableSection.descriptions ?? []; const scrollContainerRef = useRef(null); @@ -87,14 +88,11 @@ export default function HorizontalScrollableSectionWithPhotosSection({ const maxIndex = getMaxIndex(); return ( -
+
-

{textContent.title}

-

{textContent.description}

+

{textContent.title}

+

{textContent.description}

@@ -140,8 +138,8 @@ export default function HorizontalScrollableSectionWithPhotosSection({ className="flex rounded-16 lg:hidden" />
-

{title}

-

{cardDescriptions[index]}

+

{title}

+

{cardDescriptions[index]}

))} @@ -153,9 +151,7 @@ export default function HorizontalScrollableSectionWithPhotosSection({ type="button" onClick={scrollLeft} disabled={currentIndex === 0} - className={`flex h-[48px] w-[48px] items-center justify-center rounded-100 border border-primary bg-white transition-opacity ${ - currentIndex === 0 ? 'cursor-not-allowed opacity-50' : 'cursor-pointer hover:bg-white-summer' - }`} + className={`flex h-[48px] w-[48px] items-center justify-center rounded-100 border border-primary bg-white dark:bg-gray-95 transition-opacity ${currentIndex === 0 ? 'cursor-not-allowed opacity-50' : `cursor-pointer ${hoverClass}`}`} > @@ -163,9 +159,7 @@ export default function HorizontalScrollableSectionWithPhotosSection({ type="button" onClick={scrollRight} disabled={currentIndex === maxIndex} - className={`flex h-[48px] w-[48px] items-center justify-center rounded-100 border border-primary bg-white transition-opacity ${ - currentIndex === maxIndex ? 'cursor-not-allowed opacity-50' : 'cursor-pointer hover:bg-white-summer' - }`} + className={`flex h-[48px] w-[48px] items-center justify-center rounded-100 border border-primary bg-white dark:bg-gray-95 transition-opacity ${currentIndex === maxIndex ? 'cursor-not-allowed opacity-50' : `cursor-pointer ${hoverClass}`}`} > @@ -174,7 +168,7 @@ export default function HorizontalScrollableSectionWithPhotosSection({
{needsDivider && (
-
+
)}
diff --git a/src/components/mail/MailSection.tsx b/src/components/mail/MailSection.tsx index a4b42d97d6..fed4856b83 100644 --- a/src/components/mail/MailSection.tsx +++ b/src/components/mail/MailSection.tsx @@ -10,8 +10,8 @@ interface MailSectionProps { const MailSection = ({ textContent }: MailSectionProps): JSX.Element => { return ( -
-

{textContent.title}

+
+

{textContent.title}

@@ -27,9 +27,7 @@ const MailSection = ({ textContent }: MailSectionProps): JSX.Element => {
{textContent.description.map((desc) => ( -

- {desc} -

+

{desc}

))}
diff --git a/src/components/meet/AccordionSection.tsx b/src/components/meet/AccordionSection.tsx index caed267794..5300744560 100644 --- a/src/components/meet/AccordionSection.tsx +++ b/src/components/meet/AccordionSection.tsx @@ -7,7 +7,9 @@ interface AccordionSectionProps { textContent: any; } -export default function AccordionSectionSection({ textContent }: AccordionSectionProps): JSX.Element { +export default function AccordionSectionSection({ + textContent, +}: Readonly): JSX.Element { const [openIndex, setOpenIndex] = useState(0); const cardTitles = textContent?.accordionSection.titles ?? []; @@ -23,37 +25,29 @@ export default function AccordionSectionSection({ textContent }: AccordionSectio const currentImageAlt = openIndex !== null ? `${cardTitles[openIndex]} - Imagen ilustrativa` : 'Imagen por defecto'; return ( -
+
-

{textContent.title}

-

- {textContent.description} -

+

{textContent.title}

+

{textContent.description}

{cardTitles.map((title, index) => ( -
+
-
+
-

{cardDescriptions[index]}

+

{cardDescriptions[index]}

diff --git a/src/components/meet/HeroSection.tsx b/src/components/meet/HeroSection.tsx index eff4fa8ab0..be8747f410 100644 --- a/src/components/meet/HeroSection.tsx +++ b/src/components/meet/HeroSection.tsx @@ -6,29 +6,21 @@ import { HighlightText } from '../components/HighlightText'; const HeroSection = ({ textContent }) => (
-
+

{textContent.label}

-

+

-

{textContent.description}

+

{textContent.description}

(null); @@ -85,17 +86,14 @@ export default function HorizontalScrollableSectionWithPhotosSection({ const maxIndex = getMaxIndex(); return ( -
-
+
+
-

{textContent.title}

+

{textContent.title}

{textContent.subtitle && ( -

{textContent.subtitle}

+

{textContent.subtitle}

)} -

{textContent.description}

+

{textContent.description}

@@ -136,8 +134,8 @@ export default function HorizontalScrollableSectionWithPhotosSection({ className="flex rounded-16 lg:hidden" />
-

{title}

-

{cardDescriptions[index]}

+

{title}

+

{cardDescriptions[index]}

))} @@ -148,18 +146,14 @@ export default function HorizontalScrollableSectionWithPhotosSection({ diff --git a/src/components/nas/HeroSection.tsx b/src/components/nas/HeroSection.tsx index e8ea51be30..47189e39e9 100644 --- a/src/components/nas/HeroSection.tsx +++ b/src/components/nas/HeroSection.tsx @@ -6,26 +6,21 @@ import { Check } from '@phosphor-icons/react'; import { HighlightText } from '../components/HighlightText'; const HeroSection = ({ textContent, url = '#billingButtons' }) => ( -
-
+
+

{textContent.label}

-

+

-

{textContent.subtitle}

+

{textContent.subtitle}

{textContent.features.map((feat) => (
-

{feat}

+

{feat}

))}
diff --git a/src/components/nas/SynologyQNAPSection.tsx b/src/components/nas/SynologyQNAPSection.tsx index 2d499e4757..17b69d1f6b 100644 --- a/src/components/nas/SynologyQNAPSection.tsx +++ b/src/components/nas/SynologyQNAPSection.tsx @@ -3,10 +3,12 @@ import { getImage } from '@/lib/getImage'; import Image from 'next/image'; interface SynologyQNAPSectionProps { + darkMode?: boolean; textContent: NASPageText['InternxtNASIntegrations']; } interface NASBoxProps { + darkMode?: boolean; title: string; description: string; image: string; @@ -19,12 +21,22 @@ interface NASBoxProps { import { LinkTo } from '../drive/components/LinkTo'; -function NASBox({ title, description, image, alt, imageWidth, imageHeight, link, cta }: Readonly) { +function NASBox({ + + title, + description, + image, + alt, + imageWidth, + imageHeight, + link, + cta, +}: Readonly) { return ( -
+
-

{title}

-

{description}

+

{title}

+

{description}

): JSX.Element { +export default function SynologyQNAPSection({ + darkMode = false, + textContent, +}: Readonly): JSX.Element { return ( -
-
+
+
-

{textContent.title}

-

{textContent.description}

+

{textContent.title}

+

{textContent.description}

@@ -65,6 +77,7 @@ export default function SynologyQNAPSection({ textContent }: Readonly
diff --git a/src/components/partnersTemplate/HeroSection.tsx b/src/components/partnersTemplate/HeroSection.tsx index f34c9f94ed..d7ec06363e 100644 --- a/src/components/partnersTemplate/HeroSection.tsx +++ b/src/components/partnersTemplate/HeroSection.tsx @@ -14,6 +14,14 @@ import Link from 'next/link'; import { currencyService } from '@/services/currency.service'; import { useEffect, useState } from 'react'; import { HighlightText } from '../components/HighlightText'; +import { DARK_MODE_LOGO_FILTER } from '@/theme.config'; + +const VALENTINES_GRADIENT_DARK = 'bg-[linear-gradient(180deg,#2A1420_0%,#1C1C1C_100.01%)]'; +const VALENTINES_GRADIENT_LIGHT = + 'bg-[linear-gradient(180deg,#FFF2F8_0%,#FFFFFF_100.01%)] dark:bg-[linear-gradient(180deg,#2A1420_0%,#1C1C1C_100.01%)]'; +const HERO_GRADIENT_DARK = 'bg-[linear-gradient(180deg,#082D66_0%,#1C1C1C_100%)]'; +const HERO_GRADIENT_LIGHT = + 'bg-[linear-gradient(180deg,#E5EFFF_0%,#FFFFFF_100%)] dark:bg-[linear-gradient(180deg,#082D66_0%,#1C1C1C_100%)]'; interface HeroSectionForPartnerProps { textContent: any; @@ -86,17 +94,12 @@ export default function HeroSection({ }; const heroImage = heroImageMap[image] ?? image; + const valentinesGradient = darkMode ? VALENTINES_GRADIENT_DARK : VALENTINES_GRADIENT_LIGHT; + const heroGradient = darkMode ? HERO_GRADIENT_DARK : HERO_GRADIENT_LIGHT; return (
{cloudWards && ( @@ -106,12 +109,13 @@ export default function HeroSection({ width={117} height={27} alt="Brave logo" + className={DARK_MODE_LOGO_FILTER} /> Internxt logo Internxt logo Internxt logo - Privacy Tutor logo + Privacy Tutor logo Internxt logo - WPC drive coupon logo + WPC drive coupon logo Internxt logo - BP drive coupon logo + BP drive coupon logo Internxt logo (

{feature.text}

@@ -229,7 +214,7 @@ export default function HeroSection({ ))}

{isValentinesMode ? ( @@ -241,17 +226,13 @@ export default function HeroSection({
{percentOff !== '0' && !isUltimatePlan && ( {parsePercentText(textContent.subtitle)} )}

{parsePercentText(textContent.description)}

@@ -270,9 +251,7 @@ export default function HeroSection({

-