develop
This commit is contained in:
parent
170720d316
commit
6cc3ec39a4
@ -10,6 +10,7 @@ import { useEffect } from "react";
|
||||
import { actions } from "@/store";
|
||||
// import StarSVG from "../../images/SVG/Star";
|
||||
import { usePreloadImages } from "@/hooks/preload/images";
|
||||
import { DotLottieReact } from "@lottiefiles/dotlottie-react";
|
||||
|
||||
function FindHappiness() {
|
||||
const navigate = useNavigate();
|
||||
@ -50,6 +51,13 @@ function FindHappiness() {
|
||||
</ol>
|
||||
</div>
|
||||
</div> */}
|
||||
<DotLottieReact
|
||||
className={`${styles["lottie-animation"]} ym-hide-content`}
|
||||
// data={animationData}
|
||||
autoplay
|
||||
loop={false}
|
||||
width={1920}
|
||||
/>
|
||||
<img
|
||||
className={styles.image}
|
||||
src={`${compatibilityV2Prefix}/hand-with-lines.png`}
|
||||
@ -59,24 +67,24 @@ function FindHappiness() {
|
||||
{translate("/find-your-happiness.title")}
|
||||
</Title>
|
||||
<div className={styles.advantages}>
|
||||
<ul className={styles.list}>
|
||||
<li>
|
||||
{translate("/find-your-happiness.advantage1")}
|
||||
</li>
|
||||
<li>
|
||||
{translate("/find-your-happiness.advantage2")}
|
||||
</li>
|
||||
<li>
|
||||
{translate("/find-your-happiness.advantage3")}
|
||||
</li>
|
||||
</ul>
|
||||
<ul className={styles.list}>
|
||||
<li>
|
||||
{translate("/find-your-happiness.advantage1")}
|
||||
</li>
|
||||
<li>
|
||||
{translate("/find-your-happiness.advantage2")}
|
||||
</li>
|
||||
<li>
|
||||
{translate("/find-your-happiness.advantage3")}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className={styles["button-container"]}>
|
||||
<Button onClick={() => navigate(`${compatibilityV2Prefix}/gender`)}>
|
||||
{translate("next")}
|
||||
</Button>
|
||||
</div>
|
||||
<p className={styles.description}>
|
||||
<div className={styles["button-container"]}>
|
||||
<Button onClick={() => navigate(`${compatibilityV2Prefix}/gender`)}>
|
||||
{translate("next")}
|
||||
</Button>
|
||||
</div>
|
||||
<p className={styles.description}>
|
||||
{translate("/find-your-happiness.text")}
|
||||
</p>
|
||||
</>
|
||||
|
||||
@ -74,4 +74,10 @@
|
||||
|
||||
.list li {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.lottie-animation {
|
||||
width: 0;
|
||||
height: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
@ -21,8 +21,9 @@ import routes from "@/routes";
|
||||
function HeadOrHeartResult() {
|
||||
const navigate = useNavigate();
|
||||
const { translate } = useTranslations(ELocalesPlacement.CompatibilityV2);
|
||||
const { headOrHeart } = useSelector(selectors.selectCompatibilityV2Answers);
|
||||
const { headOrHeart, relationshipStatus } = useSelector(selectors.selectCompatibilityV2Answers);
|
||||
const { gender, partnerGender, partnerBirthdate } = useSelector(selectors.selectQuestionnaire);
|
||||
const translatePrefix = relationshipStatus === "single" ? "single" : "with-partner";
|
||||
|
||||
// const { animationData } = useLottie({
|
||||
// loadKey: animations[headOrHeart as keyof typeof animations],
|
||||
@ -55,9 +56,9 @@ function HeadOrHeartResult() {
|
||||
</div> */}
|
||||
<Title variant="h1" className={styles.title}>
|
||||
{headOrHeart === "both" &&
|
||||
translate("/both.title", {
|
||||
translate(`/both.${translatePrefix}.title`, {
|
||||
wonderful: (
|
||||
<b style={{ color: "#224e90" }}>{translate("/both.wonderful")}</b>
|
||||
<b style={{ color: "#224e90" }}>{translate(`/both.${translatePrefix}.wonderful`)}</b>
|
||||
),
|
||||
zodiacSign: (
|
||||
<b style={{ color: "#224e90" }}>
|
||||
@ -73,7 +74,7 @@ function HeadOrHeartResult() {
|
||||
partnerGender: translate(partnerGender?.toLowerCase()).toLowerCase()
|
||||
})}
|
||||
{headOrHeart === "head" &&
|
||||
translate("/with-head.title", {
|
||||
translate(`/with-head.${translatePrefix}.title`, {
|
||||
zodiacSign: (
|
||||
<b style={{ color: "#224e90" }}>
|
||||
{translate(`zodiac_signs.${zodiacSign?.toLowerCase()}`)}
|
||||
@ -88,7 +89,7 @@ function HeadOrHeartResult() {
|
||||
partnerGender: translate(partnerGender?.toLowerCase()).toLowerCase()
|
||||
})}
|
||||
{headOrHeart === "heart" &&
|
||||
translate("/with-heart.title", {
|
||||
translate(`/with-heart.${translatePrefix}.title`, {
|
||||
zodiacSign: (
|
||||
<b style={{ color: "#224e90" }}>
|
||||
{translate(`zodiac_signs.${zodiacSign?.toLowerCase()}`)}
|
||||
@ -103,7 +104,7 @@ function HeadOrHeartResult() {
|
||||
partnerGender: translate(partnerGender?.toLowerCase()).toLowerCase()
|
||||
})}
|
||||
{headOrHeart === "depends" &&
|
||||
translate("/depends.title", {
|
||||
translate(`/depends.${translatePrefix}.title`, {
|
||||
zodiacSign: (
|
||||
<b style={{ color: "#224e90" }}>
|
||||
{translate(`zodiac_signs.${zodiacSign?.toLowerCase()}`)}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user