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

Merge branch 'develop' into 'main'

Browse Source 
develop

See merge request witapp/aura-webapp!628
This commit is contained in:
Daniil Chemerkin 2025-02-26 14:24:09 +00:00
commit 8ed49191a0
18 changed files with 261 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
public/locales/compatibility-v2/en/male_en.json
View File

@ -317,12 +317,14 @@
"why_love": "Why does everyone <color> ?",
"why_love_color": "love AURA",
"reviews": {
"username1": "Rebecca Bauman",
"username1": "Emma Johnson",
"tagline1": "\"It’s changed my life!\"",
"text1": "I'm thankful for this app and Akho! She's an excellent palm reader and astrologer—clear, thorough, and reassuring. I eagerly look forward to more sessions with her!",
"username2": "Mika Ryan",
"date1": "Jan 25",
"text1": "I used to keep running into failed relationships—things would start off well, but then everything would fall apart. It was exhausting, and I started wondering if the problem was me. Your service immediately felt different: instead of generic advice and random matches, I got precise insights about who I actually have a real chance of building something strong with. I still remember seeing my first compatibility analysis—it aligned so perfectly that I just knew: this was it. Now, I waste less time on pointless connections and am finally building a relationship that feels effortless and right.",
"username2": "Olivia Smith",
"tagline2": "\"After years of seeking, I’ve finally found a true love.\"",
"text2": "I was hesitant about whether it was really worth trying, but now I have no regrets and I'm enjoying my new relationships!",
"date2": "1m ago",
"text2": "I spent a long time doubting whether we were truly right for each other. Everything seemed fine, but at times, I felt like we were just too different. I searched online for answers, but all I found were vague, contradictory pieces of advice. The feelings were there, but so were the doubts. I just wanted to know if we had a future together, but nothing gave me a clear answer. Then I came across your service, decided to give it a shot—and I’m so glad I did. Your analysis of our personalities, compatibility, and potential challenges in the relationship matched perfectly from the very first pages. And suddenly, it hit me! I finally understood why he acts the way he does and how to build a stronger relationship with him. Your 30-day step-by-step guide is already making a difference—there’s more trust between us, and we argue less. Thank you!",
"username3": "Amanda Holmes",
"tagline3": "\"I’ve found a job I really enjoy.\"",
"text3": "Thanks to Vladana, I've finally discovered a clue about what my life's purpose really is and what kind of job resonates with me better!"
@ -532,8 +534,12 @@
},
"your_access_code": "Your Access Code",
"copy": "COPY",
"instruction_point_1": "1. Download App",
"instruction_point_2": "2. Enter Your Access Code",
"instruction_point_1": "1. Copy Your Access Code",
"instruction_point_2": "2. Download the App",
"instruction_point_3": "3. Enter Your Access Code in the App",
"instruction_point_4": "1. Copy Your Access Code",
"instruction_point_5": "2. Enter Your Access Code in the App 👇",
"your_palm_reading_is_ready": "Your Palm Reading is READY",
"not_share_description": "Enter your access code in the app to access Your Personalized Reading. Do not share your code with anyone.",
"get_prediction_in_app": "Get personal prediction in the App",
"enter-code-title": "Enter Your Access Code:",

17
public/locales/palmistry-v1/en/male_en.json
View File

