From 872fe165115991a539d76aad65c2db465839c277 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=94=D0=B5=D0=BD=D0=B8=D1=81=20=D0=9A=D0=B0=D1=82=D0=B0?=
 =?UTF-8?q?=D0=B5=D0=B2?= <itkataev@gmail.com>
Date: Fri, 31 May 2024 10:06:38 +0000
Subject: [PATCH] new-images-compatibility

---
 .../ABDesign/v1/pages/RelationshipZodiacInfo/index.tsx      | 4 ++--
 .../components/WithPartnerInformation/index.tsx             | 5 +++--
 .../components/WithPartnerInformation/styles.module.css     | 6 ++++--
 3 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/components/pages/ABDesign/v1/pages/RelationshipZodiacInfo/index.tsx b/src/components/pages/ABDesign/v1/pages/RelationshipZodiacInfo/index.tsx
index fd3bf31..11ba9ba 100644
--- a/src/components/pages/ABDesign/v1/pages/RelationshipZodiacInfo/index.tsx
+++ b/src/components/pages/ABDesign/v1/pages/RelationshipZodiacInfo/index.tsx
@@ -61,12 +61,12 @@ function RelationshipZodiacInfoPage() {
       />
       <div className={styles["image-container"]}>
         <img
-          src={`/questionnaire/zodiacs/${gender}/${zodiacSign?.toLowerCase()}.webp`}
+          src={`/questionnaire-redesign/zodiacs/${gender}/pdf.sex.${zodiacSign?.toUpperCase()}.${gender.toUpperCase()}.webp`}
           alt="The zodiac signs"
         />
         <img src="/plus.svg" alt="Plus" />
         <img
-          src={`/questionnaire/zodiacs/${partnerGender}/${partnerZodiacSign?.toLowerCase()}.webp`}
+          src={`/questionnaire-redesign/zodiacs/${partnerGender}/pdf.sex.${partnerZodiacSign?.toUpperCase()}.${partnerGender.toUpperCase()}.webp`}
           alt="The zodiac signs"
         />
       </div>
diff --git a/src/components/pages/ABDesign/v1/pages/TrialPayment/components/WithPartnerInformation/index.tsx b/src/components/pages/ABDesign/v1/pages/TrialPayment/components/WithPartnerInformation/index.tsx
index 0ca186d..3af0731 100644
--- a/src/components/pages/ABDesign/v1/pages/TrialPayment/components/WithPartnerInformation/index.tsx
+++ b/src/components/pages/ABDesign/v1/pages/TrialPayment/components/WithPartnerInformation/index.tsx
@@ -33,14 +33,15 @@ function WithPartnerInformation(props: IWithPartnerInformationProps) {
       <div className={styles["images-container"]}>
         <div className={styles["image-container"]}>
           <img
-            src={`/questionnaire/zodiacs/${gender}/${zodiacSign?.toLowerCase()}.webp`}
+            src={`/questionnaire-redesign/zodiacs/${gender}/pdf.sex.${zodiacSign?.toUpperCase()}.${gender.toUpperCase()}.webp`}
             alt={`${gender} ${zodiacSign}`}
           />
           <p>You</p>
         </div>
+        <img src="/plus.svg" alt="Plus" />
         <div className={styles["image-container"]}>
           <img
-            src={`/questionnaire/zodiacs/${partnerGender}/${partnerZodiacSign?.toLowerCase()}.webp`}
+            src={`/questionnaire-redesign/zodiacs/${partnerGender}/pdf.sex.${partnerZodiacSign?.toUpperCase()}.${partnerGender.toUpperCase()}.webp`}
             alt={`${partnerGender} ${partnerZodiacSign}`}
           />
           <p>Partner</p>
diff --git a/src/components/pages/ABDesign/v1/pages/TrialPayment/components/WithPartnerInformation/styles.module.css b/src/components/pages/ABDesign/v1/pages/TrialPayment/components/WithPartnerInformation/styles.module.css
index 634a673..1d019da 100644
--- a/src/components/pages/ABDesign/v1/pages/TrialPayment/components/WithPartnerInformation/styles.module.css
+++ b/src/components/pages/ABDesign/v1/pages/TrialPayment/components/WithPartnerInformation/styles.module.css
@@ -17,8 +17,10 @@
   min-height: 100px;
   border-top-left-radius: 15px;
   border-top-right-radius: 15px;
-  display: flex;
-  justify-content: space-around;
+  display: grid;
+  grid-template-columns: 1fr min-content 1fr;
+  align-items: center;
+  gap: 4px;
   padding-top: 10px;
   padding-bottom: 6px;
 }