leadstocompany/rudarksh-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial Changes

Browse Source
This commit is contained in:
Aritra Ghorai
2025-03-01 15:29:32 +05:30
parent 12caeee710
commit e4d8b2cf58
20 changed files with 330 additions and 175 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
components/premium-rudraksha/PremiumBanner.jsx
View File

@@ -4,7 +4,15 @@ import { ChevronRight, Gem } from "lucide-react";
import authAxios from "@/utils/axios";
import Image from "next/image";
const PremiumBanner = () => {
const PremiumBanner = ({ data }) => {
const {
header1,
description1,
header_quote1,
header_quote2,
header_quote3,
header_quote4,
} = data || {};
const [formData, setFormData] = useState({
first_name: "",
last_name: "",
@@ -118,31 +126,33 @@ const PremiumBanner = () => {
{/* Right: Benefits & App Download */}
<div className="p-14 flex flex-col justify-center">
<h2 className="text-4xl font-serif text-[#AC8C6B] text-center">
Why Choose Our Consultation?
{header1 ?? "Why Choose Our Consultation?"}
</h2>
<p className="text-center text-gray-600 text-sm mt-2">
Gain expert insights and personalized guidance.
{description1 ??
"Gain expert insights and personalized guidance."}
</p>
<ul className="mt-6 space-y-4 text-gray-700 text-lg">
<li className="flex items-center">
<ChevronRight className="text-[#AC8C6B] mr-2" />
Expert guidance from experienced professionals
{header_quote1 ??
"Expert guidance from experienced professionals"}
</li>
<li className="flex items-center">
<ChevronRight className="text-[#AC8C6B] mr-2" />
Tailored advice for your specific needs
{header_quote2 ?? "Tailored advice for your specific needs"}
</li>
<li className="flex items-center">
<ChevronRight className="text-[#AC8C6B] mr-2" />
Unlock clarity and direction in life
{header_quote3 ?? "Unlock clarity and direction in life"}
</li>
<li className="flex items-center">
<ChevronRight className="text-[#AC8C6B] mr-2" />
Free initial text-based consultation
{header_quote3 ?? "Free initial text-based consultation"}
</li>
</ul>
</div>
</div>
</div>
</div>
</div>

48
components/premium-rudraksha/PremiumBannerLast.jsx
View File

@@ -3,48 +3,10 @@ import React, { useState } from "react";
import { ChevronRight } from "lucide-react";
import Image from "next/image";
const PremiumBannerLast = () => {
const PremiumBannerLast = ({ data, services }) => {
const { header5 } = data || {};
const [selectedService, setSelectedService] = useState(0);
const services = [
{
title: "Expert Guidance",
description:
"Consultation provides access to expert advice and guidance from professionals who have in-depth knowledge and experience in their respective fields. We can offer valuable insights, strategies, and solutions tailored to your specific needs.",
imageUrl: ["/expert_guidance_1.jpg", "/expert_guidance_2.jpg"],
},
{
title: "Mantras For You",
description:
"Rudraksha experts can recommend specific mantras that align with your spiritual goals and intentions. Mantras are considered powerful tools for spiritual growth, and the right mantra can enhance the effectiveness of your Rudraksha.",
imageUrl: ["/mantra_1.jpg", "/mantra_2.jpg"],
},
{
title: "Your Birth Chart",
description:
"Rudraksha experts may also have knowledge of Vedic astrology. By analyzing your birth chart, they can provide insights into the planetary influences on your life and suggest Rudraksha combinations that may help balance and harmonize these influences.",
imageUrl: ["/birth_chart_1.jpg", "/birth_chart2.jpg"],
},
{
title: "Your Family Birth Chart",
description:
"Understanding the birth charts of family members can offer a holistic view of the energy dynamics within the family. Rudraksha experts can provide guidance on selecting Rudraksha beads that complement the energy of the entire family, fostering a harmonious environment.",
imageUrl: ["/family_chart1.jpg", "/family_chart_2.jpg"],
},
{
title: "Pooja Service Recommendation",
description:
"Rudraksha experts may recommend specific pooja services or rituals based on your spiritual needs and challenges. These rituals can be tailored to address specific concerns and promote positive energy flow in your life.",
imageUrl: ["/pooja_1.jpg", "/pooja_2.jpg"],
},
{
title: "Client Confidentiality",
description:
"Rudraksha experts, like other spiritual and holistic practitioners, typically uphold a strong code of client confidentiality. This ensures that personal and sensitive information shared during consultations is kept private and secure.",
imageUrl: ["/confidentiality_1.jpg", "/client_confidentiality_2.jpg"],
},
];
const handleServiceClick = (index) => {
setSelectedService(index);
};
@@ -52,7 +14,7 @@ const PremiumBannerLast = () => {
return (
<div className="min-h-screen bg-slate-50 p-4">
<h1 className="sm:text-5xl sm:mt-24 text-2xl font-serif text-center tracking-wide mb-12">
Perks of Consulting an Expert
{header5 ?? "Perks of Consulting an Expert"}
</h1>
<div className="grid sm:grid-cols-3 gap-8">
<div className="flex flex-col gap-4 sm:pl-10">
@@ -97,8 +59,8 @@ const PremiumBannerLast = () => {
key={index}
src={url}
alt={`${services[selectedService].title} - ${index + 1}`}
width={230}
height={350}
width={230}
height={350}
className="sm:w-[230px] sm:h-[350px] w-[130px] h-[250px] object-cover"
/>
))}

35
components/premium-rudraksha/PremiumBannerOne.jsx
View File

@@ -1,21 +1,36 @@
'use client'
"use client";
import { FaArrowRightLong } from "react-icons/fa6";
import { FaWhatsapp } from "react-icons/fa";
import { useRouter } from "next/navigation";
const PremiumBannerOne = () => {
const router = useRouter()
const PremiumBannerOne = ({ data }) => {
const { header2, description2 } = data ?? {};
const router = useRouter();
return (
<div className="h-[65vh] bg-[url('/consultation_banner_1.webp')] ">
<div className="flex flex-col justify-start sm:w-3/4 p-4 sm:pl-52 sm:pt-28 ">
<h1 className="sm:text-5xl text-3xl sm:text-left text-center mb-5 tracking-wider sm:w-3/4 font-serif">Personalized Rudraksha Consultation for Your Sacred Journey</h1>
<h3 className="sm:text-xl sm:text-left text-center text-zinc-800 sm:w-3/4">Whether you seek clarity on selecting the right Rudraksha for your spiritual goals or a deeper understanding of the sacred beads, our consultations are crafted to provide you with the wisdom and direction you seek .</h3>
<div className="mt-6 flex gap-6 ">
<button onClick={()=> router.push('/products/premium-rudraksha-consultation-astrology')} className="bg-[#b68d40] sm:py-2 p-2 sm:px-5 font-bold text-white sm:text-xl justify-center sm:whitespace-nowrap flex items-center sm:gap-3">Book a consultation <FaArrowRightLong className="sm:my-3" size={26}/></button>
</div>
<h1 className="sm:text-5xl text-3xl sm:text-left text-center mb-5 tracking-wider sm:w-3/4 font-serif">
{header2 ??
"Personalized Rudraksha Consultation for Your Sacred Journey"}
</h1>
<h3 className="sm:text-xl sm:text-left text-center text-zinc-800 sm:w-3/4">
{description2 ??
"Whether you seek clarity on selecting the right Rudraksha for your spiritual goals or a deeper understanding of the sacred beads, our consultations are crafted to provide you with the wisdom and direction you seek ."}
</h3>
{/* <div className="mt-6 flex gap-6 ">
<button
onClick={() =>
router.push("/products/premium-rudraksha-consultation-astrology")
}
className="bg-[#b68d40] sm:py-2 p-2 sm:px-5 font-bold text-white sm:text-xl justify-center sm:whitespace-nowrap flex items-center sm:gap-3"
>
Book a consultation{" "}
<FaArrowRightLong className="sm:my-3" size={26} />
</button>
</div> */}
</div>
</div>
)
}
);
};
export default PremiumBannerOne;

7
components/premium-rudraksha/PremiumBannerTwo.jsx
View File

@@ -1,16 +1,17 @@
import React from "react";
const PremiumBannerTwo = () => {
const PremiumBannerTwo = ({ data }) => {
const { header3, video_link1 } = data || {};
return (
<div className="min-h-[60vh] mx-auto">
<h2 className="text-center sm:text-5xl mt-3 text-3xl font-serif sm:mt-16 tracking-wider mb-11">
Three Generations of Expertise
{header3 ?? "Three Generations of Expertise"}
</h2>
<iframe
width="800"
className="mx-auto sm:h-[350px] h-[160px] mb-5 w-[300px] sm:w-[600px]"
height="450"
src="https://www.youtube.com/embed/_drMO01Mjtc"
src={`${video_link1 ?? "https://www.youtube.com/embed/_drMO01Mjtc"}`}
title="Everything you need to know about Rudraksh | Keerthi History with Sukritya from Gupta Rudraksha"
frameBorder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"

45
components/premium-rudraksha/PremuimBannerThree.jsx
View File

@@ -1,26 +1,35 @@
import { categoriesForPremiumThree } from '@/utils'
import React from 'react'
import React from "react";
const PremuimBannerThree = () => {
const PremuimBannerThree = ({ data, categoriesForPremiumThree }) => {
const { header4 } = data || {};
return (
<div className='min-h-[75vh]'>
<h2 className="text-center sm:text-5xl mt-3 font-[500] text-zinc-800 text-3xl font-serif sm:pt-20 pt-7 tracking-wide mb-11">
Who Should Book A Consultation?
<div className="min-h-[75vh]">
<h2 className="text-center sm:text-5xl mt-3 font-[500] text-zinc-800 text-3xl font-serif sm:pt-20 pt-7 tracking-wide mb-11">
{header4 ?? "Who Should Book A Consultation?"}
</h2>
<div className="container mx-auto px-4">
<div className="grid grid-cols-2 md:grid-cols-4 gap-6">
{categoriesForPremiumThree.map((category, index) => (
<div key={index} className=" p-4 flex flex-col items-center text-center ">
<h2 className=' rounded-full h-20 w-20 bg-gradient-to-b from-[#E7DBC8] to-pink-50 flex items-center justify-center'>{category.logo}</h2>
<h3 className=" sm:text-lg text-sm font-semibold">{category.title}</h3>
<p className="mt-2 text-xs sm:text-[0.96rem] text-gray-600">{category.description}</p>
</div>
))}
<div className="grid grid-cols-2 md:grid-cols-4 gap-6">
{categoriesForPremiumThree.map((category, index) => (
<div
key={index}
className=" p-4 flex flex-col items-center text-center "
>
<h2 className=" rounded-full h-20 w-20 bg-gradient-to-b from-[#E7DBC8] to-pink-50 flex items-center justify-center">
{category.logo}
</h2>
<h3 className=" sm:text-lg text-sm font-semibold">
{category.title}
</h3>
<p className="mt-2 text-xs sm:text-[0.96rem] text-gray-600">
{category.description}
</p>
</div>
))}
</div>
</div>
</div>
</div>
)
}
);
};
export default PremuimBannerThree
export default PremuimBannerThree;