@ -234,13 +234,16 @@
"reviews": {
"username1": "Rebecca Bauman",
"tagline1": "\"It’s changed my life!\"",
"text1": "I'm thankful for this app and Akho! She's an excellent palm reader and astrologer—clear, thorough, and reassuring. I eagerly look forward to more sessions with her!",
"date1": "Jan 9",
"text1": "For years, I felt lost, questioning every decision and never fully trusting myself. I tried journaling, personality tests, and even meditation, but nothing gave me real answers—it all felt surface-level. Then I got my reading. The moment I saw the details mapped out from the lines on my hands, something shifted. It wasn’t just vague descriptions; it was me—my strengths, my struggles, my patterns, all laid bare. Suddenly, everything made sense. I understood why I kept making the same mistakes and what I truly needed to focus on. For the first time, I feel grounded in my choices, like I’m finally walking a path that belongs to me.",
"username2": "Mika Ryan",
"tagline2": "\"After years of seeking, I’ve finally found a true love.\"",
"text2": "I was hesitant about whether it was really worth trying, but now I have no regrets and I'm enjoying my new relationships!",
"date2": "1m ago",
"text2": "The feeling of being stuck weighed on me, pushing me to bounce between options. My reading was a breakthrough—analyzing the lines on my right hand revealed my strengths and hidden abilities. As I read through it, I saw myself in every word and knew—this was exactly what I had been looking for. Now, I have clarity and confidence, and decisions come easily. Huge thanks to your team of professionals—and for the bonus reading for 2025!",
"username3": "Amanda Holmes",
"tagline3": "\"I’ve found a job I really enjoy.\"",
"text3": "Thanks to Vladana, I've finally discovered a clue about what my life's purpose really is and what kind of job resonates with me better!"
"date3": "1m ago",
"text3": "I'm a deeply sensitive person and have always known I was capable of more, but I had no idea which direction to take. I tried courses, switched jobs, but never felt like I was where I truly belonged. The uncertainty started to weigh on me, filling me with anxiety. Then I came across this app and decided to give it a shot. The analysis of my deep, well-defined Fate Line gave me precise answers about my talents and hidden potential. When I saw how perfectly it aligned with what I genuinely love, a long-awaited sense of clarity washed over me. Now I know where I'm headed—and what destiny has in store for me."
},
"success_story": "Become a AURA Success Story!",
"as_seen_in": "<color> As Seen in",
@ -314,8 +317,12 @@
},
"your_access_code": "Your Access Code",
"copy": "COPY",
"instruction_point_1": "1. Download App",
"instruction_point_2": "2. Enter Your Access Code",
"instruction_point_1": "1. Copy Your Access Code",
"instruction_point_2": "2. Download the App",
"instruction_point_3": "3. Enter Your Access Code in the App",
"instruction_point_4": "1. Copy Your Access Code",
"instruction_point_5": "2. Enter Your Access Code in the App 👇",
"your_palm_reading_is_ready": "Your Palm Reading is READY",
"not_share_description": "Enter your access code in the app to access Your Personalized Reading. Do not share your code with anyone.",
"get_prediction_in_app": "Get personal prediction in the App",
"enter-code-title": "Enter Your Access Code:",

14
src/components/CompatibilityV2/components/Review/index.tsx
View File

@ -3,13 +3,14 @@ import styles from "./styles.module.scss";
export interface IReviewProps {
username: string;
tagline: string;
tagline?: string;
stars?: number;
date?: string;
avatar: string;
text: string;
}
function Review({ username, tagline, stars = 5, avatar, text }: IReviewProps) {
function Review({ username, tagline, stars = 5, date, avatar, text }: IReviewProps) {
return (
<div className={styles.container}>
<div className={styles.header}>
@ -26,9 +27,14 @@ function Review({ username, tagline, stars = 5, avatar, text }: IReviewProps) {
))}
</div>
</div>
{date && <p className={styles.date}>{date}</p>}
</div>
<p className={styles.tagline}>{tagline}</p>
<p className={styles.text}>{text}</p>
{tagline && <p className={styles.tagline}>{tagline}</p>}
<p className={styles.text}
style={{
marginTop: tagline ? "16px" : "4px"
}}
>{text}</p>
</div>
);
}

18
src/components/CompatibilityV2/components/Review/styles.module.scss
View File

