email-marketing-v2

edits

messages/en.json

@@ -512,10 +512,22 @@
             "title": "Your plan also includes:",
             "list": {
               "items": {
-                "1": "Astrological compatibility analysis",
-                "2": "Personal advice on attracting love",
-                "3": "Meditations and affirmations for love",
-                "4": "Bonus checklist: “The Perfect Date”"
+                "1": {
+                  "title": "Чат с экспертом",
+                  "text": "Задай свой вопрос и получи первый совет уже сегодня."
+                },
+                "2": {
+                  "title": "Анализ совместимости",
+                  "text": "Пойми, почему вы притягиваетесь друг к другу - и какие различия могут мешать гармонии."
+                },
+                "3": {
+                  "title": "Как говорить о чувствах и быть понятым",
+                  "text": "Пошаговый гайд, который поможет восстановить близость и искреннее общение."
+                },
+                "4": {
+                  "title": "Медитации и аффирмации для сердца",
+                  "text": "Практики, которые открывают внутреннюю уверенность и притягивают любовь."
+                }
               }
             }
           },
@@ -525,23 +537,23 @@
               "1": {
                 "username": "@anna.smith28",
                 "flag": "🇺🇸",
-                "text": "The description was spot on! I met exactly the kind of man that was described. We've been together for 8 months now! 💕",
+                "text": "The drawing was made before we met, and it matched down to the smallest detail: the same gaze, the same mole. We simply couldn't believe it! Now the portrait hangs in our home as a sign of destiny.",
                 "answer": {
                   "title": "Response from the support team",
-                  "text": "Anna, thank you so much for your review! We are very happy that our portrait helped you find true love. We wish you happiness!"
+                  "text": "Anna, it's just the magic of fate! We are very happy that your portrait has become part of your love story. May it remind you how important it is to believe in the signs of the universe 🌹"
                 }
               },
               "2": {
-                "username": "@dmitry_32",
-                "flag": "🇨🇦",
-                "text": "An incredibly accurate portrait! I met a girl who was exactly as described in the portrait. Thank you for your professional approach! 🙏",
+                "username": "@mike.andrews_89",
+                "flag": "🇺🇸",
+                "text": "I decided to check whether my wife was truly my other half. The portrait matched her down to the last detail—the same gaze, the same energy. We both felt as if fate had just confirmed our union.",
                 "answer": {
                   "title": "Response from the support team",
-                  "text": "Dmitry, thank you for your trust! We are very happy that the portrait met your expectations. We wish you a strong relationship!"
+                  "text": "That's amazing! Stories like this prove that true love really does have an impact on an energetic level. May your portrait preserve the warmth of your connection for many years to come!"
                 }
               },
               "3": {
-                "username": "@elena_art",
+                "username": "@emily.harris_ang...",
                 "flag": "🇬🇧",
                 "text": "The “Finding the One” guide changed my life! The portrait was 100% accurate, and I met my love in a museum, just as predicted! ✨",
                 "answer": {

src/app/[locale]/(email-marketing)/em/(compatibility)/c/v2/landing/page.tsx

@@ -1,4 +1,3 @@
-
 import {
   GuaranteedSecurityPayments,
   Header,

src/components/domains/email-marketing/compatibility/v2/DetailedPortraitCard/DetailedPortraitCard.tsx

@@ -1,18 +1,23 @@
+"use client";
+
 import Image from "next/image";
-import { getTranslations } from "next-intl/server";
+import { useTranslations } from "next-intl";
 
 import { Typography } from "@/components/ui";
+import { useUser } from "@/providers/user-provider";
 import { emailMarketingCompV2Images } from "@/shared/constants/images";
 import { translatePathEmailMarketingCompatibilityV2 } from "@/shared/constants/translate";
 
 import styles from "./DetailedPortraitCard.module.scss";
 
-export default async function DetailedPortraitCard() {
-  const t = await getTranslations(
+export default function DetailedPortraitCard() {
+  const t = useTranslations(
     translatePathEmailMarketingCompatibilityV2(
       "Landing.what-get.detailed-portrait"
     )
   );
+  const { user } = useUser();
+  const gender = user?.profile?.gender;
 
   return (
     <div className={styles.card}>
@@ -51,7 +56,9 @@ export default async function DetailedPortraitCard() {
         </Typography>
       </div>
       <Image
-        src={emailMarketingCompV2Images("gpt-portrait-1.jpg")}
+        src={emailMarketingCompV2Images(
+          gender === "male" ? "gpt-portrait-2.jpg" : "gpt-portrait-1.jpg"
+        )}
         alt="portrait"
         className={styles.portrait}
         width={333}

src/components/domains/email-marketing/compatibility/v2/PlanAlsoIncludes/PlanAlsoIncludes.module.scss

@@ -9,8 +9,7 @@
   }
 
   & > .list {
-    width: 100%;
-    max-width: 295px;
+    width: calc(100% - 48px);
     margin-inline: auto;
     margin-top: 16px;
     display: flex;
@@ -19,17 +18,30 @@
     gap: 8px;
 
     & > .item {
-      position: relative;
-      font-size: 16px;
-      line-height: 24px;
-      color: #374151;
-      padding-left: 37px;
+      display: grid;
+      grid-template-columns: 13px 1fr;
+      gap: 17px;
 
       & > svg {
-        position: absolute;
-        left: 8px;
-        top: 50%;
-        transform: translateY(-50%);
+        margin-top: 12px;
+      }
+
+      & > .textContainer {
+        display: flex;
+        flex-direction: column;
+        & > .title {
+          font-size: 16px;
+          font-weight: 500;
+          line-height: 24px;
+          color: #374151;
+        }
+
+        & > .text {
+          font-size: 14px;
+          font-weight: 400;
+          line-height: 24px;
+          color: #374151;
+        }
       }
     }
   }

src/components/domains/email-marketing/compatibility/v2/PlanAlsoIncludes/PlanAlsoIncludes.tsx

@@ -5,13 +5,18 @@ import { translatePathEmailMarketingCompatibilityV2 } from "@/shared/constants/t
 
 import styles from "./PlanAlsoIncludes.module.scss";
 
+interface IListItem {
+  title: string;
+  text: string;
+}
+
 export default async function PlanAlsoIncludes() {
   const t = await getTranslations(
     translatePathEmailMarketingCompatibilityV2("Landing.plan-also-includes")
   );
 
   const listItems = Object.values(
-    t.raw("list.items") as Record<string, string>
+    t.raw("list.items") as Record<string, IListItem>
   );
 
   return (
@@ -21,12 +26,7 @@ export default async function PlanAlsoIncludes() {
       </Typography>
       <ul className={styles.list}>
         {listItems.map((item, index) => (
-          <Typography
-            key={`item-${index}`}
-            align="left"
-            as="li"
-            className={styles.item}
-          >
+          <li key={`item-${index}`} className={styles.item}>
             <svg
               width="13"
               height="9"
@@ -39,9 +39,15 @@ export default async function PlanAlsoIncludes() {
                 fill="#10B981"
               />
             </svg>
-
-            {item}
-          </Typography>
+            <div className={styles.textContainer}>
+              <Typography align="left" as="p" className={styles.title}>
+                {item.title}
+              </Typography>
+              <Typography align="left" as="p" className={styles.text}>
+                {item.text}
+              </Typography>
+            </div>
+          </li>
         ))}
       </ul>
     </div>

src/components/domains/email-marketing/compatibility/v2/Review/Review.module.scss

@@ -50,7 +50,7 @@
       color: #111827;
 
       & > .flag {
-        font-size: 20px;
+        font-size: 18px;
         line-height: 28px;
         margin-left: 7px;
       }

src/components/domains/email-marketing/compatibility/v2/Reviews/Reviews.tsx

@@ -26,10 +26,10 @@ export default function Reviews() {
       avatar: emailMarketingCompV2Images("anna_smith28.png"),
     },
     {
-      avatar: emailMarketingCompV2Images("dmitry_32.png"),
+      avatar: emailMarketingCompV2Images("mike_andrews_89.png"),
     },
     {
-      avatar: emailMarketingCompV2Images("elena_art.png"),
+      avatar: emailMarketingCompV2Images("emily_harris_ang.png"),
     },
   ];