gofnnp/w-aura
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

develop

Browse Source
This commit is contained in:
Daniil Chemerkin 2025-02-10 22:53:30 +00:00
parent 170720d316
commit 6cc3ec39a4
3 changed files with 38 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
src/components/CompatibilityV2/pages/FindHappiness/index.tsx
View File

@ -10,6 +10,7 @@ import { useEffect } from "react";
import { actions } from "@/store"; import { actions } from "@/store";
// import StarSVG from "../../images/SVG/Star"; // import StarSVG from "../../images/SVG/Star";
import { usePreloadImages } from "@/hooks/preload/images"; import { usePreloadImages } from "@/hooks/preload/images";
import { DotLottieReact } from "@lottiefiles/dotlottie-react";
function FindHappiness() { function FindHappiness() {
const navigate = useNavigate(); const navigate = useNavigate();
@ -50,6 +51,13 @@ function FindHappiness() {
</ol> </ol>
</div> </div>
</div> */} </div> */}
<DotLottieReact
className={`${styles["lottie-animation"]} ym-hide-content`}
// data={animationData}
autoplay
loop={false}
width={1920}
/>
<img <img
className={styles.image} className={styles.image}
src={`${compatibilityV2Prefix}/hand-with-lines.png`} src={`${compatibilityV2Prefix}/hand-with-lines.png`}
@ -59,24 +67,24 @@ function FindHappiness() {
{translate("/find-your-happiness.title")} {translate("/find-your-happiness.title")}
</Title> </Title>
<div className={styles.advantages}> <div className={styles.advantages}>
<ul className={styles.list}> <ul className={styles.list}>
<li> <li>
{translate("/find-your-happiness.advantage1")} {translate("/find-your-happiness.advantage1")}
</li> </li>
<li> <li>
{translate("/find-your-happiness.advantage2")} {translate("/find-your-happiness.advantage2")}
</li> </li>
<li> <li>
{translate("/find-your-happiness.advantage3")} {translate("/find-your-happiness.advantage3")}
</li> </li>
</ul> </ul>
</div> </div>
<div className={styles["button-container"]}> <div className={styles["button-container"]}>
<Button onClick={() => navigate(`${compatibilityV2Prefix}/gender`)}> <Button onClick={() => navigate(`${compatibilityV2Prefix}/gender`)}>
{translate("next")} {translate("next")}
</Button> </Button>
</div> </div>
<p className={styles.description}> <p className={styles.description}>
{translate("/find-your-happiness.text")} {translate("/find-your-happiness.text")}
</p> </p>
</> </>

6
src/components/CompatibilityV2/pages/FindHappiness/styles.module.scss
View File

@ -74,4 +74,10 @@
.list li { .list li {
margin-bottom: 8px; margin-bottom: 8px;
}
.lottie-animation {
width: 0;
height: 0;
opacity: 0;
} }

13
src/components/CompatibilityV2/pages/HeadOrHeartResult/index.tsx
View File

@ -21,8 +21,9 @@ import routes from "@/routes";
function HeadOrHeartResult() { function HeadOrHeartResult() {
const navigate = useNavigate(); const navigate = useNavigate();
const { translate } = useTranslations(ELocalesPlacement.CompatibilityV2); const { translate } = useTranslations(ELocalesPlacement.CompatibilityV2);
const { headOrHeart } = useSelector(selectors.selectCompatibilityV2Answers); const { headOrHeart, relationshipStatus } = useSelector(selectors.selectCompatibilityV2Answers);
const { gender, partnerGender, partnerBirthdate } = useSelector(selectors.selectQuestionnaire); const { gender, partnerGender, partnerBirthdate } = useSelector(selectors.selectQuestionnaire);
const translatePrefix = relationshipStatus === "single" ? "single" : "with-partner";
// const { animationData } = useLottie({ // const { animationData } = useLottie({
// loadKey: animations[headOrHeart as keyof typeof animations], // loadKey: animations[headOrHeart as keyof typeof animations],
@ -55,9 +56,9 @@ function HeadOrHeartResult() {
</div> */} </div> */}
<Title variant="h1" className={styles.title}> <Title variant="h1" className={styles.title}>
{headOrHeart === "both" && {headOrHeart === "both" &&
translate("/both.title", { translate(`/both.${translatePrefix}.title`, {
wonderful: ( wonderful: (
<b style={{ color: "#224e90" }}>{translate("/both.wonderful")}</b> <b style={{ color: "#224e90" }}>{translate(`/both.${translatePrefix}.wonderful`)}</b>
), ),
zodiacSign: ( zodiacSign: (
<b style={{ color: "#224e90" }}> <b style={{ color: "#224e90" }}>
@ -73,7 +74,7 @@ function HeadOrHeartResult() {
partnerGender: translate(partnerGender?.toLowerCase()).toLowerCase() partnerGender: translate(partnerGender?.toLowerCase()).toLowerCase()
})} })}
{headOrHeart === "head" && {headOrHeart === "head" &&
translate("/with-head.title", { translate(`/with-head.${translatePrefix}.title`, {
zodiacSign: ( zodiacSign: (
<b style={{ color: "#224e90" }}> <b style={{ color: "#224e90" }}>
{translate(`zodiac_signs.${zodiacSign?.toLowerCase()}`)} {translate(`zodiac_signs.${zodiacSign?.toLowerCase()}`)}
@ -88,7 +89,7 @@ function HeadOrHeartResult() {
partnerGender: translate(partnerGender?.toLowerCase()).toLowerCase() partnerGender: translate(partnerGender?.toLowerCase()).toLowerCase()
})} })}
{headOrHeart === "heart" && {headOrHeart === "heart" &&
translate("/with-heart.title", { translate(`/with-heart.${translatePrefix}.title`, {
zodiacSign: ( zodiacSign: (
<b style={{ color: "#224e90" }}> <b style={{ color: "#224e90" }}>
{translate(`zodiac_signs.${zodiacSign?.toLowerCase()}`)} {translate(`zodiac_signs.${zodiacSign?.toLowerCase()}`)}
@ -103,7 +104,7 @@ function HeadOrHeartResult() {
partnerGender: translate(partnerGender?.toLowerCase()).toLowerCase() partnerGender: translate(partnerGender?.toLowerCase()).toLowerCase()
})} })}
{headOrHeart === "depends" && {headOrHeart === "depends" &&
translate("/depends.title", { translate(`/depends.${translatePrefix}.title`, {
zodiacSign: ( zodiacSign: (
<b style={{ color: "#224e90" }}> <b style={{ color: "#224e90" }}>
{translate(`zodiac_signs.${zodiacSign?.toLowerCase()}`)} {translate(`zodiac_signs.${zodiacSign?.toLowerCase()}`)}