@ -6,25 +6,37 @@
}
.header {
position: relative;
margin-left: 8px;
display: flex;
flex-direction: row;
align-items: center;
gap: 6px;
& > .info {
&>.info {
display: flex;
flex-direction: column;
align-items: start;
gap: 2px;
& > .stars {
&>.stars {
display: flex;
flex-direction: row;
align-items: center;
gap: 1px;
}
}
&>.date {
position: absolute;
right: 0;
font-family: SF Pro Text;
font-weight: 500;
font-size: 16px;
line-height: 20px;
text-align: right;
color: rgba(0, 0, 0, 0.45);
}
}
.tagline {
@ -35,4 +47,4 @@
.text {
margin-top: 16px;
line-height: 125%;
}
}

19
src/components/CompatibilityV2/components/Reviews/index.tsx
View File

@ -12,21 +12,24 @@ function Reviews() {
{
avatar: `${compatibilityV2Prefix}/reviews/rebecca.png`,
username: translate("/trial-payment.reviews.username1"),
tagline: translate("/trial-payment.reviews.tagline1"),
// tagline: translate("/trial-payment.reviews.tagline1"),
text: translate("/trial-payment.reviews.text1"),
date: translate("/trial-payment.reviews.date1")
},
{
avatar: `${compatibilityV2Prefix}/reviews/mika.png`,
username: translate("/trial-payment.reviews.username2"),
tagline: translate("/trial-payment.reviews.tagline2"),
// tagline: translate("/trial-payment.reviews.tagline2"),
text: translate("/trial-payment.reviews.text2"),
date: translate("/trial-payment.reviews.date2")
},
{
avatar: `${compatibilityV2Prefix}/reviews/amanda.png`,
username: translate("/trial-payment.reviews.username3"),
tagline: translate("/trial-payment.reviews.tagline3"),
text: translate("/trial-payment.reviews.text3"),
},
// {
// avatar: `${compatibilityV2Prefix}/reviews/amanda.png`,
// username: translate("/trial-payment.reviews.username3"),
// // tagline: translate("/trial-payment.reviews.tagline3"),
// text: translate("/trial-payment.reviews.text3"),
// date: translate("/trial-payment.reviews.date3")
// },
],
[translate]
);

4
src/components/CompatibilityV2/pages/TryApp/components/EnterCode/index.tsx
View File

@ -4,11 +4,11 @@ import { useTranslations } from "@/hooks/translations";
import { ELocalesPlacement } from "@/locales";
import CopyCode from "../CopyCode";
function EnterCode() {
function EnterCode(props: React.HTMLAttributes<HTMLDivElement>) {
const { translate } = useTranslations(ELocalesPlacement.CompatibilityV2);
return (
<div className={styles.container}>
<div className={styles.container} {...props}>
<Title className={styles.title}>
{translate("/try-app.enter-code-title")}
</Title>

4
src/components/CompatibilityV2/pages/TryApp/components/Header/index.tsx
View File

@ -11,10 +11,12 @@ import { copyToClipboard } from "@/services/data";
import Toast from "@/components/pages/ABDesign/v1/components/Toast";
interface IHeaderProps {
classNameContainer?: string;
onButtonClick: () => void;
}
function Header({
classNameContainer = "",
onButtonClick
}: IHeaderProps) {
const { translate } = useTranslations(ELocalesPlacement.CompatibilityV2);
@ -38,7 +40,7 @@ function Header({
}, [isCopied]);
return (
<div className={styles.container}>
<div className={`${styles.container} ${classNameContainer}`}>
<Title variant="h3" className={styles.title}>
{translate("/try-app.header.title")}
</Title>

4
src/components/CompatibilityV2/pages/TryApp/components/Header/styles.module.scss
View File

@ -6,10 +6,12 @@
max-width: 560px;
padding: 0 6px 8px;
background-color: #EFF0FC;
position: sticky;
position: fixed;
top: calc(0dvh);
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.11);
margin-bottom: 46px;
opacity: 0;
transition: opacity 0.15s ease-in-out;
z-index: 9999;
&>* {

77
src/components/CompatibilityV2/pages/TryApp/index.tsx
View File

@ -11,7 +11,7 @@ import Footer from "../../components/Footer";
import { useTranslations } from "@/hooks/translations";
import { ELocalesPlacement } from "@/locales";
import { usePreloadImages } from "@/hooks/preload/images";
import { useEffect } from "react";
import { useEffect, useRef, useState } from "react";
import metricService, { EGoals, EMetrics } from "@/services/metric/metricService";
import Header from "./components/Header";
import PalmPhoto from "./components/PalmPhoto";
@ -19,14 +19,22 @@ import YourAccessCode from "./components/YourAccessCode";
import { images } from "../../data";
import CopyCode from "./components/CopyCode";
import EnterCode from "./components/EnterCode";
import { copyToClipboard } from "@/services/data";
import { useSelector } from "react-redux";
import { selectors } from "@/store";
function TryApp() {
const { translate } = useTranslations(ELocalesPlacement.CompatibilityV2);
usePreloadImages([
"/v1/palmistry/ticket.svg",
])
const code = useSelector(selectors.selectAuthCode);
const downloadApp = () => {
const readingReadyRef = useRef<HTMLDivElement>(null);
const [isHeaderVisible, setIsHeaderVisible] = useState(false);
const downloadApp = async () => {
await copyToClipboard(code);
// TODO
window.location.href =
"https://apps.apple.com/us/app/aura-astrology-horoscope/id1601978549";
@ -37,19 +45,45 @@ function TryApp() {
metricService.reachGoal(EGoals.AURA_TRIAL_PAYMENT_PAGE_VISIT, [EMetrics.KLAVIYO]);
}, []);
useEffect(() => {
const handleScroll = () => {
if (readingReadyRef.current) {
const rect = readingReadyRef.current.getBoundingClientRect();
const distanceFromTop = Math.round(rect.top);
const viewportHeight = window.innerHeight;
if (distanceFromTop < (viewportHeight / 2 - readingReadyRef.current.clientHeight / 2)) {
setIsHeaderVisible(true);
} else {
setIsHeaderVisible(false);
}
}
};
window.addEventListener('scroll', handleScroll);
return () => {
window.removeEventListener('scroll', handleScroll);
};
}, []);
return (
<>
<Header onButtonClick={downloadApp} />
<Header classNameContainer={isHeaderVisible ? styles.headerVisible : ""} onButtonClick={downloadApp} />
<AppNumberOne />
<PalmPhoto />
<Title className={styles["reading-ready"]}>
{translate("/try-app.reading_ready.title")}
</Title>
<div ref={readingReadyRef}>
<Title className={styles["reading-ready"]}>
{translate("/try-app.reading_ready.title")}
</Title>
</div>
<p className={styles.instructionPoint} style={{
marginBottom: "16px"
}}>{translate("/try-app.instruction_point_1")}</p>
<YourAccessCode />
<p className={styles.instructionPoint}>{translate("/try-app.instruction_point_1")}</p>
<img className={styles.downloadApp} src={images("download-app.png")} alt="Download app" onClick={downloadApp} />
<p className={styles.instructionPoint}>{translate("/try-app.instruction_point_2")}</p>
<CopyCode />
<img className={styles.downloadApp} src={images("download-app.png")} alt="Download app" onClick={downloadApp} />
<p className={styles.instructionPoint}>{translate("/try-app.instruction_point_3")}</p>
{/* <CopyCode /> */}
<p className={styles.notShareDescription}>
{translate("/try-app.not_share_description")}
</p>
@ -62,15 +96,34 @@ function TryApp() {
</Title>
<HowWork />
{/* <MoneyBackGuarantee /> */}
<EnterCode />
{/* <EnterCode /> */}
<Title variant="h2" className={styles.title} style={{
fontSize: "26px"
}}>
{translate("/try-app.your_palm_reading_is_ready")}
</Title>
<p className={styles.instructionPoint2}>{translate("/try-app.instruction_point_4")}</p>
<CopyCode variant="black" />
<p className={styles.instructionPoint2} style={{ marginTop: "24px" }}>{translate("/try-app.instruction_point_5")}</p>
<Button className={styles["begin-trial"]} onClick={downloadApp}>
{translate("/try-app.get-my-reading-in-app")}
</Button>
<WhatIncluded />
<PalmsSayAbout />
<EnterCode />
{/* <EnterCode />
<Button className={styles["discover-more"]} onClick={downloadApp}>
{translate("/try-app.get-my-reading-in-app")}
</Button> */}
<Title variant="h2" className={styles.title} style={{
fontSize: "26px"
}}>
{translate("/try-app.your_palm_reading_is_ready")}
</Title>
<p className={styles.instructionPoint2}>{translate("/try-app.instruction_point_4")}</p>
<CopyCode variant="black" />
<p className={styles.instructionPoint2} style={{ marginTop: "24px" }}>{translate("/try-app.instruction_point_5")}</p>
<Button className={styles["begin-trial"]} onClick={downloadApp}>
{translate("/try-app.get-my-reading-in-app")}
</Button>
<Title className={styles["why-love"]}>
{translate("/try-app.why_love", {
@ -78,7 +131,7 @@ function TryApp() {
})}
</Title>
<Reviews />
<EnterCode />
<EnterCode style={{ marginTop: "42px" }} />
<Button className={styles["success-story"]} onClick={downloadApp}>
{translate("/try-app.get-my-reading-in-app")}
</Button>

13
src/components/CompatibilityV2/pages/TryApp/styles.module.scss
View File

@ -209,7 +209,7 @@
box-shadow: 2px 5px 2.5px -1px rgba(0, 0, 0, 0.2);
font-family: SF Pro Text;
font-weight: 500;
font-size: 24px;
font-size: 20px;
line-height: 30px;
text-align: left;
display: flex;
@ -221,4 +221,15 @@
&>img {
width: 38px;
}
}
.headerVisible {
opacity: 1 !important;
}
.instructionPoint2 {
font-weight: 600;
font-size: 22px;
line-height: 26.63px;
text-align: center;
}

14
src/components/PalmistryV1/components/Review/index.tsx
View File

@ -3,13 +3,14 @@ import styles from "./styles.module.scss";
export interface IReviewProps {
username: string;
tagline: string;
tagline?: string;
stars?: number;
date?: string;
avatar: string;
text: string;
}
function Review({ username, tagline, stars = 5, avatar, text }: IReviewProps) {
function Review({ username, tagline, stars = 5, date, avatar, text }: IReviewProps) {
return (
<div className={styles.container}>
<div className={styles.header}>
@ -26,9 +27,14 @@ function Review({ username, tagline, stars = 5, avatar, text }: IReviewProps) {
))}
</div>
</div>
{date && <p className={styles.date}>{date}</p>}
</div>
<p className={styles.tagline}>{tagline}</p>
<p className={styles.text}>{text}</p>
{tagline && <p className={styles.tagline}>{tagline}</p>}
<p className={styles.text}
style={{
marginTop: tagline ? "16px" : "4px"
}}
>{text}</p>
</div>
);
}

18
src/components/PalmistryV1/components/Review/styles.module.scss
View File

@ -6,25 +6,37 @@
}
.header {
position: relative;
margin-left: 8px;
display: flex;
flex-direction: row;
align-items: center;
gap: 6px;
& > .info {
&>.info {
display: flex;
flex-direction: column;
align-items: start;
gap: 2px;
& > .stars {
&>.stars {
display: flex;
flex-direction: row;
align-items: center;
gap: 1px;
}
}
&>.date {
position: absolute;
right: 0;
font-family: SF Pro Text;
font-weight: 500;
font-size: 16px;
line-height: 20px;
text-align: right;
color: rgba(0, 0, 0, 0.45);
}
}
.tagline {
@ -35,4 +47,4 @@
.text {
margin-top: 16px;
line-height: 125%;
}
}

9
src/components/PalmistryV1/components/Reviews/index.tsx
View File

@ -12,20 +12,23 @@ function Reviews() {
{
avatar: `${palmistryV1Prefix}/reviews/rebecca.png`,
username: translate("/trial-payment.reviews.username1"),
tagline: translate("/trial-payment.reviews.tagline1"),
// tagline: translate("/trial-payment.reviews.tagline1"),
text: translate("/trial-payment.reviews.text1"),
date: translate("/trial-payment.reviews.date1")
},
{
avatar: `${palmistryV1Prefix}/reviews/mika.png`,
username: translate("/trial-payment.reviews.username2"),
tagline: translate("/trial-payment.reviews.tagline2"),
// tagline: translate("/trial-payment.reviews.tagline2"),
text: translate("/trial-payment.reviews.text2"),
date: translate("/trial-payment.reviews.date2")
},
{
avatar: `${palmistryV1Prefix}/reviews/amanda.png`,
username: translate("/trial-payment.reviews.username3"),
tagline: translate("/trial-payment.reviews.tagline3"),
// tagline: translate("/trial-payment.reviews.tagline3"),
text: translate("/trial-payment.reviews.text3"),
date: translate("/trial-payment.reviews.date3")
},
],
[translate]

4
src/components/PalmistryV1/pages/TryApp/components/EnterCode/index.tsx
View File

@ -4,11 +4,11 @@ import { useTranslations } from "@/hooks/translations";
import { ELocalesPlacement } from "@/locales";
import CopyCode from "../CopyCode";
function EnterCode() {
function EnterCode(props: React.HTMLAttributes<HTMLDivElement>) {
const { translate } = useTranslations(ELocalesPlacement.PalmistryV1);
return (
<div className={styles.container}>
<div className={styles.container} {...props}>
<Title className={styles.title}>
{translate("/try-app.enter-code-title")}
</Title>

4
src/components/PalmistryV1/pages/TryApp/components/Header/index.tsx
View File

@ -11,10 +11,12 @@ import { copyToClipboard } from "@/services/data";
import Toast from "@/components/pages/ABDesign/v1/components/Toast";
interface IHeaderProps {
classNameContainer?: string;
onButtonClick: () => void;
}
function Header({
classNameContainer = "",
onButtonClick
}: IHeaderProps) {
const { translate } = useTranslations(ELocalesPlacement.PalmistryV1);
@ -38,7 +40,7 @@ function Header({
}, [isCopied]);
return (
<div className={styles.container}>
<div className={`${styles.container} ${classNameContainer}`}>
<Title variant="h3" className={styles.title}>
{translate("/try-app.header.title")}
</Title>

4
src/components/PalmistryV1/pages/TryApp/components/Header/styles.module.scss
View File

@ -6,10 +6,12 @@
max-width: 560px;
padding: 0 6px 8px;
background-color: #EFF0FC;
position: sticky;
position: fixed;
top: calc(0dvh);
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.11);
margin-bottom: 46px;
opacity: 0;
transition: opacity 0.15s ease-in-out;
z-index: 9999;
&>* {

77
src/components/PalmistryV1/pages/TryApp/index.tsx
View File

@ -11,7 +11,7 @@ import Footer from "../../components/Footer";
import { useTranslations } from "@/hooks/translations";
import { ELocalesPlacement } from "@/locales";
import { usePreloadImages } from "@/hooks/preload/images";
import { useEffect } from "react";
import { useEffect, useRef, useState } from "react";
import metricService, { EGoals, EMetrics } from "@/services/metric/metricService";
import Header from "./components/Header";
import PalmPhoto from "./components/PalmPhoto";
@ -19,14 +19,22 @@ import YourAccessCode from "./components/YourAccessCode";
import { images } from "../../data";
import CopyCode from "./components/CopyCode";
import EnterCode from "./components/EnterCode";
import { useSelector } from "react-redux";
import { selectors } from "@/store";
import { copyToClipboard } from "@/services/data";
function TryApp() {
const { translate } = useTranslations(ELocalesPlacement.PalmistryV1);
usePreloadImages([
"/v1/palmistry/ticket.svg",
])
const code = useSelector(selectors.selectAuthCode);
const downloadApp = () => {
const readingReadyRef = useRef<HTMLDivElement>(null);
const [isHeaderVisible, setIsHeaderVisible] = useState(false);
const downloadApp = async () => {
await copyToClipboard(code);
// TODO
window.location.href =
"https://apps.apple.com/us/app/aura-astrology-horoscope/id1601978549";
@ -37,19 +45,45 @@ function TryApp() {
metricService.reachGoal(EGoals.AURA_TRIAL_PAYMENT_PAGE_VISIT, [EMetrics.KLAVIYO]);
}, []);
useEffect(() => {
const handleScroll = () => {
if (readingReadyRef.current) {
const rect = readingReadyRef.current.getBoundingClientRect();
const distanceFromTop = Math.round(rect.top);
const viewportHeight = window.innerHeight;
if (distanceFromTop < (viewportHeight / 2 - readingReadyRef.current.clientHeight / 2)) {
setIsHeaderVisible(true);
} else {
setIsHeaderVisible(false);
}
}
};
window.addEventListener('scroll', handleScroll);
return () => {
window.removeEventListener('scroll', handleScroll);
};
}, []);
return (
<>
<Header onButtonClick={downloadApp} />
<Header classNameContainer={isHeaderVisible ? styles.headerVisible : ""} onButtonClick={downloadApp} />
<AppNumberOne />
<PalmPhoto />
<Title className={styles["reading-ready"]}>
{translate("/try-app.reading_ready.title")}
</Title>
<div ref={readingReadyRef}>
<Title className={styles["reading-ready"]}>
{translate("/try-app.reading_ready.title")}
</Title>
</div>
<p className={styles.instructionPoint} style={{
marginBottom: "16px"
}}>{translate("/try-app.instruction_point_1")}</p>
<YourAccessCode />
<p className={styles.instructionPoint}>{translate("/try-app.instruction_point_1")}</p>
<img className={styles.downloadApp} src={images("download-app.png")} alt="Download app" onClick={downloadApp} />
<p className={styles.instructionPoint}>{translate("/try-app.instruction_point_2")}</p>
<CopyCode />
<img className={styles.downloadApp} src={images("download-app.png")} alt="Download app" onClick={downloadApp} />
<p className={styles.instructionPoint}>{translate("/try-app.instruction_point_3")}</p>
{/* <CopyCode /> */}
<p className={styles.notShareDescription}>
{translate("/try-app.not_share_description")}
</p>
@ -62,15 +96,34 @@ function TryApp() {
</Title>
<HowWork />
{/* <MoneyBackGuarantee /> */}
<EnterCode />
{/* <EnterCode /> */}
<Title variant="h2" className={styles.title} style={{
fontSize: "26px"
}}>
{translate("/try-app.your_palm_reading_is_ready")}
</Title>
<p className={styles.instructionPoint2}>{translate("/try-app.instruction_point_4")}</p>
<CopyCode variant="black" />
<p className={styles.instructionPoint2} style={{ marginTop: "24px" }}>{translate("/try-app.instruction_point_5")}</p>
<Button className={styles["begin-trial"]} onClick={downloadApp}>
{translate("/try-app.get-my-reading-in-app")}
</Button>
<WhatIncluded />
<PalmsSayAbout />
<EnterCode />
{/* <EnterCode />
<Button className={styles["discover-more"]} onClick={downloadApp}>
{translate("/try-app.get-my-reading-in-app")}
</Button> */}
<Title variant="h2" className={styles.title} style={{
fontSize: "26px"
}}>
{translate("/try-app.your_palm_reading_is_ready")}
</Title>
<p className={styles.instructionPoint2}>{translate("/try-app.instruction_point_4")}</p>
<CopyCode variant="black" />
<p className={styles.instructionPoint2} style={{ marginTop: "24px" }}>{translate("/try-app.instruction_point_5")}</p>
<Button className={styles["begin-trial"]} onClick={downloadApp}>
{translate("/try-app.get-my-reading-in-app")}
</Button>
<Title className={styles["why-love"]}>
{translate("/try-app.why_love", {
@ -78,7 +131,7 @@ function TryApp() {
})}
</Title>
<Reviews />
<EnterCode />
<EnterCode style={{ marginTop: "42px" }} />
<Button className={styles["success-story"]} onClick={downloadApp}>
{translate("/try-app.get-my-reading-in-app")}
</Button>

13
src/components/PalmistryV1/pages/TryApp/styles.module.scss
View File

@ -209,7 +209,7 @@
box-shadow: 2px 5px 2.5px -1px rgba(0, 0, 0, 0.2);
font-family: SF Pro Text;
font-weight: 500;
font-size: 24px;
font-size: 20px;
line-height: 30px;
text-align: left;
display: flex;
@ -221,4 +221,15 @@
&>img {
width: 38px;
}
}
.headerVisible {
opacity: 1 !important;
}
.instructionPoint2 {
font-weight: 600;
font-size: 22px;
line-height: 26.63px;
text-align: center;
}