diff --git a/src/app/intro/intro-client.tsx b/src/app/intro/intro-client.tsx index 2344081..5d44d64 100644 --- a/src/app/intro/intro-client.tsx +++ b/src/app/intro/intro-client.tsx @@ -1,6 +1,5 @@ "use client"; -import Image from "next/image"; import { useRouter } from "next/navigation"; import { useCallback, useEffect, useState } from "react"; import Button from "@/components/Componentes/button"; @@ -10,6 +9,13 @@ import ReportActionsSheet from "@/components/Componentes/report-actions-sheet"; import SectionOverlayHost from "@/components/Componentes/section-overlay-host"; import SliderPage from "@/components/Componentes/slider-page"; import VideoPlayer from "@/components/Componentes/video-player"; +import { + HeavenlyMarriageIllustration, + IntroMatchesIcon, + IntroMarriagesIcon, + IntroPlayButtonIcon, + IntroUsersIcon, +} from "@/components/Componentes/intro-hero-illustration"; import { useMarriageConfigQuery } from "@/hooks/marriage/use-marriage-config"; import { useMarriageProfileQuery } from "@/hooks/marriage/use-profile-main"; import { useHabibWebReady } from "@/hooks/use-habib-web-ready"; @@ -133,12 +139,7 @@ export default function IntroClient() { />
- {t["heavenly +

{t["A Path to Heavenly Marriage"]}

@@ -152,12 +153,7 @@ export default function IntroClient() {
- {t["user +

120

@@ -166,13 +162,7 @@ export default function IntroClient() {

- {t["matches"]} +

14

@@ -181,13 +171,7 @@ export default function IntroClient() {

- {t["marriages"]} +

14

@@ -209,13 +193,7 @@ export default function IntroClient() { priority />

- {t["play"]} +
) { + const uid = useId().replace(/[^a-zA-Z0-9_-]/g, ""); + const patternId = `pattern0_${uid}`; + const radialGradId = `paint0_radial_${uid}`; + const clipId = `clip0_${uid}`; + const imageId = `image0_${uid}`; + + return ( + + ); +} + +export function IntroUsersIcon(props: SVGProps) { + const uid = useId().replace(/[^a-zA-Z0-9_-]/g, ""); + const gradId = `paint0_linear_users_${uid}`; + + return ( + + ); +} + +export function IntroMatchesIcon(props: SVGProps) { + const uid = useId().replace(/[^a-zA-Z0-9_-]/g, ""); + const maskId = `mask0_matches_${uid}`; + const gradId = `paint0_linear_matches_${uid}`; + + return ( + + ); +} + +export function IntroMarriagesIcon(props: SVGProps) { + const uid = useId().replace(/[^a-zA-Z0-9_-]/g, ""); + const gradId = `paint0_linear_marriages_${uid}`; + + return ( + + ); +} + +export function IntroPlayButtonIcon(props: SVGProps) { + const uid = useId().replace(/[^a-zA-Z0-9_-]/g, ""); + const filterId = `filter0_d_${uid}`; + + return ( + + ); +}