Files
rudarksh-frontend/components/online-pooja/PoojaSubscription.jsx
2025-02-19 17:00:55 +05:30

86 lines
2.6 KiB
JavaScript

import React from "react";
import {
Card,
CardHeader,
CardContent,
CardFooter,
} from "@/components/ui/card";
const SubscriptionCard = ({ title, price, description, features, isDaily }) => (
<div
className={`sm:w-[40%] w-full sm:p-7 ${
isDaily ? "bg-[#B48D4F] text-white" : "bg-[#F9F5EF] text-zinc-800"
}`}
>
<CardHeader>
<h2 className="text-2xl font-bold sm:text-4xl sm:pb-3">{title}</h2>
<p className="text-2xl font-semibold">{price}</p>
</CardHeader>
<CardContent>
<p className="mb-4 py-3">{description}</p>
<ul className="list-disc pl-5">
{features.map((feature, index) => (
<li key={index} className="mb-2 sm:mb-6">
{feature}
</li>
))}
</ul>
</CardContent>
<CardFooter>
<button
className={`${
isDaily ? "bg-black text-white" : "bg-[#B48D4F] "
}text-zinc-50 px-4 py-3 `}
>
Subscribe
</button>
</CardFooter>
</div>
);
const PoojaSubscription = () => (
<>
<h1 className="text-2xl sm:text-5xl text-center sm:pt-16">
Pooja Subscription
</h1>
<p className="sm:text-lg text-center pt-2 sm:pb-14 pb-4">
Experience divine blessings at your doorstep. Subscribe to our Pooja
services for spiritual harmony.
</p>
<div className="flex sm:flex-row flex-col justify-center sm:space-x-8">
<SubscriptionCard
title="Daily Subscription"
price="Rs. 4,400.00"
description="A certified Pundit will perform a Rudrabhishek and Chandi Path every day at the premises of Lord Pashupatinath temple for you and your family members!"
features={[
"Pooja Performed every day",
"High-quality Video Shared everyday",
"Includes 2 certified Pundits",
"Brahman Bhoojan (meal) included",
"New Material used every day",
"Prasad Shared every month",
"Special requests accepted if applicable",
]}
isDaily={true}
/>
<SubscriptionCard
title="Monthly Subscription"
price="Rs. 9,500.00"
description="A certified Pundit will perform a Rudrabhishek every month at the premises of Lord Pashupatinath temple for you and your family members!"
features={[
"A Rudraksha Expert to answer your questions and provide Rudraksha consultation",
"Pooja Performed every month",
"High-quality Video Shared monthly",
"Includes 1 certified Pundits",
"Brahman Bhoojan (meal) included",
"New Material used every month",
]}
isDaily={false}
/>
</div>
</>
);
export default PoojaSubscription;